@sharonyue no, on iOS you just do this:

1. Visit the forum page
2. Tap "Share" button
3. Choose "Add to Home Screen"
4. Give it a name (optionally) and tap "Add".
5. The forum touch-icon will appear on the home screen
6. Tap it to open the PWA website as a native app (without browser window).

In Android it supposed to be even simpler. As far as I know, this doesn't depend on a browser that much.

Hi!
Is there any way to get the uploaded files meta data and show it in the topic?
Ideally, I would like to create a sidebar which will show all the uploaded files from the current topic. And in this list I want to have:

• file name
• download link
• file size
• upload date

Is it possible to make purely as a front-end function which will get this information from the NodeBB API?

@sharonyue that's the question to the developers. Because whether the app will be opened with a browser interface or without it should be described in web manifest linked to the website.

@baris, great, thank you.

Hello,
I have a funny problem on my forum: I'm using the "Slate" style on the Persona theme and my answer suggestions list's background matches the font styling:

Here is what I'm talking about:

And the funny thing is that when I'm trying to inspect the element on the page to check the class names the list disappears.
Tell me please, how can I check the DOM structure of this list?

Thanks in advance!

@sharonyue no, on iOS you just do this:

1. Visit the forum page
2. Tap "Share" button
3. Choose "Add to Home Screen"
4. Give it a name (optionally) and tap "Add".
5. The forum touch-icon will appear on the home screen
6. Tap it to open the PWA website as a native app (without browser window).

In Android it supposed to be even simpler. As far as I know, this doesn't depend on a browser that much.

I've got the point. Thanks for all the help.

NodeBB uses jQuery exclusively to emit these events

Now this explains everything.

so you'll have to interface with jQuery

I was just wondering whether it is possible to develop any (related to the front-end) plugins with just vanilla JS? Because I never used jQuery and not familiar with its syntax.

Got it. And is there a way to develop, for example, a custom plugin of that kind without using jQuery library?

Thanks for the information guys! This worked! And this was my first step into the NodeBB hooks.

But now I have another question: why jQuery version of the event listener works, but Vanilla JS doesn't?
I tried this, but the pretifyFileLinks function doesn't trigger:

window.addEventListener('action:posts.loaded', pretifyFileLinks);
window.addEventListener('action:ajaxify.end', pretifyFileLinks);
window.addEventListener('action:composer.preview', pretifyFileLinks);

Hi,
I've made some custom styling to the file links shared in posts. Instead of looking like simple links, with a help of JS code, I've made them to look like this:

In my case, the custom JS function looks through all the file links on the page and applies custom CSS to all found <a> tags.

But there are a few problems with this approach

When you enter a topic somewhere below (at a post in the bottom of the topic) and then scroll up, the JS function doesn't work, because it was called only once on page load. I assume this happens because of the dynamic posts load.
Is there a way to trigger JS function on page scroll or on the dynamic load events?

Test page: https://forum.c4d.space/topic/74/морф/18?_=1609934812169

Here is the JS function itself:

new PretifyFileLinks();

function PretifyFileLinks() {

    const extensionPattern = /\.[0-9a-z]+$/i;
    const extensions = ['.c4d', '.zip', '.7z'];
    const allLinks = document.querySelectorAll('[component="post"] a');

    allLinks.forEach(link => {
        const ext = link.href.match(extensionPattern);
        if (ext === null) return;

        extensions.forEach(extension => {
            if (extension === ext[0]) beautifyLink(link);
        });

    });

    function beautifyLink(obj) {

        const css = `Some custom CSS.`;
        obj.style.cssText = css;

    }

}