diff --git a/public/openapi/read/admin/dashboard.yaml b/public/openapi/read/admin/dashboard.yaml index 72f989b2b2..351645850c 100644 --- a/public/openapi/read/admin/dashboard.yaml +++ b/public/openapi/read/admin/dashboard.yaml @@ -11,6 +11,8 @@ get: allOf: - type: object properties: + graphTitle: + type: string version: type: string lookupFailed: diff --git a/public/openapi/read/admin/dashboard/logins.yaml b/public/openapi/read/admin/dashboard/logins.yaml index 2b3280eed3..a5992b7f2c 100644 --- a/public/openapi/read/admin/dashboard/logins.yaml +++ b/public/openapi/read/admin/dashboard/logins.yaml @@ -11,6 +11,8 @@ get: allOf: - type: object properties: + graphTitle: + type: string set: type: string description: The analytics set that is being queried diff --git a/public/openapi/read/admin/dashboard/topics.yaml b/public/openapi/read/admin/dashboard/topics.yaml index 7b3ffab7b7..c0d0700c8d 100644 --- a/public/openapi/read/admin/dashboard/topics.yaml +++ b/public/openapi/read/admin/dashboard/topics.yaml @@ -11,6 +11,8 @@ get: allOf: - type: object properties: + graphTitle: + type: string set: type: string description: The analytics set that is being queried diff --git a/public/openapi/read/admin/dashboard/users.yaml b/public/openapi/read/admin/dashboard/users.yaml index 67c101d943..f81bdc3d5d 100644 --- a/public/openapi/read/admin/dashboard/users.yaml +++ b/public/openapi/read/admin/dashboard/users.yaml @@ -11,6 +11,8 @@ get: allOf: - type: object properties: + graphTitle: + type: string set: type: string description: The analytics set that is being queried diff --git a/public/src/admin/dashboard.js b/public/src/admin/dashboard.js index baadbf0c60..8be06177b0 100644 --- a/public/src/admin/dashboard.js +++ b/public/src/admin/dashboard.js @@ -349,25 +349,26 @@ function setupGraphs(callback) { updateTrafficGraph(); - $('[data-action="updateGraph"]:not([data-units="custom"])').on('click', function () { + $('[data-action="updateGraph"]').on('change', function () { + let amount = $(this).val(); + if (amount === 'custom') { + throwCustomRangeSelector($(this)); + return; + } + const units = amount === '1' ? 'hours' : 'days'; let until = new Date(); - const amount = $(this).attr('data-amount'); - if ($(this).attr('data-units') === 'days') { + if (amount !== '1') { until.setHours(0, 0, 0, 0); } + if (amount === '1') { // change 1 day to 24 hours + amount = '24'; + } until = until.getTime(); - updateTrafficGraph($(this).attr('data-units'), until, amount); - - require(['translator'], function (translator) { - translator.translate('[[admin/dashboard:page-views-custom]]', function (translated) { - $('[data-action="updateGraph"][data-units="custom"]').text(translated); - }); - }); + updateTrafficGraph(units, until, amount); + $('[data-action="updateGraph"] option[value="range"]').addClass('hidden'); }); - $('[data-action="updateGraph"][data-units="custom"]').on('click', function () { - const targetEl = $(this); - + function throwCustomRangeSelector(targetEl) { Benchpress.render('admin/partials/pageviews-range-select', {}).then(function (html) { const modal = bootbox.dialog({ title: '[[admin/dashboard:page-views-custom]]', @@ -415,10 +416,11 @@ function setupGraphs(callback) { // Update "custom range" label targetEl.attr('data-startRange', formData.startRange); targetEl.attr('data-endRange', formData.endRange); - targetEl.html(formData.startRange + ' – ' + formData.endRange); + targetEl.find('option[value="range"]').text(formData.startRange + ' - ' + formData.endRange); + targetEl.val('range'); } }); - }); + } callback(); }); diff --git a/public/src/admin/modules/dashboard-line-graph.js b/public/src/admin/modules/dashboard-line-graph.js index 2ae9d5efde..3087518c9d 100644 --- a/public/src/admin/modules/dashboard-line-graph.js +++ b/public/src/admin/modules/dashboard-line-graph.js @@ -83,6 +83,12 @@ export function init({ set, dataset }) { }, }, }, + plugins: { + legend: { + display: false, + position: 'bottom', + }, + }, interaction: { intersect: false, mode: 'index', @@ -100,25 +106,26 @@ export function init({ set, dataset }) { } function handleUpdateControls({ set }) { - $('[data-action="updateGraph"]:not([data-units="custom"])').on('click', function () { + $('[data-action="updateGraph"]').on('change', function () { + let amount = $(this).val(); + if (amount === 'custom') { + throwCustomRangeSelector($(this)); + return; + } + const units = amount === '1' ? 'hours' : 'days'; let until = new Date(); - const amount = $(this).attr('data-amount'); - if ($(this).attr('data-units') === 'days') { + if (amount !== '1') { until.setHours(0, 0, 0, 0); } + if (amount === '1') { // change 1 day to 24 hours + amount = '24'; + } until = until.getTime(); - update(set, $(this).attr('data-units'), until, amount); - - require(['translator'], function (translator) { - translator.translate('[[admin/dashboard:page-views-custom]]', function (translated) { - $('[data-action="updateGraph"][data-units="custom"]').text(translated); - }); - }); + update(set, units, until, amount); + $('[data-action="updateGraph"] option[value="range"]').addClass('hidden'); }); - $('[data-action="updateGraph"][data-units="custom"]').on('click', function () { - const targetEl = $(this); - + function throwCustomRangeSelector(targetEl) { Benchpress.render('admin/partials/pageviews-range-select', {}).then(function (html) { const modal = bootbox.dialog({ title: '[[admin/dashboard:page-views-custom]]', @@ -166,10 +173,11 @@ function handleUpdateControls({ set }) { // Update "custom range" label targetEl.attr('data-startRange', formData.startRange); targetEl.attr('data-endRange', formData.endRange); - targetEl.html(formData.startRange + ' – ' + formData.endRange); + targetEl.find('option[value="range"]').text(formData.startRange + ' - ' + formData.endRange); + targetEl.val('range'); } }); - }); + } } function update( diff --git a/src/controllers/admin/dashboard.js b/src/controllers/admin/dashboard.js index 439b79af0d..f573c5e677 100644 --- a/src/controllers/admin/dashboard.js +++ b/src/controllers/admin/dashboard.js @@ -32,6 +32,7 @@ dashboardController.get = async function (req, res) { const latestValidVersion = semver.valid(latestVersion); res.render('admin/dashboard', { + graphTitle: '[[admin/dashboard:forum-traffic]]', version: version, lookupFailed: latestValidVersion === null, latestVersion: latestValidVersion, @@ -131,6 +132,7 @@ async function getStats() { } let results = (await Promise.all([ + getStatsFromAnalytics('pageviews', ''), getStatsFromAnalytics('uniquevisitors', ''), getStatsFromAnalytics('logins', 'loginCount'), getStatsForSet('users:joindate', 'userCount'), @@ -140,24 +142,25 @@ async function getStats() { meta.config.activitypubEnabled ? getStatsForSet('topicsRemote:tid', '') : null, ])).filter(Boolean); - results[0].name = '[[admin/dashboard:unique-visitors]]'; + results[0].name = '[[admin/dashboard:graphs.page-views]]'; + results[1].name = '[[admin/dashboard:unique-visitors]]'; - results[1].name = '[[admin/dashboard:logins]]'; - results[1].href = `${nconf.get('relative_path')}/admin/dashboard/logins`; + results[2].name = '[[admin/dashboard:logins]]'; + results[2].href = `${nconf.get('relative_path')}/admin/dashboard/logins`; - results[2].name = '[[admin/dashboard:new-users]]'; - results[2].href = `${nconf.get('relative_path')}/admin/dashboard/users`; + results[3].name = '[[admin/dashboard:new-users]]'; + results[3].href = `${nconf.get('relative_path')}/admin/dashboard/users`; - results[3].name = '[[admin/dashboard:posts]]'; + results[4].name = '[[admin/dashboard:posts]]'; - results[4].name = '[[admin/dashboard:topics]]'; - results[4].href = `${nconf.get('relative_path')}/admin/dashboard/topics`; + results[5].name = '[[admin/dashboard:topics]]'; + results[5].href = `${nconf.get('relative_path')}/admin/dashboard/topics`; - if (results[5]) { - results[5].name = '[[admin/dashboard:remote-posts]]'; - } if (results[6]) { - results[6].name = '[[admin/dashboard:remote-topics]]'; + results[6].name = '[[admin/dashboard:remote-posts]]'; + } + if (results[7]) { + results[7].name = '[[admin/dashboard:remote-topics]]'; } ({ results } = await plugins.hooks.fire('filter:admin.getStats', { @@ -287,6 +290,7 @@ dashboardController.getLogins = async (req, res) => { sessions = _.flatten(sessions).sort((a, b) => b.datetime - a.datetime); res.render('admin/dashboard/logins', { + graphTitle: '[[admin/dashboard:logins]]', set: 'logins', query: _.pick(req.query, ['units', 'until', 'count']), stats, @@ -315,6 +319,7 @@ dashboardController.getUsers = async (req, res) => { const users = await user.getUsersData(uids); res.render('admin/dashboard/users', { + graphTitle: '[[admin/dashboard:new-users]]', set: 'registrations', query: _.pick(req.query, ['units', 'until', 'count']), stats, @@ -342,6 +347,7 @@ dashboardController.getTopics = async (req, res) => { const topicData = await topics.getTopicsByTids(tids); res.render('admin/dashboard/topics', { + graphTitle: '[[admin/dashboard:topics]]', set: 'topics', query: _.pick(req.query, ['units', 'until', 'count']), stats, diff --git a/src/views/admin/partials/dashboard/graph.tpl b/src/views/admin/partials/dashboard/graph.tpl index 207cc9998c..e6eb91ff29 100644 --- a/src/views/admin/partials/dashboard/graph.tpl +++ b/src/views/admin/partials/dashboard/graph.tpl @@ -1,36 +1,24 @@ -
+
-
- [[admin/dashboard:forum-traffic]] +
+ {graphTitle}
+
-
-
- -
-
-
- -
-
{{{ if summary.week }}}{./summary.week}{{{ else }}}0{{{ end }}}
- -
- -
-
- -
+
+
+
\ No newline at end of file