Added @lagoonScripts and @lagoonStyles directives

Those will replace the inline scripts and hopefully generate cleaner code
Helvetitec · Aug 7, 2023 · 6c322c9 · 6c322c9
1 parent cf7eb97
commit 6c322c9
Show file tree

Hide file tree

Showing 10 changed files with 23 additions and 108 deletions.
diff --git a/resources/views/livewire/area-chart.blade.php b/resources/views/livewire/area-chart.blade.php
@@ -1,18 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-              google.charts.load('current', {'packages':['corechart'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
-
+  {{-- Add @lagoonScripts('en') --}}
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});
 

diff --git a/resources/views/livewire/bar-chart.blade.php b/resources/views/livewire/bar-chart.blade.php
@@ -1,18 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-              google.charts.load('current', {'packages':['corechart'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
-
+  {{-- Add @lagoonScripts('en') --}}
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});
 

diff --git a/resources/views/livewire/candlestick-chart.blade.php b/resources/views/livewire/candlestick-chart.blade.php
@@ -1,18 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-              google.charts.load('current', {'packages':['corechart'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
-
+  {{-- Add @lagoonScripts('en') --}}
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});
 

diff --git a/resources/views/livewire/column-chart.blade.php b/resources/views/livewire/column-chart.blade.php
@@ -1,18 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-              google.charts.load('current', {'packages':['corechart'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
-
+  {{-- Add @lagoonScripts('en') --}}
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});
 

diff --git a/resources/views/livewire/gantt-chart.blade.php b/resources/views/livewire/gantt-chart.blade.php
@@ -1,4 +1,5 @@
 <div>
+    {{-- Add @lagoonScripts('en', 'gantt') --}}
     @once
         @push('styles')
             <style>

diff --git a/resources/views/livewire/line-chart.blade.php b/resources/views/livewire/line-chart.blade.php
@@ -1,17 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-              google.charts.load('current', {'packages':['corechart'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
+  {{-- Add @lagoonScripts('en') --}}
 
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});

diff --git a/resources/views/livewire/pie-chart.blade.php b/resources/views/livewire/pie-chart.blade.php
@@ -1,17 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-             google.charts.load('current', {'packages':['corechart'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
+    {{-- Add @lagoonScripts('en') --}}
 
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});

diff --git a/resources/views/livewire/timeline.blade.php b/resources/views/livewire/timeline.blade.php
@@ -1,17 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-              google.charts.load('current', {'packages':['timeline'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
+    {{-- Add @lagoonScripts('en', 'timeline') --}}
 
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});

diff --git a/resources/views/livewire/waterfall-chart.blade.php b/resources/views/livewire/waterfall-chart.blade.php
@@ -1,17 +1,5 @@
 <div>
-    @once
-        @push('styles')
-            <style>
-                svg > g > g.google-visualization-tooltip { pointer-events: none }
-            </style>
-        @endpush
-        @push('headerScripts')
-            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-            <script type="text/javascript">
-              google.charts.load('current', {'packages':['corechart'], 'language': '{{ $localization }}'});
-            </script>
-        @endpush
-    @endonce
+  {{-- Add @lagoonScripts('en') --}}
 
     <script type="text/javascript">
         google.charts.setOnLoadCallback(drawChart{{ $chartId }});

diff --git a/src/LagoonServiceProvider.php b/src/LagoonServiceProvider.php
@@ -11,6 +11,7 @@
 use Helvetitec\LagoonCharts\Http\Livewire\GanttChart;
 use Helvetitec\LagoonCharts\Http\Livewire\Timeline;
 use Helvetitec\LagoonCharts\Http\Livewire\WaterfallChart;
+use Illuminate\Support\Facades\Blade;
 use Illuminate\Support\ServiceProvider;
 use Livewire\Livewire;
 
@@ -34,6 +35,19 @@ public function boot()
     Livewire::component('lagoon-waterfall-chart', WaterfallChart::class);
     Livewire::component('lagoon-timeline', Timeline::class);
 
+    Blade::directive('lagoonScripts', function ($localization, $package = 'corechart') {
+      return '<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
+      <script type="text/javascript">
+        google.charts.load(\'current\', {\'packages\':[\''.$package.'\'], \'language\': \''.$localization.'\'});
+      </script>';
+    });
+
+    Blade::directive('lagoonStyles', function ($localization) {
+      return '<style>
+      svg > g > g.google-visualization-tooltip { pointer-events: none }
+      </style>';
+    });
+
     if ($this->app->runningInConsole())
     {
       $this->publishes([