From 6c33b9982b9f6bba05eeaf16de5f274fc16cd2fd Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Tue, 12 Dec 2023 16:55:14 +0200 Subject: [PATCH 1/6] fix: prevent infinite chart reloading on elementor --- js/render-facade.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/js/render-facade.js b/js/render-facade.js index 37b764e3..546d3070 100644 --- a/js/render-facade.js +++ b/js/render-facade.js @@ -4,6 +4,9 @@ var vizClipboard1=null; (function($, visualizer){ + // Once the facade is loaded, we need to refresh the charts. But we need to it one time only per chart. + var chartReloadedAfterFacade = []; + function initActionsButtons(v) { if($('a.visualizer-chart-shortcode').length > 0 && vizClipboard1 === null) { vizClipboard1 = new ClipboardJS('a.visualizer-chart-shortcode'); // jshint ignore:line @@ -144,8 +147,13 @@ var vizClipboard1=null; if ( $(element).is(':visible') ) { var id = $(element).addClass('viz-facade-loaded').attr('id'); showChart(id); + + // Reload the chart and mark it as reloaded. + if ( chartReloadedAfterFacade.indexOf( id ) === -1 ) { + refreshEachCharts(); + chartReloadedAfterFacade.push( id ); + } } - refreshEachCharts(); }); // interate through all charts that are to be lazy-loaded and observe each one. From 1cb2e5526102a132dcf34d14ef09cba0dabb3b81 Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Tue, 12 Dec 2023 16:55:42 +0200 Subject: [PATCH 2/6] fix: do not render google charts if the data is not available --- js/render-google.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/js/render-google.js b/js/render-google.js index ab5a3cf5..df243433 100644 --- a/js/render-google.js +++ b/js/render-google.js @@ -14,9 +14,18 @@ var isResizeRequest = false; var rendered_charts = []; function renderChart(id) { + + if ( ! all_charts || 0 === Object.keys( all_charts ).length ) { + return; + } + var chart = all_charts[id]; var hasAnnotation = false; + if ( ! chart ) { + return; + } + // re-render the chart only if it doesn't have annotations and it is on the front-end // this is to prevent the chart from showing "All series on a given axis must be of the same data type" during resize. // remember, some charts do not support annotations so they should not be included in this. From 6f8a45fb6fa3e1d25bd1a213a0cd6d2850b5f62a Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Tue, 12 Dec 2023 17:50:19 +0200 Subject: [PATCH 3/6] refactor: improve the chart rendering conditions --- js/render-facade.js | 38 +++++++++++++++++++------------------- 1 file changed, 19 insertions(+), 19 deletions(-) diff --git a/js/render-facade.js b/js/render-facade.js index 546d3070..d8372a31 100644 --- a/js/render-facade.js +++ b/js/render-facade.js @@ -3,10 +3,7 @@ /* global jQuery */ var vizClipboard1=null; (function($, visualizer){ - - // Once the facade is loaded, we need to refresh the charts. But we need to it one time only per chart. - var chartReloadedAfterFacade = []; - + function initActionsButtons(v) { if($('a.visualizer-chart-shortcode').length > 0 && vizClipboard1 === null) { vizClipboard1 = new ClipboardJS('a.visualizer-chart-shortcode'); // jshint ignore:line @@ -116,13 +113,13 @@ var vizClipboard1=null; return; } setTimeout( function() { - displayChartsOnFrontEnd(); + displayChartsOnFrontEnd(); }, 100 ); } function initChartDisplay() { if(visualizer.is_front == true){ // jshint ignore:line - displayChartsOnFrontEnd(); + displayChartsOnFrontEnd(); }else{ showChart(); } @@ -141,20 +138,23 @@ var vizClipboard1=null; } function displayChartsOnFrontEnd() { - // display all charts that are NOT to be lazy-loaded. - $( 'div.viz-facade-loaded:not(.visualizer-lazy):not(.visualizer-cw-error):empty' ).removeClass( 'viz-facade-loaded' ); - $('div.visualizer-front:not(.visualizer-lazy):not(.viz-facade-loaded)').each(function(index, element){ - if ( $(element).is(':visible') ) { - var id = $(element).addClass('viz-facade-loaded').attr('id'); - showChart(id); - - // Reload the chart and mark it as reloaded. - if ( chartReloadedAfterFacade.indexOf( id ) === -1 ) { - refreshEachCharts(); - chartReloadedAfterFacade.push( id ); + + // Render the charts that are not lazy-loaded and with no errors. + var nonLazyLoadedCharts = $('div.visualizer-front:not(.viz-facade-loaded):not(.visualizer-lazy):not(.visualizer-cw-error'); + + if ( nonLazyLoadedCharts.length ) { + nonLazyLoadedCharts.each(function(index, element){ + if ( $(element).is(':visible') ) { + var id = $(element).addClass('viz-facade-loaded').attr('id'); + showChart(id); } - } - }); + }); + + refreshEachCharts(); + } else { + // Remove the loaded status for charts that are empty. + $( 'div.viz-facade-loaded:not(.visualizer-lazy):not(.visualizer-cw-error):empty' ).removeClass( 'viz-facade-loaded' ); + } // interate through all charts that are to be lazy-loaded and observe each one. $('div.visualizer-front.visualizer-lazy').each(function(index, element){ From c2db87903472ba3d16cb177076cdbee9188d6c85 Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Tue, 12 Dec 2023 18:39:22 +0200 Subject: [PATCH 4/6] refactor: simplify the rendering --- js/render-facade.js | 32 ++++++-------------------------- 1 file changed, 6 insertions(+), 26 deletions(-) diff --git a/js/render-facade.js b/js/render-facade.js index d8372a31..fde747d1 100644 --- a/js/render-facade.js +++ b/js/render-facade.js @@ -107,16 +107,6 @@ var vizClipboard1=null; registerDefaultActions(); }); - // Refresh charts if chart not generated. - function refreshEachCharts() { - if ( 'object' === typeof window.fusionAnimationsVars ) { - return; - } - setTimeout( function() { - displayChartsOnFrontEnd(); - }, 100 ); - } - function initChartDisplay() { if(visualizer.is_front == true){ // jshint ignore:line displayChartsOnFrontEnd(); @@ -139,22 +129,12 @@ var vizClipboard1=null; function displayChartsOnFrontEnd() { - // Render the charts that are not lazy-loaded and with no errors. - var nonLazyLoadedCharts = $('div.visualizer-front:not(.viz-facade-loaded):not(.visualizer-lazy):not(.visualizer-cw-error'); - - if ( nonLazyLoadedCharts.length ) { - nonLazyLoadedCharts.each(function(index, element){ - if ( $(element).is(':visible') ) { - var id = $(element).addClass('viz-facade-loaded').attr('id'); - showChart(id); - } - }); - - refreshEachCharts(); - } else { - // Remove the loaded status for charts that are empty. - $( 'div.viz-facade-loaded:not(.visualizer-lazy):not(.visualizer-cw-error):empty' ).removeClass( 'viz-facade-loaded' ); - } + $('div.visualizer-front:not(.viz-facade-loaded):not(.visualizer-lazy):not(.visualizer-cw-error):empty').each(function(index, element){ + if ( $(element).is(':visible') ) { + var id = $(element).addClass('viz-facade-loaded').attr('id'); + showChart(id); + } + }); // interate through all charts that are to be lazy-loaded and observe each one. $('div.visualizer-front.visualizer-lazy').each(function(index, element){ From b94b1c967fef9d3911d7bd5be71e69ec357d6727 Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Wed, 13 Dec 2023 13:13:15 +0200 Subject: [PATCH 5/6] chore: formating --- js/render-facade.js | 4 ++-- js/render-google.js | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/js/render-facade.js b/js/render-facade.js index fde747d1..5a905d77 100644 --- a/js/render-facade.js +++ b/js/render-facade.js @@ -109,8 +109,8 @@ var vizClipboard1=null; function initChartDisplay() { if(visualizer.is_front == true){ // jshint ignore:line - displayChartsOnFrontEnd(); - }else{ + displayChartsOnFrontEnd(); + } else { showChart(); } } diff --git a/js/render-google.js b/js/render-google.js index df243433..f84b636a 100644 --- a/js/render-google.js +++ b/js/render-google.js @@ -15,7 +15,7 @@ var isResizeRequest = false; function renderChart(id) { - if ( ! all_charts || 0 === Object.keys( all_charts ).length ) { + if ( ! all_charts || 0 === Object.keys( all_charts ).length ) { return; } From 8a0dfcb7401da2f58fd41ee56a4c161e3c356d30 Mon Sep 17 00:00:00 2001 From: "Soare Robert Daniel (Mac 2023)" Date: Fri, 15 Dec 2023 16:41:08 +0200 Subject: [PATCH 6/6] fix: add chart rendering delay --- js/render-facade.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/render-facade.js b/js/render-facade.js index 5a905d77..24f3f5c1 100644 --- a/js/render-facade.js +++ b/js/render-facade.js @@ -132,7 +132,10 @@ var vizClipboard1=null; $('div.visualizer-front:not(.viz-facade-loaded):not(.visualizer-lazy):not(.visualizer-cw-error):empty').each(function(index, element){ if ( $(element).is(':visible') ) { var id = $(element).addClass('viz-facade-loaded').attr('id'); - showChart(id); + setTimeout(function(){ + // Add a short delay between each chart to avoid overloading the browser event loop. + showChart(id); + }, ( index + 1 ) * 100); } });