Tooltip Asset(s)

Permalink
I'm trying to get bootstrap tooltips to work on a single page. I've followed this:
https://documentation.concrete5.org/developers/working-with-blocks/c...
...and everything works swimmingly—but only when logged in as admin.

I conclude that I need to requireAsset something(s). I've tried a variety of the bootstrap offerings listed on
https://documentation.concrete5.org/developers/appendix/asset-list...
but no joy. (My requireAsset code is definitely being executed: I can cause errors by requiring something invalid.)

Am I on the right track? What asset(s) are required? Thanks!

Gondwana
 
jakobfuchs replied on at Permalink Reply
jakobfuchs
Try doing this in the singe page controller's on_start or view method:

$this->requireAsset('javascript', 'bootstrap/*');
$this->requireAsset('css', 'bootstrap/*');


This loads all core bootstrap assets (the same you'll get when you are logged in).

If you don't have a single page controller you can also require it in the page_theme.php on_start method.
MrKDilkington replied on at Permalink Reply
MrKDilkington
Hi Gondwana,

You can request the Bootstrap Tooltip.js asset.
$this->requireAsset('javascript', 'bootstrap/tooltip');

You will need to register the Bootstrap Tooltip CSS as an asset and then require it.

The core Bootstrap CSS can be requested, but it is namespaced to the .ccm-ui class, so it will not be available to your front-end pages.
Gondwana replied on at Permalink Reply
Gondwana
Thank you both. I'll refactor my current mess to have a controller, and try the code therein.
Gondwana replied on at Permalink Reply
Gondwana
Unfortunately, the native bootstrap tooltip code seems quite different to the c5 version (for example, it doesn't seem to have a launch-tooltip class).

It's a shame that the c5 version is wrapped in .ccm-ui, since this precludes its general use. (I was tempted to wrap my page in .ccm-ui despite the likelihood of conflicts when editing.)

Even though I included
$this->requireAsset('javascript', 'bootstrap/*');
$this->requireAsset('css', 'bootstrap/*');

in my controller, no additional statements seemed to be injected into my page. This probably doesn't matter because the .ccm-ui namespacing would have precluded its use anyway.
jakobfuchs replied on at Permalink Reply
jakobfuchs
I generally include the 'standard' version of BS in my themes via the asset system. If you go that route you have to mark the core assets as provided or you'll run into JavaScript conflicts with the editing interface:

public function registerAssets()
    {
        $this->providesAsset('javascript', 'bootstrap/*');
        $this->providesAsset('css', 'bootstrap/*');
        $this->requireAsset('theme/bootstrap');
        $this->requireAsset('javascript', 'jquery');
    }


This can still lead to JavaScript conflicts when you want to create stacks in the dashboard because BS will be loaded twice there.

Maybe it's worth a try just to include the BS CSS (I assume the JavaScript is not namespaced).
Gondwana replied on at Permalink Reply
Gondwana
Thanks Jakob. I've had to abandon this; it's become overwhelmingly complicated and problematic.
Gondwana replied on at Permalink Reply
Gondwana
For the record, I seem to have got this working. The block needs only one additional asset:
$this->requireAsset('javascript','bootstrap/tooltip');

What I was missing was something like this:
<script type="text/javascript">
$(document).ready(function() {
    $(".launch-tooltip").tooltip();
});
</script>

This is necessary because tooltips are not automatically registered.