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\EventServiceProvider::class,
App\Providers\RouteServiceProvider::class,
App\Providers\CustomBladeServiceProvider::class,
/*
* Other Service Providers...

View File

@ -1,6 +1,5 @@
<!-- 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="{{ asset('/bootstra.386/js/bootstrap.bundle.min.js') }}"></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>
@if(file_exists('js/custom-auth.js'))
<!-- Any Custom JS -->

View File

@ -56,14 +56,7 @@
</div>
@endsection
@section('page-scripts')
<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>
@section('page-css')
<style>
.highcharts-data-table table {
min-width: 310px;
@ -99,6 +92,9 @@
}
--}}
</style>
@append
@section('page-scripts')
@js('highcharts')
<script>
@if($user->systems->count())

View File

@ -109,11 +109,13 @@
</form>
@endsection
@section('page-css')
@css('simplemde')
@append
@section('page-scripts')
@can('admin',$o)
<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>
@js('simplemde')
@can('admin',$o)
<script type="text/javascript">
var simplemde = new SimpleMDE({ element: $("#homepage")[0] });
</script>

View File

@ -51,13 +51,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -161,13 +161,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -51,14 +51,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -51,14 +51,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -1,6 +1,6 @@
<!-- 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="{{ 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/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/lodash.js/4.17.21/lodash.min.js" integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"></script>
<!-- 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>

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>
</div>
@endcan
</div>
</div>
</form>
</div>
@ -198,11 +197,10 @@ use App\Models\Setup;
@endsection
@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
@section('page-scripts')
<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>
@js('select2')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -63,13 +63,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -112,11 +112,10 @@ Move Address
@endsection
@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
@section('page-scripts')
<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>
@js('select2')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -47,14 +47,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -42,13 +42,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -178,11 +178,10 @@
@endsection
@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
@section('page-scripts')
<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>
@js('select2')
<script type="text/javascript">
$(document).ready(function() {

View File

@ -51,13 +51,11 @@
</div>
@endsection
@section('page-css')
@css('datatables')
@append
@section('page-scripts')
<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">
<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>
@js('datatables')
<script type="text/javascript">
$(document).ready(function() {