Plugin javascript function returning "view"

[chef 3745]

I am not familiar with the new javascript plugin architecture.

 

Could somebody recommend some articles to read so I understand what we are doing the we use 'define([]), function'.

 

I see that the 'view' event for the page load returns the page data.

 

Thanks

 

Ben

Edited May 30, 2019 by chef

[chef 3745]

I think I'm asking the wrong question.

 

When I add this to my plugin.cs I expect to see my JS file loaded into the server. This is not happening.

This is my GetPages Function.cs

        public IEnumerable<PluginPageInfo> GetPages()
        {
            return new[]
            {
                new PluginPageInfo()
                {
                    Name = "MainPluginConfigurationPage",
                    EmbeddedResourcePath = GetType().Namespace + ".Configuration.MainPluginConfigurationPage.html",
                    EnableInMainMenu = true,
                    DisplayName = "Home Automation"
                },
                 new PluginPageInfo()
                {
                    Name = "MainPluginConfigurationPageJS",
                    EmbeddedResourcePath = GetType().Namespace + ".Configuration.mainPluginConfigurationPage.js"
                }
            };
        }

Both Files are in the proper namespace, and are set to Embedded Resource

 

 

 

And yet hen the Server Load, it doesn't load the JS file?

 

I would expect to see the configuration load here:

 

 

Like the rest of the plugins do here:

 

 

Currently the only reason my plugin loads in because there is Jquery in a script tag, which I would like to move away from, and make sure its set up properly like all the other plugins.

[chef 3745]

 

You need to add your JS as a data-controller in your page, also you dont need to supply the full HTML just the DIV contents.

 

See an example here:

 

https://github.com/faush01/playback_reporting/blob/develop/playback_reporting/Pages/custom_query.html

data-controller="__plugin/custom_query.js"

this is the name of the page you set up in you GetPages()

 

new PluginPageInfo
{
    Name = "custom_query.js",
    EmbeddedResourcePath = GetType().Namespace + ".Pages.custom_query.js"
},

 

 

Thank you, that has been driving me NUTZZZZ! 

[chef 3745]

@@TeamB YES! Thank you very very much! 

 

 

Edited May 30, 2019 by chef

[chef 3745]

Is it bad form to still use JQuery in emby plugins?

 

Some Github repos are still legacy. 

[Luke 37016]

You can still use it, but we are trying to gradually eliminate it from core pages.

[chef 3745]

You can still use it, but we are trying to gradually eliminate it from core pages.

 

 

@@Luke All I can say after the last 48 hours, and calling into work sick.. because code... is Javascript  can be really hard.  

 

I see why people say Jquery makes you soft... better get a good understanding of what JQuery is doing 'under the hood'   because it's all sudo. 

[Luke 37016]

What it originally set out to do to normalize browser differences is no longer needed these days.

[chef 3745]

@@Luke ...and 56 hours later I have finally become intermediate!

 

hardest thing to do is targeting child and parent nodes in the DOM when making element on the fly.

 

for some reason using querySelectorAll is finicky on dynamically created elements.

 

I had all my data attributes in parent nodes that were hard to reach when made on the fly.

 

I had  to add event listeners on the containers and use  'closest('div > .className')' which contained data attributes, and catch them on the bubble up.

 

Yeah I used the phrase "bubble up".

 

and also know when to stop Propagation of events too...

 

See intermediate!

Edited June 1, 2019 by chef