This is an automated email from the ASF dual-hosted git repository. humbedooh pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/incubator-ponymail-foal.git
commit 6612556a5bc8c0a9274d4ed36b6f14594de75ab5 Author: Daniel Gruno <[email protected]> AuthorDate: Mon Dec 13 23:43:16 2021 +0100 Make sidebar stats optional, expand calendar if hidden. --- webui/css/scaffolding.css | 7 +++++- webui/js/source/aavariables.js | 1 + webui/js/source/preferences.js | 23 ++++++++++++++++++- webui/js/source/primer.js | 16 ++++++++++++-- webui/js/source/sidebar-calendar.js | 44 ++++++++++++++++++++----------------- webui/js/source/sidebar-stats.js | 8 +++++-- 6 files changed, 73 insertions(+), 26 deletions(-) diff --git a/webui/css/scaffolding.css b/webui/css/scaffolding.css index a7ea6f0..a435ab8 100644 --- a/webui/css/scaffolding.css +++ b/webui/css/scaffolding.css @@ -696,12 +696,17 @@ a.dropdown-toggle { } #display_options_dropdown > div { + width: 100%; + overflow-y: auto; +} + +#display_options_dropdown > div > div { width: 45%; float: left; margin: 2%; } -#display_options_dropdown > div:first-child { +#display_options_dropdown > div > div:first-child { border-right: 2px solid #3333; } diff --git a/webui/js/source/aavariables.js b/webui/js/source/aavariables.js index b3e3420..4fcaf74 100644 --- a/webui/js/source/aavariables.js +++ b/webui/js/source/aavariables.js @@ -53,6 +53,7 @@ let G_current_per_page = 0; // sidebar calendar const MONTHS_SHORTENED = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; const CALENDAR_YEARS_SHOWN = 4; // TODO: should this be configurable? +let G_show_stats_sidebar = true; // Whether to show author stats or not // datepicker const DAYS_SHORTENED = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] diff --git a/webui/js/source/preferences.js b/webui/js/source/preferences.js index 0789b44..3ca036a 100644 --- a/webui/js/source/preferences.js +++ b/webui/js/source/preferences.js @@ -37,6 +37,9 @@ function init_preferences(state, json) { if (ljson.G_current_listmode_compact !== undefined) { G_current_listmode_compact = ljson.G_current_listmode_compact; } + if (ljson.G_show_stats_sidebar !== undefined) { + G_show_stats_sidebar = ljson.G_show_stats_sidebar; + } } } @@ -53,6 +56,10 @@ function init_preferences(state, json) { if (cld) { cld.checked = !G_chatty_layout; } + let cla = document.getElementById('G_show_stats_sidebar'); + if (cla) { + cla.checked = G_show_stats_sidebar; + } // Set list display mode: let dmt = document.getElementById('display_mode_threaded'); @@ -134,7 +141,8 @@ function save_preferences() { let ljson = { G_chatty_layout: G_chatty_layout, G_current_listmode: G_current_listmode, - G_current_listmode_compact: G_current_listmode_compact + G_current_listmode_compact: G_current_listmode_compact, + G_show_stats_sidebar: G_show_stats_sidebar }; let lstring = JSON.stringify(ljson); window.localStorage.setItem('G_ponymail_preferences', lstring); @@ -182,3 +190,16 @@ function set_skin_permalink(enable_chatty) { save_preferences(); parse_permalink(); } + +function set_show_stats(display) { + G_show_stats_sidebar = display; + if (display === false) { + document.getElementById('sidebar_stats').style.display = "none"; + document.getElementById('sidebar_wordcloud').style.display = "none"; + } else { + document.getElementById('sidebar_stats').style.display = "block"; + document.getElementById('sidebar_wordcloud').style.display = "block"; + } + save_preferences(); + renderCalendar(); +} \ No newline at end of file diff --git a/webui/js/source/primer.js b/webui/js/source/primer.js index f83bd56..cbec6fc 100644 --- a/webui/js/source/primer.js +++ b/webui/js/source/primer.js @@ -24,7 +24,13 @@ function renderListView(state, json) { G_current_state = state; async_escrow['rendering'] = new Date(); if (!state || state.update_calendar !== false) { - renderCalendar(json.firstYear, json.firstMonth, json.lastYear, json.lastMonth, json.active_months); + renderCalendar({ + FY: json.firstYear, + FM: json.firstMonth, + LY: json.lastYear, + LM: json.lastMonth, + activity: json.active_months + }); } // sort threads by date if (isArray(json.thread_struct)) { @@ -182,7 +188,13 @@ function render_virtual_inbox(state, json) { async_escrow['rendering'] = new Date(); if (!state || state.update_calendar !== false) { - renderCalendar(json.firstYear, json.firstMonth, json.lastYear, json.lastMonth, json.active_months); + renderCalendar({ + FY: json.firstYear, + FM: json.firstMonth, + LY: json.lastYear, + LM: json.lastMonth, + activity: json.active_months + }); } // sort threads by date if (isArray(json.thread_struct)) { diff --git a/webui/js/source/sidebar-calendar.js b/webui/js/source/sidebar-calendar.js index 8a9ea2d..3e1ed41 100644 --- a/webui/js/source/sidebar-calendar.js +++ b/webui/js/source/sidebar-calendar.js @@ -16,10 +16,13 @@ */ let calendar_index = 0; +let current_calendar_size = CALENDAR_YEARS_SHOWN; +let calendar_state = {} -function renderCalendar(FY, FM, LY, LM, activity = null) { +function renderCalendar(state) { + calendar_state = state ? state : calendar_state; calendar_index = 0; - + current_calendar_size = G_show_stats_sidebar ? CALENDAR_YEARS_SHOWN : CALENDAR_YEARS_SHOWN * 3; // Only render if calendar div is present let cal = document.getElementById('sidebar_calendar'); if (!cal) { @@ -29,10 +32,11 @@ function renderCalendar(FY, FM, LY, LM, activity = null) { let now = new Date(); let CY = now.getFullYear(); let CM = now.getMonth() + 1; - let SY = Math.min(LY, CY); // last year in calendar, considering current date + let SY = Math.min(calendar_state.LY, CY); // last year in calendar, considering current date + // If Last Year is into the future, set Last Month to this one. - if (LY > CY) { - LM = CM; + if (calendar_state.LY > CY) { + calendar_state.LM = CM; } let cdiv = new HTML('div', { @@ -45,7 +49,7 @@ function renderCalendar(FY, FM, LY, LM, activity = null) { class: 'sidebar_calendar_chevron' }); chevron.inject(new HTML('span', { - onclick: 'calendar_scroll(this, -4);', + onclick: 'calendar_scroll(this, -1);', style: { display: 'none' }, @@ -56,7 +60,7 @@ function renderCalendar(FY, FM, LY, LM, activity = null) { cdiv.inject(chevron); // Create divs for each year, assign all visible - for (let Y = SY; Y >= FY; Y--) { + for (let Y = SY; Y >= calendar_state.FY; Y--) { let ydiv = new HTML('div', { class: 'sidebar_calendar_year', id: 'sidebar_calendar_' + N++ @@ -73,34 +77,34 @@ function renderCalendar(FY, FM, LY, LM, activity = null) { // Mark out-of-bounds segments let ym = '%04u-%02u'.format(Y, i+1); let c_active = true; - if (activity && !activity[ym]) { + if (calendar_state.activity && !calendar_state.activity[ym]) { c_active = false; } - if ((Y == SY && i >= LM) || (Y == CY && i > CM)) { + if ((Y == SY && i >= calendar_state.LM) || (Y == CY && i > CM)) { c_active = false; } - if (Y == FY && ((i + 1) < FM)) { + if (Y == calendar_state.FY && ((i + 1) < calendar_state.FM)) { c_active = false; } if (!c_active) { mdiv.setAttribute("class", "sidebar_calendar_month_nothing"); mdiv.setAttribute("onclick", "javascript:void(0);"); - } else if (activity && activity[ym]) { - let count = activity[ym]; + } else if (calendar_state.activity && calendar_state.activity[ym]) { + let count = calendar_state.activity[ym]; if (count >= 1000) { count = Math.round(count/100.0); // nearest century count = Math.floor(count/10) + "k" + (count % 10); // thousands and remainder } else { count = count.toString(); } - mdiv.inject(new HTML('span', {title: `${activity[ym].pretty()} emails this month`, class: 'calendar_count'}, count)); + mdiv.inject(new HTML('span', {title: `${calendar_state.activity[ym].pretty()} emails this month`, class: 'calendar_count'}, count)); } ydiv.inject(mdiv); } cdiv.inject(ydiv); } - cal.innerHTML = "<p style='text-align: center;'>Archives (%u - %u):</p>".format(FY, SY); + cal.innerHTML = "<p style='text-align: center;'>Archives (%u - %u):</p>".format(calendar_state.FY, SY); cal.inject(cdiv); @@ -108,7 +112,7 @@ function renderCalendar(FY, FM, LY, LM, activity = null) { class: 'sidebar_calendar_chevron' }); chevron.inject(new HTML('span', { - onclick: 'calendar_scroll(this, 4);', + onclick: 'calendar_scroll(this, 1);', style: { display: 'none' }, @@ -118,9 +122,9 @@ function renderCalendar(FY, FM, LY, LM, activity = null) { }, " ")); cdiv.inject(chevron); - // If we have > 4 years, hide the rest - if (N > CALENDAR_YEARS_SHOWN) { - for (let i = CALENDAR_YEARS_SHOWN; i < N; i++) { + // If we have > N years, hide the rest + if (N > current_calendar_size) { + for (let i = current_calendar_size; i < N; i++) { let obj = document.getElementById('sidebar_calendar_' + i); if (obj) { obj.style.display = "none"; @@ -130,8 +134,8 @@ function renderCalendar(FY, FM, LY, LM, activity = null) { } } -function calendar_scroll(me, x) { - console.log(me) +function calendar_scroll(me, direction) { + let x = direction * current_calendar_size; let years = document.getElementsByClassName('sidebar_calendar_year'); calendar_index = Math.max(Math.min(years.length - x, calendar_index + x), 0); if (calendar_index > 0) { diff --git a/webui/js/source/sidebar-stats.js b/webui/js/source/sidebar-stats.js index d323bca..a75a4b5 100644 --- a/webui/js/source/sidebar-stats.js +++ b/webui/js/source/sidebar-stats.js @@ -15,6 +15,7 @@ limitations under the License. */ + async function sidebar_stats(json) { let obj = document.getElementById('sidebar_stats'); if (!obj) { @@ -46,7 +47,7 @@ async function sidebar_stats(json) { // Top 10 participants obj.inject("Found %u emails by %u authors, divided into %u topics.".format(json.emails.length, json.numparts, json.no_threads)); - obj.inject(new HTML('h5', {}, "Most active authors:")); + obj.inject(new HTML('h5', {}, "Most active authors: ")); for (let i = 0; i < json.participants.length; i++) { if (i >= 5) { break; @@ -82,5 +83,8 @@ async function sidebar_stats(json) { wordCloud(json.cloud, 220, 100, wc); }, 50); } - + if (G_show_stats_sidebar === false) { + obj.style.display = "none"; + wc.style.display = "none"; + } }
