Javascript inclusion issues

-- HikaShop version -- : Business 2.3.1
-- Joomla version -- : 3.3.1
-- PHP version -- : 5.3.x

Hello guys,
just updated hikashop from 2.2.3 to 2.3.1 and Joomla from 3.2.x to 3.3.1

But I started getting JS errors, especially in the Product Pages.
The main error was a conflict with the bootstrap.js:
TypeError: 'undefined' is not a function (evaluating 'e(document).on("click.alert.data-api",t,n.prototype.close)')

Checked the head of the document, and found that scripts are loaded in this order:
<script src="/media/com_hikashop/js/hikashop.js?v=231" type="text/javascript"></script>
<script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
<script src="/media/jui/js/jquery.min.js" type="text/javascript"></script>
<script src="/media/jui/js/jquery-noconflict.js" type="text/javascript"></script>
<script src="/media/jui/js/jquery-migrate.min.js" type="text/javascript"></script>
<script src="/media/system/js/core.js" type="text/javascript"></script>
<script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
<script src="/media/system/js/modal.js" type="text/javascript"></script>
<script src="/modules/mod_artzoomin/js/zoom_vm.js" type="text/javascript"></script>
<script src="/media/jui/js/bootstrap.min.js" type="text/javascript"></script>
<script src="/templates/template/js/gk.scripts.js" type="text/javascript"></script>
<script src="/templates/template/js/gk.menu.js" type="text/javascript"></script>
<script src="/media/sourcecoast/js/jq-bootstrap-1.8.3.js" type="text/javascript"></script>

which is creating the conflicts. The Products Page is messing up with the inclusion order of the scripts and this is caused by the way they are included in the view.html file.

Probably not all Joomla 3.x websites/templates will use the Bootstrap or jQuery frameworks, but I guess it will be the majority of them, but ensuring that Bootstrap or jQuery is included first and in no conflict mode, before your scripts, it would lead to less issues and save you time supporting users.
To do so, you can check if the Bootstrap or jQuery libraries are included and use the JHTML class at the beginning of your views file, to load those libraries at the top of the scripts, before any other script.
With JHTML you will always be sure that the required library will be loaded only once and before your other scripts.

In my case, I had to use the JHtml::_('bootstrap.framework') in the products view.html.php file.
After that the order of the scripts is okay:
<script src="/media/com_hikashop/js/hikashop.js?v=231" type="text/javascript"></script>
<script src="/media/jui/js/jquery.min.js" type="text/javascript"></script>
<script src="/media/jui/js/jquery-noconflict.js" type="text/javascript"></script>
<script src="/media/jui/js/jquery-migrate.min.js" type="text/javascript"></script>
<script src="/media/jui/js/bootstrap.min.js" type="text/javascript"></script>
<script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
<script src="/media/system/js/core.js" type="text/javascript"></script>
<script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
<script src="/media/system/js/modal.js" type="text/javascript"></script>
<script src="/modules/mod_artzoomin/js/zoom_vm.js" type="text/javascript"></script>
<script src="/templates/template/js/gk.scripts.js" type="text/javascript"></script>
<script src="/templates/template/js/gk.menu.js" type="text/javascript"></script>
<script src="/media/sourcecoast/js/jq-bootstrap-1.8.3.js" type="text/javascript"></script>

Hello Nicolas,

I know Hika doesn't need bootstrap. However jQuery/Bootstrap will probably exist in a Joomla 3 website, either by the template or another extension. So it is important to be able to keep the right order of the scripts in the head of the document.

But currently hikashop injects mootools in the head and disturbs the scripts order. You can see what is the final order of the scripts in the product page in my first post.
And It is not only if the template will load the other libraries, and I am not asking from hikashop to load jQuery instead of my template that makes use of it. I am just asking for hikashop to try to respect that I already use jQuery/Bootstrap.
The extensions should do their best to ensure that there will be no conflicts with the javascript and obey in the hierarchy those scripts have to be loaded.

That's why I said that it will be good to check if a website already uses bootstrap/jquery, so you can use the JHTML class to include those libraries first in your views, before injecting other JS.

Maybe it won't be that easy, or it won't give accurate results to check this from within your extension's code, but it can be just as simple as a backend "Javascript Setting" - "Does your website uses already?", with options like:

1. jQuery
2. Bootstrap
3. Both libraries
4. None

And then depending on the choice, the associated code will make sure that the right libraries will be loaded in the right order in your views.

JHTML will not load twice any library, but it will make sure that this library will be loaded before any other libraries.
This is a minimum addition (just a few lines of code, and you only have about 10-11 views in total), but will give maximum result in terms of compatibility in a complex environment with many extensions, especially since Bootstrap/jQuery will be there in the majority of the websites.
Think about it...

* Okay, we can use 3rd party plugins to set the order of the scripts in the head, but why to use plugins when something can be improved and work without such issues?