User tests: Successful: Unsuccessful:
This PR introduces bootstrap-tooltip-extended.js to add 4 positions and RTL support for BS tooltips.
It follows discussion about tooltip placement issue when inside modals: #10100 (comment)
JHtml::_('bootstrap.tooltipExtended');
method to load bootstrap-tooltip-extended.js to get 4 extra positions : top-left
, top-right
, bottom-left
and bottom-right
(https://github.com/cyrilreze/bootstrap-tooltip-extended)bootstrap-extended.less
data-placement="auto-dir top-left"
(if data-placement is undefined) for class .modalTooltip
(handler class for BS tooltip when inside a modal-body).(eg. batch modules)
Status | New | ⇒ | Pending |
Labels |
Added:
?
|
Category | ⇒ | External Library Feature Request JavaScript Templates (admin) Templates (site) |
bootstrap-extended IIRC is a Joomla thing, not native Bootstrap.
And the bootstrap.js is already core hacked to bits to deal with event names, MooTools incompatibilities, and "auto-hover" on the dropdown menus (compare joomla.org and api.joomla.org mega menus and how you have to click to move between them; the former is using Joomla Bootstrap and the later the native Bootstrap). So, we're already long past pure vendor files (at least here).
ok, didn't know the history.
I tought any vendor code should not be "hacked".
The keyword there is "should"
It really should be "must", but considering Joomla has a history of hacking third party code, good luck changing that.
When bs abandoned v2 and we were stuck with it we had no option
i see, vendor code MUST not ever be changed ... for 4.0 then
Most of those hacks came when we first implemented Bootstrap 2.1 because they weren't going to make changes to deal with the MooTools conflicts and someone decided they wanted fluid dropdowns on the top nav bar in Isis (which I agree is a nice little UX thing but it came at the expense of hacking Bootstrap).
ok, so, for what is to this PR, this change in vendor lib is ok, because the vendor lib is already changed.
fine, to me.
Note: i can add this as a separated plugin too. ;-)
The first reason is to have a better placement of the tooltip when inside a modal. BS 3 has an auto placement based on an additional viewport option (which solves such issue, but we are in BS2).
This extension plugin here works both on version 2 and 3 of Bootstrap.
We can too implement tooltip from BS3 (backward compatible) to replace BS 2 tooltip plugin, and then just set the viewport when tooltip inside a modal, to the modal ID ;-)
Did you change bootstrap js and bootstrap extended css?
Are they not vendor libraries that should not be changed?
@andrepereiradasilva note about bootstrap, i don't have hacked nor changed nothing in Bootstrap, just added a plugin in bootstrap.js, which extends tooltip plugin.
bootstrap.js is a one readable compiled file of all bootstrap plugins as you can customize it yourself on getbootstrap: http://getbootstrap.com/customize/#plugins
bootstrap-tooltip-extended.js is just one plugin, and nothing change in library bootstrap-tooltip.js
So here, no hacking of bootstrap, only extending. ;-)
I think you should had as new files.
Maybe an idea...!
As this way, we can call it only when needed, and could be used by site template using bootstrap 3.
With something like :
JHtml::_('bootstrap.tooltipExtended', $selector, $params = array());
OR to extend tooltip class like this :
JHtml::_('bootstrap.tooltip', $selector, $params = array(), $extended = false);
and then loading separated js and css files for tooltip extended when needed ?
@andrepereiradasilva, @mbabker, @brianteeman ...
What's your opinion about this other possibility ?
@andrepereiradasilva note about bootstrap, i don't have hacked nor changed nothing in Bootstrap, just added a plugin in bootstrap.js, which extends tooltip plugin.
bootstrap.js is a one readable compiled file of all bootstrap plugins as you can customize it yourself on getbootstrap: http://getbootstrap.com/customize/#plugins
bootstrap-tooltip-extended.js is just one plugin, and nothing change in library bootstrap-tooltip.js
So here, no hacking of bootstrap, only extending. ;-)
I know. I mean changing the bootstrap(.min).js file.
What's your opinion about this other possibility ?
IMHO it would be better.
So, what about this in bootstrap class :
public static function tooltipExtended($extended = true)
{
if ($extended)
{
JHtml::_('script', 'jui/bootstrap-tooltip-extended.min.js', false, true);
JHtml::_('stylesheet', 'jui/bootstrap-tooltip-extended.css', false, true);
}
}
We call files with JHtml::_('bootstrap.tooltipExtended');
(this will be useful in modals)
This way, no change in bootstrap.js, and no change in core less/css files. ;-)
Note: in the demo page i've created for this plugin, the bootstrap-tooltip-extended.js is loaded separately after native bootstrap, http://www.webic.fr/bootstrap-tooltip-extended/demo-bootstrap-2.html
Should i go this way ?
i agree
@andrepereiradasilva Done! ;-)
Testing Instructions not changed: in all modals (Batch, copy Template...)
Note: no change for all tooltips where position is already set (by script, or data-placement)
I have tested this item successfully on c76be51
Nice work!
will test tomorrow.
I have tested this item successfully on c76be51
It works here. Thanks. Lets give @infograf768 a chance to test too.
Status | Pending | ⇒ | Ready to Commit |
Labels |
Added:
?
|
Milestone |
Added: |
Status | Ready to Commit | ⇒ | Fixed in Code Base |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2016-05-08 13:50:15 |
Closed_By | ⇒ | Kubik-Rubik |
Labels |
Removed:
?
|
Labels |
Added:
?
|
Did you change bootstrap js and bootstrap extended css?
Are they not vendor libraries that should not be changed?
I think you should had as new files.