XF 2.0 Including external library (js and css)

[CMTV]

It should be in the root of your addon (where addon.json located).

 

[ShikiSuen]

You can't serve public files from anywhere inside the src directory unfortunately.

You would need to add these files to something like: js/questionthreads/vendor/fonticonpicker/jquery.fonticonpicker.min.js.

You would then use the XF JS loader rather than your current approach. If the file is in the above location it would be as follows:

<xf:js src="questionthreads/vendor/fonticonpicker/jquery.fonticonpicker.min.js" />

For the CSS, forget about calling them as files. Copy and paste them into new templates and call as follows:

<xf:css src="questionthreads_fonticonpicker.css" />
<xf:css src="questionthreads_fonticonpicker_grey.css" />

Is it possible to create a JS template and call the template in <xf:js src=?

 

[TickTackk]

Nope. You can make use of

<xf:js>
    $(function()
    {
        console.info('pikaboo');
    });
</xf:js>

 

[021]

Nope. You can make use of

.nothing prevents you from doing so :

<xf:js>
    <xf:include template="my_js_template" />
</xf:js>

 

[robdog]

.nothing prevents you from doing so :

<xf:js>
    <xf:include template="my_js_template" />
</xf:js>

Not sure why I haven't thought about doing this, lol.

 

[RenegadeMonster]

I'm trying to Add ThreeJS and some custom JavaScript to style the header of my forum for Christmas.

I'm running into all kinds of problems.

First is I can't get the ThreeJS library to load.

I have tried each of the following approaches in the forum_view template with ThreeJS placed in the js folder and from the public cdn with no luck.

<xf:js src="https://cdnjs.cloudflare.com/ajax/libs/three.js/88/three.min.js" />
<xf:js src="vendor/three.js/three.min.js" />

I do not see that ThreeJS is ever being loaded in the source, and console logs that "THREE" is not defined.

I also haven't figured out how to not use the script tag yet.

// The script tags requires these properties
<script id="fragmentShader" type="x-shader/x-fragment">
// And
<script id="vertexShader" type="x-shader/x-vertex">
//When I use <xf:js like:
<xf:js id="vertexShader" type="x-shader/x-vertex">
// I get the following Error when attempting to save the changes to the template.
Line 70: At least one attribute of 'src', 'dev' or 'prod' must be provided. - Template name: public:PAGE_CONTAINER

Any got any advice to troubleshoot this?