Poster player architecture

[iokaravas]

I'm still going through the code and I have a few ideas/suggestions about it.

I think the front end should be separated from the backend.
We can poll for changes to the backend using XHR requests and update accordingly.

You're already creating endpoints using express so it doesn't change a lot. We simply don't use the global template variables but do a call using XHR to express in JS/Jquery, returning an object with the slide data and handle everything client side.

What do you think? I think this way it's much easier to work on, too.

[petersem]

Sounds like a good idea, and certainly cleaner than my current setup. I only learned how to use EJS a few weeks back and I'm really not happy with how I'm passing data to the client now. Coming from a .net environment, everything was REST. I'm happy if you want to look at this.

In a much earlier incarnation of this, I was using web sockets to pass data through. the upside of that changes were real-time. Mind you, that incarnation was only for now showing and used plex webhooks to trigger updates. Another big problem I had with this was the webhook data that plex sends is quite limited, so I was supplementing it from TMDB and TVDB. So not optimal. :(

This version relies on periodic browser refreshes to refresh the updated global object and spit out the cards on the client. I must admit that I really hate this, as a browser refresh is a jarring thing in a UI.

This rewrite (from the version I had a week or so ago), uses classes. I only just learned how to do these in the last few weeks and think that it makes it all a bit cleaner. That said, there's no substitute for a strongly-typed language. :)

My focus for the next few changes will be moving all the config data into a file and having a setup page. Im also going to finish the Radarr coming soon integration.

And.. thank you for your sage advice and assistance. :)

[iokaravas]

Awesome! I completely understand!
I could try and start this during this weekend. Do a simple re-write to the viewer at the front end and add a simple endpoint in express. I'll let you know so you can look it over?

[petersem]

sure thing, sounds awesome. i've added comments to all the code, so hopefully this will make it easier to understand

[iokaravas]

Unfortunately I didn't have a lot of time to spend on this, it seems there aren't so many slideshow/carousel viewers out there that support live update or even loading of slides/cards without messing with the DOM. I'm still looking for a proper way of doing this :) I'm spoiled by ReactJS I think :)

[petersem]

Yeah, I struggled to find many to fit the bill too, so just went with bootstrap to keep it simple. Everything I used needed a refresh when adding or updating cards.

Maybe shelve this for the time being. I really want to focus on a 1.0 release if possible. That said, the refresh angle irks me.

[iokaravas]

I completely understand. As a new business week is on right on the corner, we can leave it as it is and hopefully I'll find a replacement. Worse case scenario will check what bootstrap does and how we can safely remove and/or inject new dom elements for it without refreshing :D

[petersem]

I'm working on the GUI for settings and learning as I go. What's the best way to retain entered form data after submission, when there are validation errors? Surely I don't have to load all the values manually?

[iokaravas]

You could use localstorage for that, but if it's a form browsers usually keep submitted data. Best way could also be submitting using XHR in Javascript so no re-load happens so you don't have to keep anything anywhere ;)

[iokaravas]

Good news! I found a way to do this! With working on small changes now I have a better view of how your setup works.
Next update I'll remove the static part of the slideshow ;)

[petersem]

How?

[petersem]

I figured it out and implemented xhr. Also using it for health checks