search

artkonekt / appshell

AppShell is an Laravel Application boilerplate with UI, ACL, Users & Customers
https://konekt.dev/appshell
MIT License
79 stars 10 forks source link

Adding a jquery to <head> #9

Closed j-dohnalek closed 5 years ago

j-dohnalek commented 5 years ago

How can I add jquery into the html header please?

I only see the option to add CSS into the head tag no JS 

<!-- Styles -->
@foreach($appshell->assets->stylesheets() as $stylesheet)
   {!! $stylesheet->renderHtml() !!}
@endforeach

I understand it is recommended to have all JS on the bottom https://stackoverflow.com/questions/2105327 but in my case I need to add it into the head to show a datepicker https://gijgo.com/datepicker/example/bootstrap-4.

Please advice?

j-dohnalek commented 5 years ago

I have forked your repository and I am proposing the following change.

The Laravel app/concord.php can be as follows

'assets' => [
    'js' => DefaultAppShellAssets::JS,
    'head_js' => ["https://code.jquery.com/jquery-3.3.1.min.js"],
]

Modify the following files

https://github.com/learn2develop/appshell/blob/00d83366211c6758afe71bb24bef96e9e10cdae7/src/Assets/AssetCollection.php

https://github.com/learn2develop/appshell/blob/00d83366211c6758afe71bb24bef96e9e10cdae7/src/resources/views/layouts/default.blade.php adding 

@foreach($appshell->assets->headScripts() as $script)
        {!! $script->renderHtml() !!}
@endforeach
fulopattila122 commented 5 years ago

I was offline for a few days, but I'll give a proper response later today and/or implement your proposal

j-dohnalek commented 5 years ago

Any updates please?

fulopattila122 commented 5 years ago

AppShell v1.3.0 has just been released, containing the requested feature.

The functionality is described here: https://artkonekt.github.io/appshell/#/customize-admin-ui?id=determine-asset-location-header-or-footer

So in your case the config should be something like this:

'assets' => [
    'js' => [
        'https://code.jquery.com/jquery-3.3.1.min.js' => ['_location' => 'header'],
        'js/appshell.js'
    ]
    //...
]