JS nur auf der entsprechenden Seite einbinden oder im Modul verbauen?

  • Hallo zusammen, ich habe wieder mal eine Frage an euch und zwar geht es diesmal um eigene Javascripte. Auf meiner Seite habe ich einige Grafiken, die ich mit canvasjs realisiere. Meine Frage an euch ist nun ob es Sinn macht diese Skripte nur auf den entsprechenden Artikel-Seiten einzubinden oder spricht nichts dagegen diese Javascripts immer zu laden (quasi im <head> Bereich?).


    Ich realisiere die Datenaufbereitung gerade mit eigenen Modulen; sprich der PHP Code der mir die x- und y-Arrays erstellt und mit der Datenbank kommuniziert, ist in einem Modul. Hier wäre es doch dann sogar sinnvoll, dass Javascript mit in das Modul mit rein zu packen oder? Damit würde ich sicher gehen, dass das Javascript nur dann geladen wird, wenn auch das Modul angezeigt wird.

    Wäre das sinnvoll? Falls ja, in welche Datei wäre das Skript den am Besten aufgehoben? Derzeit hat mein Modul die Standard Files:


    Code
    ├── mod_canvasVisitorInteraction
    │   ├── helper.php
    │   ├── index.html
    │   ├── mod_canvasVisitorInteraction.php
    │   ├── mod_canvasVisitorInteraction.xml
    │   └── tmpl
    │   ├── default.php
    │   └── index.html


    Im »default.php« ist folgendes enthalten:



    PHP
    <?php
    defined('_JEXEC') or die;
    echo '<div id="visitorInteractionGraph"></div>';
    ?>


    In diesem <div> Container setzt das Javascript dann seine Infos rein:




    Auf meiner aktuellen Seite ist der PHP Code und der Javascript Code in einer PHP Datei. Da ich das jetzt aber über ein Modul realisieren möchte, weiß ich nicht wo das Javascript hin soll. Wahrscheilnich ist die Einbindung in allen Seiten sinnfrei, weil das Javascript auch $php Variablen benötigt, die ich in meinem eigenen Modul aufbereite. Aus der Luft gegriffen, würde ich fast sagen, dass Javascript müsste in die default.php rein.


    Ich hoffe das meine Erläuterungen einigermaßen verständlich sind.

    Tobi

  • Was mir gerade noch durch den Kopf geht wäre folgendes:



    • Einbindung des Javascripts in <head>
    • Prüfung ob id-Tag exisitert
    • Falls existiert, generiere Grafik und füge diese ein


    Code
    window.onload = function ()
    {
    var idTag = document.getElementById("visitorInteractionGraph");
    if(idTag)
    {
    var chart = new CanvasJS.Chart("") ...
    }
    }
  • Heutzutage empfohlen NICHT mit <script>-Tags einbinden, sondern den gebastelten Code in den HEAD schicken, z.B. mit.

    Factory::getDocument()->addScriptDeclaration(...)


    Das selbe gilt für <style>-Tags

    Factory::getDocument()->addStyleDeclaration(...)


    Bei Joomla 4 kann man auch an's Ende vom BODY schicken. Siehe Beispiel Atum-Backend-Template am Ende der Datei index.php.

  • Danke Dir, das kann ich gleich verbauen.


    Hier noch eine kurze Frage. Was hat dieses »nonce« mit diesem ewigen Hash zu bedeuten?


    Hier noch eine kurze Frage. Was hat dieses »nonce« mit diesem ewigen Hash zu bedeuten?


    Desweiteren habe ich noch eine Frage. Wenn ich im <HEAD> mein Javascript einbinde, dass aber dann Daten von dem eingebauten Modul benötigt, ist es dann überhaupt möglich das durchzuführen. Bislang war es so, dass ich zuerst den PHP code hatte und in der gleichen Datei dann das Javascript nachgestellt hatte. Somit konnte ich auf die PHP Variablen zugreifen. In etwa so:



    Wie man deutlich erkennt, kann ich hier im Javascript auf die $dataPoints zurückgreifen. Ich habe aber das Gefühl, dass wenn ich das Javascript im <HEAD> einfüge, dass ich keine Möglichkeit habe auf das Array von meinem PHP Code zurückzugreifen. Wäre noch die Option die Du erwähnt hast, mit »am Ende vom <BODY> zu schicken. Allerdings scheint es mir auch so zu sein, dass ich die Implementierung über »<php echo json_encode($dataPoints); ?>« so nicht mehr verwenden kann.



    Tobi


    Gut - monolog - ...


    Mir fehlen wohl einfach ein paar Grundlagen. Das ich php in meinem javascript verwenden konnte lag daran, dass es eine PHP Datei war, in der ich ein Javascript dabei hatte. Somit funktionierte das also. Jetzt ist es nur noch eine reine Javascript Sache und da geht es dann nicht mehr. Entweder ich finde hier noch eine Lösung (irgendein Workaround) oder ich binde das Script einfach in die PHP (tmpl/default.php) vom Modul ein.


    Ich beantworte jetzt meine Frage selber :) Verzeiht mir diesen Monolog hier aber ggf. bringt es ja irgendwann mal jemandem was.

    Ich habe jetzt in meinem Modul noch folgendes angefügt:



    Code
    echo "<script type=\"text/javascript\">\n";
    echo "var dataVisits = " . json_encode($dataVisits) . ";\n";
    echo "var dataInteractions = " . json_encode($dataInteractions) . ";\n";
    echo "</script>\n";


    Damit habe ich die zwei Javascript Variablen, die ich dann in meinem Javascript einbinde. Das Javascript habe ich am <BODY> Ende eingebaut.