Topic: How to add javascript on a page?

Hello,
I would like to add javascript on a page.

Actually I have tried this on viewtopic:
$forum_loader->add_js('https://code.jquery.com/jquery-1.11.3.js');
to add jquery but nothing has been added to source code.

Re: How to add javascript on a page?

Is the $forum_loader object available in the place where you added the code?
Check for pasted code only on topics pages (at the end of the page code).

Parserus, UserAgentAnalyzer.
I speak only Russian  :P

3 (edited by h4ever 2020-03-06 08:29)

Re: How to add javascript on a page?

Now I checked it and the loader object contains:

Loader Object
(
    [libs:Loader:private] => Array
        (
            [js] => Array
                (
                    [https://code.jquery.com/jquery-1.11.3.js] => Array
                        (
                            [type] => url
                            [async] => 
                            [weight] => 100
                            [group] => 0
                            [every_page] => 
                            [defer] => 
                            [preprocess] => 1
                            [data] => https://code.jquery.com/jquery-1.11.3.js
                        )

                )

            [css] => Array
                (
                    [http://localhost/punbb/extensions/pun_tags/style/Oxygen/style.css] => Array
                        (
                            [type] => url
                            [weight] => 100
                            [group] => 0
                            [media] => screen
                            [every_page] => 
                            [preprocess] => 1
                            [browsers] => Array
                                (
                                )

                            [noscript] => 
                            [data] => http://localhost/punbb/extensions/pun_tags/style/Oxygen/style.css
                        )

                )

        )

)

I am running it on localhost and I cannot find the string like "jquery-1.11.3.js" in the html source code generated by browser.

if ($forum_config['o_quickpost'] == '1' &&
    !$forum_user['is_guest'] &&
    ($cur_topic['post_replies'] == '1' || ($cur_topic['post_replies'] == '' && $forum_user['g_post_replies'] == '1')) &&
    ($cur_topic['closed'] == '0' || $forum_page['is_admmod']))
{

$forum_loader->add_js('https://code.jquery.com/jquery-1.11.3.js');

// print_r($forum_loader);
// die;

ob_start();

Re: How to add javascript on a page?

I have also tried to create this extension but still I don't see the link in the source html code when I install it.

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE extension SYSTEM "ext-1.0.dtd">

<extension engine="1.0">
    <id>jquery</id>
    <title>jquery</title>
    <version>1.0</version>
    <description>adds jquery</description>
    <author>jquery</author>
    <minversion>1.0</minversion>
    <maxtestedon>1.4</maxtestedon>
    <install></install>
    <uninstall></uninstall>
    <hooks>
        <!-- OPTIONS Block -->
        <hook id="vt_start"><![CDATA[
?>  <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<?php
        ]]></hook>
    </hooks>
</extension>

Also I have notice I don't see any cache file like cache/cache_jquery.php

and in the file cache_hooks.php
I did not found the string vt_start.

Maybe I have missed something how to use the hooks.

Re: How to add javascript on a page?

I used your code

if ($forum_config['o_quickpost'] == '1' &&
    !$forum_user['is_guest'] &&
    ($cur_topic['post_replies'] == '1' || ($cur_topic['post_replies'] == '' && $forum_user['g_post_replies'] == '1')) &&
    ($cur_topic['closed'] == '0' || $forum_page['is_admmod']))
{

$forum_loader->add_js('https://code.jquery.com/jquery-1.11.3.js');

// print_r($forum_loader);
// die;

ob_start();

result

...
<script>
    $LAB.setOptions({AlwaysPreserveOrder:false})
    .wait(function () { PUNBB.pun_bbcode=(function(){return{init:function(){return true;},insert_text:function(d,h){var g,f,e=(document.all)?document.all.req_message:((document.getElementById("afocus")!==null)?(document.getElementById("afocus").req_message):(document.getElementsByName("req_message")[0]));if(!e){return false;}if(document.selection&&document.selection.createRange){e.focus();g=document.selection.createRange();g.text=d+g.text+h;e.focus();}else{if(e.selectionStart||e.selectionStart===0){var c=e.selectionStart,b=e.selectionEnd,a=e.scrollTop;e.value=e.value.substring(0,c)+d+e.value.substring(c,b)+h+e.value.substring(b,e.value.length);if(d.charAt(d.length-2)==="="){e.selectionStart=(c+d.length-1);}else{if(c===b){e.selectionStart=b+d.length;}else{e.selectionStart=b+d.length+h.length;}}e.selectionEnd=e.selectionStart;e.scrollTop=a;e.focus();}else{e.value+=d+h;e.focus();}}}};}());PUNBB.common.addDOMReadyEvent(PUNBB.pun_bbcode.init); })
    .script("https://code.jquery.com/jquery-1.11.3.js").wait();
</script>
...

Script loading present.
Scripts are loaded through the library, not directly.

Parserus, UserAgentAnalyzer.
I speak only Russian  :P

6 (edited by h4ever 2020-03-06 10:45)

Re: How to add javascript on a page?

Thank you for the test.

I have different output.

I have checked line 120 in footer.php

$tpl_main = str_replace('<!-- forum_javascript -->', $forum_loader->render_js(), $tpl_main);

and there is no such string '<!-- forum_javascript -->' in $tpl_main.

Ok. I have found the problem. We are using different templates. The template which I use misses this section in the main.tpl file in style folder. So I have added it here and it works now.

And I'm using this command:

$forum_loader->add_js('https://code.jquery.com/jquery-1.11.3.js',array('group' => FORUM_JS_GROUP_SYSTEM));

Re: How to add javascript on a page?

Finally I have found how to add the links with extension:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE extension SYSTEM "ext-1.0.dtd">

<extension engine="1.0">
    <id>jquery</id>
    <title>jquery</title>
    <version>1.0</version>
    <description>adds jquery</description>
    <author>jquery</author>
    <minversion>1.0</minversion>
    <maxtestedon>1.4</maxtestedon>
    <install></install>
    <uninstall></uninstall>
    <hooks>
        <!-- OPTIONS Block -->
        <hook id="vt_start,arp_start,ed_start"><![CDATA[
$forum_loader->add_js('https://code.jquery.com/jquery-1.11.3.js',array('group' => FORUM_JS_GROUP_SYSTEM));
]]></hook>
    </hooks>
</extension>