[pmwiki-users] Trying to include this javascript code with custom markup

[Petko Yotov]

On 21/03/2025 14:19, ABClf wrote:
> First, note I have not used <script
> src="$PubDirUrl/chronologie.js"></script>' in my config because it is
> not « translated » later.
> Indeed, using that lien, html source code will say :
> <script src="https://d3js.org/d3.v7.min.js"></script>
> <script src="$PubDirUrl/chronologie.js"></script>

My mistake, you are correct $PubDirUrl is not expanded in Keep().


> Thus, instead, I have used hard coded call in my config :
> <script 
> src="https://www.languefrancaise.net/dev6/pub/chronologie.js"></script>

This should be good, however on your wiki the HTML source still has 
$PubDirUrl - maybe the file was fixed but not yet re-uploaded?

Tried the page Bob/4695.

> Ok, now something more interesting (I guess) :
> using jsfiddle, I get a decent result when copy pasting javascript
> code in the javascript window (https://jsfiddle.net/1j0nv4t6/)
> but it fails when I call the same javascript from <script
> src="$PubDirUrl/chronologie.js"></script>'.
> (https://jsfiddle.net/pnvt7okg/)
> 
> Does this different behaviour make sense ?

The timeline element needs to appear before your chronologie.js.

Petko


> Gilles.
> 
> Le ven. 21 mars 2025 à 13:19, ABClf <languefrancaise at gmail.com> a écrit 
> :
>> 
>> Thank you for your answer Petko.
>> It should work but I still have issues, which I believe are mines.
>> I'm still investigating.
>> Will come back.
>> 
>> I (and mostly AI) have used Chart.js before but, for my needs I prefer
>> how D3 looks like.
>> 
>> 
>> Le ven. 21 mars 2025 à 11:38, Petko Yotov <5ko at 5ko.fr> a écrit :
>> >
>> > Technically you also need to escape $ signs to \$ in the JavaScript code
>> > in a PHP string.
>> >
>> > I would indeed place the JS code in a separate JS file and add a
>> > <script> element instead of inline JS in the HTML page.
>> >
>> > Create a file say pub/chronologie.js
>> >
>> > Place in the file the JS code that is working.
>> >
>> > In PHP, return:
>> >
>> >    Keep('<script src="https://d3js.org/d3.v7.min.js"></script>
>> >          <script src="$PubDirUrl/chronologie.js"></script>');
>> >
>> > Possibly, add (:chronologie:) after (:template last:) in the pagelist
>> > template.
>> >
>> > Le me know if you have questions or need assistance, this
>> > enhancement/augmentation is very appropriate for automation.
>> >
>> > I am using the Chart.js library for charts rather than d3, I plan to
>> > someday release a PmWiki extension for charts.
>> >
>> > Petko
>> >
>> >
>> > On 21/03/2025 10:38, ABClf wrote:
>> > > either to load the javascript from an external javascript file (rather
>> > > than including it in my php file config) ;
>> > > thus my question becomes : how to include an external javascript from
>> > > custom markup rule and, more generally, what is the way to go to get
>> > > the magic begin ?