How to properly initialize custom javascript for ui elements

[GeorgeZard]

Hello and a delayed Happy New Year!
I have finished writing my own HTML template to add as separate code blocks for simple ui stuff like hero pages and etc. etc.

And i have hit a certain curious block.

Technical Question

I'm seeking guidance on how to properly initialize custom javascript code that i have created for simple ui interaction like loadingbars and some canvas elements.

The main problem i am hit with is that currently i load my scripts inside the layout pages (MainLayout and EditLayouts) in order to get them somehow working but only for a moment. The code block ui works properly for a while then after a micro refresh the scripts are completely dead.

Showcase of Problem

You can see the javascript working as intended and then with a microrefresh it get's broken.

Can somoene help?
I can gladly provide anything needed to further help with understanding the probelm
I'm still in the learning phase of understanding the system's complete functionality, and I appreciate your patience as I work through this process.

Thank you again for your continued support, and please maintain this excellent level of work!

[TheHadiAhmadi]

Hi @GeorgeZard,

Thanks for trying out FluentCMS.

We have same issue for javascript too. and didn't found a good solution for this problem yet.
As you know we are using Flowbite for components, to initialize it's js codes, we are using afterenhanced and beforeenhanced events of blazor.
app.js#L17
The afterehnanced event runs everytime we navigate to another page. and beforeenhanced event runs before navigating to other page, (we are using these events for loading bar too loadingbar.js)

the fluentcms:afterenhanced & fluentcms:beforeenhanced events are defined at App.razor file

feel free to open discussions and issues when you have questions & suggestions. You can join our discord if you like (https://discord.gg/WyqYuC6YbY)

[GeorgeZard]

Hey thanks for the response again !
So if i understand correct i just need to wrap the initialization of the each javascript file around these events and they should propably load ?
I will join the discord thanks for the invite.

[TheHadiAhmadi]

Yes, We need to initialize javascript codes on both initialization and after-navigation events.