Javascript in pages

[PH5HP]

Hi,

I wonder if it is possible to use javascript in pages? I tried but no luck yet.

Kind regards,
Henk - ph5hp.nl

[Jimmi08]

Not with tinymce. you need to use textarea field (or at least it was possible this way before, but maybe some filters was added)

You can always write your own shortcode and use it in page content. It should work.

Or you can use custom field for the page as a textarea and display it in the template with the parameter raw.

But my opinion is that if you need javascript in pages, you are doing something wrong. it should be part of the template or plugin... Without example hard to say.

[tgtje]

in addition to @Jimmi08 yes, but there's a but..
first you need to have the correct credentials to add script. (prefs/content filters).

when using the basic create page and (described by Jimmi) not when wysiwig is running you could add some directly.
Is wysiwig your setting then use the code button ' < source code > ' to paste.

test copied from w3. just paste it as test in both manners.
be aware that old style writing >> text../.java... will be blocked for security

damn.... will execute when posting > so a link (use parts between body)

a button should appear below, and when clicked the text in page (sentence) is changed

[PH5HP]

Hi,

TNX for trying to help me.

I am a HamRadio Operator and I found a page which uses javascript to create a morse code generator. I know I can create this in a separate index.html and after embed it with the page-wrap plugin, but I want to use the javascript inside a page, because maybe there are more situations when I want to use javascript inside a page of E107.

Here is the url with the morse code generator: https://noorncho.github.io/morse-code-translator/

They use one html page with 2 javascript files. I want to recreate it and combine it in 1 javascript. If I remember correctly I was able to use javascript in V1 and the versions below of E107.

Kind regards,
Henk - ph5hp.nl

[rica-carv]

I agree with @Jimmi08 , but another solution is what about use AJAX?

I'm not a great fan of Javascript, mainly because it can be tempered by the end user, so it's basically unsafe. With AJAX, all teh code is on the server side, so it's no risk associated. I know, you might add more stress to the server, but these days servers can handle hevy duty, so for me, it would be the place to go....

Just my 5 cents....

[PH5HP]

Hi,

The problem is that I do not yet understand how AJAX works.

Kind regards,
Henk - ph5hp.nl

[rica-carv]

@PH5HP Probably you can understand how it works here

[PH5HP]

Hi,

Still not sure how to use normal javascript in pages, but I found a work around.

I am using the wrapper plugin to load the html page which is using the javascript. This works well, but I would rather have the option to use javascript in a page.

Example of using javascript and call the html page (which uses javascript) with the wrapper plugin:
https://ph5hp.nl/wrapper/3/morsecode-translator

Kind regards,
Henk - https://ph5hp.nl

[Jimmi08]

Nice, I would use textarea field not tinymce for javascript. Adding custom field and inserting it in page content. It should work.

[PH5HP]

Hi, Jimmi08,

I tried this yesterday and indeed it still works. Switching between textarea and tinymce is not a real problem. Maybe in the future someone creates a plugin or E107 will make things easier to work with javascript. I hope so ...

On https://ph5hp.nl the clock is javascript in a menu. I pasted in in textarea (tinymce disabled for a moment).

Kind regards,
Henk - ph5hp.nl

[Moc]

The answer is to create a minimal plugin for your javascript application, and use the e_header (or e_footer) addon to include the javascript files.

You can also use the e_shortcode addon so you make it a shortcode that is available on all pages to use.

An example of a minimal plugin with javascript is what @tgtje has done: https://github.com/tgtje/xmaslights/tree/main/xmaslights.