Centralise dependant js/css files

This commit is contained in:
Deon George 2021-11-13 17:00:08 +11:00
parent 3c8895a238
commit 28cdedb327
17 changed files with 140 additions and 86 deletions

View File

@ -0,0 +1,79 @@
<?php
namespace App\Providers;
use Illuminate\Support\Facades\Blade;
use Illuminate\Support\ServiceProvider;
class CustomBladeServiceProvider extends ServiceProvider
{
/**
* Register services.
*
* @return void
*/
public function register()
{
//
}
/**
* Bootstrap services.
*
* @return void
*/
public function boot()
{
Blade::directive('css',function($expression) {
switch (trim($expression,"'")) {
case 'datatables':
return
'<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen">'.
'<link type="text/css" rel="stylesheet" href="'.asset('plugin/dataTables/dataTables.bootstrap5.css').'" media="screen">';
case 'select2':
return
'<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css">';
case 'simplemde':
return
'<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">';
default:
throw new \Exception('Unknown CSS: '.$expression);
}
});
Blade::directive('js',function($expression) {
switch (trim($expression,"'")) {
case 'datatables':
return
'<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>'.
'<script type="text/javascript" src="'.asset('plugin/dataTables/dataTables.conditionalPaging.js').'"></script>'.
'<script type="text/javascript" src="https://cdn.datatables.net/rowgroup/1.1.2/js/dataTables.rowGroup.min.js"></script>'.
'<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>';
case 'highcharts':
return
'<script type="text/javascript" src="https://code.highcharts.com/highcharts.js"></script>'.
'<script type="text/javascript" src="https://code.highcharts.com/modules/data.js"></script>'.
'<script type="text/javascript" src="https://code.highcharts.com/modules/drilldown.js"></script>'.
'<script type="text/javascript" src="https://code.highcharts.com/modules/exporting.js"></script>'.
'<script type="text/javascript" src="https://code.highcharts.com/modules/export-data.js"></script>'.
'<script type="text/javascript" src="https://code.highcharts.com/themes/dark-unica.js"></script>';
case 'select2':
return
'<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script>'.
'<script type="text/javascript" src="'.asset('plugin/select2/fix-autofocus.js').'"></script>';
case 'simplemde':
return
'<script type="text/javascript" src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>';
default:
throw new \Exception('Unknown JS: '.$expression);
}
});
}
}

View File

@ -180,6 +180,7 @@ return [
// App\Providers\BroadcastServiceProvider::class, // App\Providers\BroadcastServiceProvider::class,
App\Providers\EventServiceProvider::class, App\Providers\EventServiceProvider::class,
App\Providers\RouteServiceProvider::class, App\Providers\RouteServiceProvider::class,
App\Providers\CustomBladeServiceProvider::class,
/* /*
* Other Service Providers... * Other Service Providers...

View File

@ -1,6 +1,5 @@
<!-- Bootstrap & Jquery App --> <!-- Bootstrap & Jquery App -->
<script type="text/javascript" src="{{ asset('//cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js') }}" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script>
<script type="text/javascript" src="{{ asset('/bootstra.386/js/bootstrap.bundle.min.js') }}"></script>
@if(file_exists('js/custom-auth.js')) @if(file_exists('js/custom-auth.js'))
<!-- Any Custom JS --> <!-- Any Custom JS -->

View File

@ -56,14 +56,7 @@
</div> </div>
@endsection @endsection
@section('page-scripts') @section('page-css')
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/drilldown.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<script src="https://code.highcharts.com/themes/dark-unica.js"></script>
<style> <style>
.highcharts-data-table table { .highcharts-data-table table {
min-width: 310px; min-width: 310px;
@ -99,6 +92,9 @@
} }
--}} --}}
</style> </style>
@append
@section('page-scripts')
@js('highcharts')
<script> <script>
@if($user->systems->count()) @if($user->systems->count())

View File

@ -109,11 +109,13 @@
</form> </form>
@endsection @endsection
@section('page-css')
@css('simplemde')
@append
@section('page-scripts') @section('page-scripts')
@can('admin',$o) @js('simplemde')
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>
@can('admin',$o)
<script type="text/javascript"> <script type="text/javascript">
var simplemde = new SimpleMDE({ element: $("#homepage")[0] }); var simplemde = new SimpleMDE({ element: $("#homepage")[0] });
</script> </script>

View File

@ -51,13 +51,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -161,13 +161,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -51,14 +51,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/rowgroup/1.1.2/js/dataTables.rowGroup.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -51,14 +51,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/rowgroup/1.1.2/js/dataTables.rowGroup.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -1,6 +1,6 @@
<!-- Bootstrap & Jquery App --> <!-- Bootstrap & Jquery App -->
<script type="text/javascript" src="{{ asset('//cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js') }}" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script>
<script type="text/javascript" src="{{ asset('//cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js') }}" integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"></script> <script type="text/javascript" src="https:///cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js" integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"></script>
<!-- JavaScript Bundle with Popper --> <!-- JavaScript Bundle with Popper -->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>

View File

@ -189,7 +189,6 @@ use App\Models\Setup;
<button type="submit" name="submit" class="btn btn-success float-end">@if ($o->exists)Save @else Add @endif</button> <button type="submit" name="submit" class="btn btn-success float-end">@if ($o->exists)Save @else Add @endif</button>
</div> </div>
@endcan @endcan
</div>
</div> </div>
</form> </form>
</div> </div>
@ -198,11 +197,10 @@ use App\Models\Setup;
@endsection @endsection
@section('page-css') @section('page-css')
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css"> @css('select2')
@append @append
@section('page-scripts') @section('page-scripts')
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script> @js('select2')
<script type="text/javascript" src="{{ asset('/plugin/select2/fix-autofocus.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -63,13 +63,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -112,11 +112,10 @@ Move Address
@endsection @endsection
@section('page-css') @section('page-css')
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css"> @css('select2')
@append @append
@section('page-scripts') @section('page-scripts')
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script> @js('select2')
<script type="text/javascript" src="{{ asset('/plugin/select2/fix-autofocus.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -47,14 +47,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/rowgroup/1.1.2/js/dataTables.rowGroup.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -42,13 +42,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -178,11 +178,10 @@
@endsection @endsection
@section('page-css') @section('page-css')
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css"> @css('select2')
@append @append
@section('page-scripts') @section('page-scripts')
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script> @js('select2')
<script type="text/javascript" src="{{ asset('/plugin/select2/fix-autofocus.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {

View File

@ -51,13 +51,11 @@
</div> </div>
@endsection @endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts') @section('page-scripts')
<link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/dataTables.bootstrap5.min.css" media="screen"> @js('datatables')
<link type="text/css" rel="stylesheet" href="{{ asset('plugin/dataTables/dataTables.bootstrap5.css') }}" media="screen">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="{{ asset('plugin/dataTables/dataTables.conditionalPaging.js') }}"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.25/js/dataTables.bootstrap5.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {