Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

Réduire
Ce sujet est fermé.
X
X
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • [RÉGLÉ] Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

    Bonjour!

    Je rencontre un souci avec Jquery concernant Joomla3 sous template Gantry.avec Highcharts/Highstocks et SlideshowCK

    Le slideshowCK est sur la page principale et les graphs dans l'onglet "Pourquoi contrôler".

    J'ai exposé mon souci sur le forum Highcharts et sur Joomlack mais ils se renvoient la balle, peut être avec raison.

    Je dois faire une erreur car en toute logique, le Jquery est deja chargé par Joomla par /media/jui/js/jquery.min.js sous version jQuery v1.10.2 et SlideshowCK se prend normalement dessus.
    A contrario, Highcharts ne se prend pas dessus et n'affiche pas les graphs. Je dois donc ajouter ce fichier en script jQuery v1.8.2 pour que cela fonctionne mais dans ce cas, SlideshowCK ne fonctionne plus!

    Pourriez vous jeter un œil sur mon site et me dire si vous détectez des soucis Jquery et sinon comment faire pour faire fonctionner Highcharts et SlideshowCK sur la même page, et donc certainement de modifier ce fichier jQuery v1.8.2 et/ou de dire à Highcharts de se prendre sur le Jquery de Joomla.

    Merci d'avance, bonne journée et bonne année!
    Bye

  • #2
    Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

    C'est quoi l'adresse URL de votre site?


    Envoyé de mon iPad à l'aide de Forum Joomla.fr

    Commentaire


    • #3
      Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

      Envoyé par sbahjaoui Voir le message
      C'est quoi l'adresse URL de votre site?r
      C'est dans un lien de mon premier post, mais c'est https://www.astracontrol.com
      Merci!

      Commentaire


      • #4
        Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

        Il faut charger en premier la bibliothèque mootools et après biblio jquery.
        Sur votre site il y a des conflits même tu as charger jquery.noconflict car modal.js manipulé par mootools et non pas jquery il doit charger en haut avec tous les js de mootools puis tous les js de jquery


        Envoyé de mon iPad à l'aide de Forum Joomla.fr

        Commentaire


        • #5
          Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

          Bonsoir et merci.
          J'ai Joomla3, il indiquent que dans cette version Mootools est dépréciée, j'ai tout de même installé le plugin System - Mootools Enabler/Disabler. Par ailleurs, je ne décide pas quoi charger ni dans quel ordre sous Joomla.
          J'ai donc activé mootools et mootools-more, j'obtiens désormais :
          <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/mootools-core.js" type="text/javascript"></script>
          <script src="/media/system/js/core.js" type="text/javascript"></script>
          <script src="/media/system/js/tabs-state.js" type="text/javascript"></script>
          <script src="/media/system/js/caption.js" type="text/javascript"></script>
          <script src="/media/jui/js/bootstrap.min.js" type="text/javascript"></script>
          <script src="/media/tabs/js/script.min.js" type="text/javascript"></script>
          <script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
          <script src="/libraries/gantry/js/browser-engines.js" type="text/javascript"></script>
          <script src="/templates/gantry/js/rokmediaqueries.js" type="text/javascript"></script>
          <script src="/modules/mod_roknavmenu/themes/default/js/rokmediaqueries.js" type="text/javascript"></script>
          <script src="/modules/mod_roknavmenu/themes/default/js/responsive.js" type="text/javascript"></script>
          <script src="/media/system/js/modal.js" type="text/javascript"></script>
          <script src="/modules/mod_slideshowck/assets/jquery.easing.1.3.js" type="text/javascript"></script>
          <script src="/modules/mod_slideshowck/assets/jquery.mobile.customized.min.js" type="text/javascript"></script>
          <script src="/modules/mod_slideshowck/assets/camera.min.js" type="text/javascript"></script>

          et bien plus loin juste avant mes graphiques, j'ai mis à jour mes fichiers selon http://code.highcharts.com/ et réduit au minimum :
          <script src="CHARTS/js/jquery.min.js"></script>
          <script src="CHARTS/js/highcharts.js"></script>

          Et bien rien ne change, si je laisse <script src="CHARTS/js/jquery.min.js"></script>, les graphiques apparaissent mais pas SlideshowCK, si je supprime <script src="CHARTS/js/jquery.min.js"></script>, les graphiques disparaissent et SlideshowCK revient.

          C'est quand même dingue, le script jquery pour Highcharts https://www.astracontrol.com/CHARTS/js/highcharts.js est la copie conforme du jquery de Joomla https://www.astracontrol.com/media/jui/js/jquery.min.js .
          Comment obliger ce foutu Highchart à utiliser le Jquery de Joomla?!
          Dernière édition par josse34 à 22/01/2014, 16h59

          Commentaire


          • #6
            Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

            Si les deux js sont conforme supprime le highchart et laisse joomla. Ensuite dans le code source l'extension appel highcharts.js modifie le pars celui de joomla.

            Désolé sur phone impossible à voir les codes sources.


            Sent from my iPhone using Forum Joomla.fr mobile app

            Commentaire


            • #7
              Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

              Envoyé par klin34970 Voir le message
              Si les deux js sont conforme supprime le highchart et laisse joomla. Ensuite dans le code source l'extension appel highcharts.js modifie le pars celui de joomla.

              Désolé sur phone impossible à voir les codes sources.


              Sent from my iPhone using Forum Joomla.fr mobile app
              Bonjour et merci.
              C'est très intéressant mais je ne sais absolument pas comment faire pour appeler highcharts dans le jquery de Joomla!
              Merci
              Dernière édition par josse34 à 23/01/2014, 15h00

              Commentaire


              • #8
                Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

                Salut,
                à moins que j'ai mal lu, tu n'expliques pas comment tu as installé highcharts ?
                En dur dans le template ?
                Version Highcharts-3.0.9 ?

                Ce que je vois sur Firebug, c'est une erreur au niveau du script jquery.easing.js

                Essaie d'encapsuler le code de ce script dans :
                $(document).ready(function() {
                /le code jquery.easing
                });
                Voire même :
                (function($){
                $(document).ready(function() {
                // code ici


                });
                })(jQuery);
                “Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter le nouveau service (en Beta) de la base de connaissance https://kb.joomla.fr

                Commentaire


                • #9
                  Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

                  Bonjour.
                  Vraiment navré mais quelque chose m'échappe, je ne gère absolument pas (et je ne sais pas le faire si cela peut effectivement se faire) le code source, c'est joomla qui s'occupe de tout.

                  SlideshowCK est bien un plugin Joomla, normalement tout fonctionne bien avec lui, mais pour Highcharts, c'est une autre histoire, ce n'est pas un plugin, module ou composant, c'est simplement une librairie JS, donc pour générer un graphique, il suffit d'appeler quelques script comme highcharts.js + son propre script, l'installation est décrite ici : http://www.highcharts.com/docs/getti...d/installation (seules l'option 1 fonctionne mais en générant cette erreur) avec les fichiers suivants : http://code.highcharts.com/

                  Quant à jquery.easing.js, je ne sais pas d'ou il sort et comment l'encapsuler, j'ai essayé de faire cela sur mon script Highcharts mais rien ne change.

                  A NOTER que le forum Highcharts m'indique que ma liste d'appel des scripts doit être de la sorte :
                  Code HTML:
                  <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/mootools-core.js" type="text/javascript"></script>
                  <script src="/media/system/js/core.js" type="text/javascript"></script>
                  <script src="/media/system/js/tabs-state.js" type="text/javascript"></script>
                  <script src="/media/system/js/caption.js" type="text/javascript"></script>
                  <script src="/media/jui/js/bootstrap.min.js" type="text/javascript"></script>
                  <script src="/media/tabs/js/script.min.js" type="text/javascript"></script>
                  <script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
                  <script src="/libraries/gantry/js/browser-engines.js" type="text/javascript"></script>
                  <script src="/templates/gantry/js/rokmediaqueries.js" type="text/javascript"></script>
                  <script src="/modules/mod_roknavmenu/themes/default/js/rokmediaqueries.js" type="text/javascript"></script>
                  <script src="/modules/mod_roknavmenu/themes/default/js/responsive.js" type="text/javascript"></script>
                  <script src="/media/system/js/modal.js" type="text/javascript"></script>
                  <script src="/modules/mod_slideshowck/assets/jquery.easing.1.3.js" type="text/javascript"></script>
                  <script src="/modules/mod_slideshowck/assets/jquery.mobile.customized.min.js" type="text/javascript"></script>
                  <script src="/modules/mod_slideshowck/assets/camera.min.js" type="text/javascript"></script>
                  <!-- add as last lib highhcarts -->
                  <script src="CHARTS/js/highcharts.js"></script>
                  Ensuite à savoir que ma page d'acceuil est un module dans lequel j'appelle des articles avec adjonction de code via Sourcerer. Si je désactive l'option "plugin de contenu" de ce module, SlideshowCK fonctionne et mon script devient en texte clair.

                  Désolé si je suis un peu dur de la feuille mais je ne pige pas tout sur ces modifs!

                  Merci
                  Bye
                  Dernière édition par josse34 à 23/01/2014, 16h09

                  Commentaire


                  • #10
                    Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

                    Bon ca deviens trop difficile et confus, j'ai donc crées plusieurs exemples dédiées :

                    https://www.astracontrol.com/TEST1 = ONLY SLIDESHOWCK = CK WORKING

                    https://www.astracontrol.com/TEST2 = ONLY HIGHCHARTS With in HEAD CHARTS/js/jquery.min.js and CHARTS/js/highcharts.js = HC WORKING

                    https://www.astracontrol.com/TEST3 = ONLY HIGHCHARTS With in HEAD CHARTS/js/highcharts.js = NOT WORKING

                    https://www.astracontrol.com/TEST4 = ONLY HIGHCHARTS With in HEAD CHARTS/js/adapters/standalone-framework.js = NOT WORKING

                    https://www.astracontrol.com/TEST5 = ONLY HIGHCHARTS With in HEAD CHARTS/js/adapters/mootools-yui-compressed.js and CHARTS/js/adapters/mootools-adapter.js and CHARTS/js/highcharts.js = NOT WORKING

                    https://www.astracontrol.com/TEST6 = ONLY HIGHCHARTS With in HEAD CHARTS/js/adapters/prototype.js and CHARTS/js/adapters/prototype-adapter.js and CHARTS/js/highcharts.js = NOT WORKING

                    https://www.astracontrol.com/TEST7 = HIGHCHARTS + SLIDESHOWCK With in HEAD CHARTS/js/jquery.min.js and CHARTS/js/highcharts.js = BOTH NOT WORKING

                    https://www.astracontrol.com/TEST8 = HIGHCHARTS + SLIDESHOWCK With in HEAD CHARTS/js/highcharts.js = ONLY CK WORKING

                    A savoir que les liens externes vers des scripts ne fonctionnent pas, d'ou mes copies sur mon serveur. Si jamais ces scripts appellent à leur tour des applets, cela ne peux apparemment pas fonctionner.

                    Avec tout cela, on devrait avoir de quoi tester et résoudre mon souci!!!

                    Grand merci!

                    Bye

                    Commentaire


                    • #11
                      Re : Jquery Joomla 3 avec Highcharts/Highstocks et SlideshowCK

                      Bonsoir.
                      Bon souci résolu, il faut simplement remplacer les '$' du script Highcharts en 'jQuery' parce que
                      The main problem is you're using both jQuery and MooTools, since you run jQuery.noConflict you can no longer use '$' to target jQuery. So something like $('#CAUSES') doesn't work. Replace all the '$' with 'jQuery' so you get jQuery('#CAUSES').highcharts({});
                      J'espere que ca servira à d'autres car même la team Highcharts était à la masse!

                      Merci pour votre participation et bonne conitnuation.

                      Bye

                      Commentaire

                      Annonce

                      Réduire
                      1 sur 2 < >

                      C'est [Réglé] et on n'en parle plus ?

                      A quoi ça sert ?
                      La mention [Réglé] permet aux visiteurs d'identifier rapidement les messages qui ont trouvé une solution.

                      Merci donc d'utiliser cette fonctionnalité afin de faciliter la navigation et la recherche d'informations de tous sur le forum.

                      Si vous deviez oublier de porter cette mention, nous nous permettrons de le faire à votre place... mais seulement une fois
                      Comment ajouter la mention [Réglé] à votre discussion ?
                      1 - Aller sur votre discussion et éditer votre premier message :


                      2 - Cliquer sur la liste déroulante Préfixe.

                      3 - Choisir le préfixe [Réglé].


                      4 - Et voilà… votre discussion est désormais identifiée comme réglée.

                      2 sur 2 < >

                      Assistance au forum - Outil de publication d'infos de votre site

                      Compatibilité: PHP 4.1,PHP4, 5, 6DEV MySQL 3.2 - 5.5 MySQLi from 4.1 ( @ >=PHP 4.4.9)

                      Support Version de Joomla! : | J!3.0 | J!2.5.xx | J!1.7.xx | J!1.6.xx | J1.5.xx | J!1.0.xx |

                      Version française (FR) D'autres versions sont disponibles depuis la version originale de FPA

                      UTILISER À VOS PROPRES RISQUES :
                      L'exactitude et l'exhaustivité de ce script ainsi que la documentation ne sont pas garanties et aucune responsabilité ne sera acceptée pour tout dommage, questions ou confusion provoquée par l'utilisation de ce script.

                      Problèmes connus :
                      FPA n'est actuellement pas compatible avec des sites Joomla qui ont eu leur fichier configuration.php déplacé en dehors du répertoire public_html.

                      Installation :

                      1. Téléchargez l'archive souhaitée : http://afuj.github.io/FPA/

                      Archive zip : https://github.com/AFUJ/FPA/zipball/master

                      2. Décompressez le fichier de package téléchargé sur votre propre ordinateur (à l'aide de WinZip ou d'un outil de décompression natif).

                      3. Lisez le fichier LISEZMOI inclus pour toutes les notes de versions spécifiques.

                      4. LIRE le fichier de documentation inclus pour obtenir des instructions d'utilisation détaillées.

                      5. Téléchargez le script fpa-fr.php à la racine de votre site Joomla!. C'est l'endroit que vous avez installé Joomla et ce n'est pas la racine principale de votre serveur. Voir les exemples ci-dessous.

                      6. Exécutez le script via votre navigateur en tapant: http:// www. votresite .com/ fpa-fr.php
                      et remplacer www. votresite .com par votre nom de domaine


                      Exemples:
                      Joomla! est installé dans votre répertoire web et vous avez installé la version française du fichier FPA:
                      Télécharger le script fpa-fr.php dans: /public_html/
                      Pour executer le script: http://www..com/fpa-fr.php

                      Joomla! est installé dans un sous-répertoire nommé "cms" et vous avez installé la version française du fichier FPA:
                      Télécharger le script fpa-fr.php dans: /public_html/cms/
                      Pour executer le script: http://www..com/cms/fpa-fr.php

                      En raison de la nature très sensible de l'information affichée par le script FPA, il doit être retiré immédiatement du serveur après son utilisation.

                      Pour supprimer le script de votre site, utilisez le lien de script de suppression fourni en haut de la page du script. Si le lien de suppression échoue pour supprimer le script, utilisez votre programme FTP pour le supprimer manuellement ou changer le nom une fois que le script a généré les données du site et le message publié sur le forum. Si le script est toujours présent sur le site, il peut être utilisé pour recueillir suffisamment d'informations pour pirater votre site. Le retrait du script empêche des étrangers de l'utiliser pour jeter un oeil à la façon dont votre site est structuré et de détecter les défauts qui peuvent être utilisé à vos dépends.
                      Voir plus
                      Voir moins
                      Travaille ...
                      X