Discuss creating a new SageTV Web App...

[stuckless]

Currently we have SageTV Web App (work on desktop) and a SageTV Mobile Web App (for phones/tablets) and BMT (works on desktop), they serve 3 different roles with some overlapp (expecially on the SageTV/Mobile apps).

I'd like to start a project that will focus on rewriting all 3 of these into a single web Application that supports desktop and mobile.

I'd like to structure the focus into 4 areas...

1. SageTV configuration (ie, setup folders, tuners, epg, etc... ie, stuff that you normally do via the first time setup in the STV.)
2. PVR Functions (guide, manage recording, favoirties, manual recordings, etc)
3. Media functions (browse media, edit metadata, etc. Auto-detect if phoenix is installed and if so, extend this to support views, fetching metadata/fanart, etc)
4. Media playback.

The focus would likely follow the flow outlined... ie, being able to configure sagetv via the web ui is probably the most logical first step, since if you are setting it up for the first time, you need a way to configure it... (I recently got asked this very question... It's also a logical first step if you don't intend to use SageTV UI but still want to use SageTV to record, etc.

Technology wise... I've been looking at several different things... From Polymer to Bootstrap to MDL and lastly GWT Material Design. As a person that has been using Javascript for almost 20 years... I can say that maintaining a project written in javascript (I have many) is a PITA... Which is why I'm always looking to alternate tools. GWT (java based) combined with MDL seems to be a fairly good technology to create something that can be maintained, refactored, etc. I haven't fully committed to using GWT, but, it's only framework, so far, that I think is mature and offers some ability to be maintained over a long haul.

People can weigh in... My goal would be to start this once the Jetty upgrade is done... so there's time to dig into this, and see who wants to contribute, collect ideas, etc.

[Steve20A]

OK, I'll confess that I've never used any of the apps you are looking to consolidate, so I'm not that familiar with those functions. Can you give me a sentence or two on what the final product would do?

I am interpreting this as meaning:

For function 1 (configuration), you would use a laptop/desktop/mobile on the LAN to manage a headless server? Is this generally what you are talking about? Would it be confined to the LAN or could it operate over a WAN?

For functions 2 and 3 (PVR & Media), you would use a laptop/desktop/mobile to manage Sage recording and media management functions.

For function 4 (playback), you would display Sage recorded output (or music or pictures, I suppose) on a laptop/desktop/mobile, replacing an extender (e.g., HD300).

Am I close?

Would any of this involve installing anything other than a browser on the laptop/desktop/mobile?

Thanks for all your contributions on other projects in Sage and on these forums. I am a beneficiary of your work, and that of many others, and I appreciate all you do.

[stuckless]

Originally Posted by Steve20A

OK, I'll confess that I've never used any of the apps you are looking to consolidate, so I'm not that familiar with those functions. Can you give me a sentence or two on what the final product would do?

I am interpreting this as meaning:

For function 1 (configuration), you would use a laptop/desktop/mobile on the LAN to manage a headless server? Is this generally what you are talking about? Would it be confined to the LAN or could it operate over a WAN?

For functions 2 and 3 (PVR & Media), you would use a laptop/desktop/mobile to manage Sage recording and media management functions.

For function 4 (playback), you would display Sage recorded output (or music or pictures, I suppose) on a laptop/desktop/mobile, replacing an extender (e.g., HD300).

Am I close?

Would any of this involve installing anything other than a browser on the laptop/desktop/mobile?

Thanks for all your contributions on other projects in Sage and on these forums. I am a beneficiary of your work, and that of many others, and I appreciate all you do.

I find it hard to believe that you never use the existing SageTV Web Server... I don't use it a lot, but I use it cleaning up recordings (deleting) and scheduing new one (ie, search guide, add a favorite, etc).

#1 - Is really about configuring a headless server, as you said. The goal here would be if you installed unRAID/Docker version of SageTV and then hit the Web UI, you'd actually be able to further configure the server adding tuners, setting up epg, etc. In terms of accessing remotely that is entirely dependent on how you configure you local LAN and access to the internet (some people allow it... some people don't)

#2 - This is about using the Web UI to browser scheduled content, find content, and manage favorites (really what I use the web server for today, to be honest).

#3 - This is a BMT (Batch Metadata Tools) replacement and incorporate the basic views that the existing web server has today for browsing videos, music, pictures, etc.

#4 - The existing mobile web and sagetv web allow you stream a video to the browser to watch it. I personally don't find it works very well, but, it's there. There is also a feature to use a Web Remote to control a client.

The goal is use nothing more than a web browser for this, and be able to access it over LAN from a Desktop or Mobile. (things that we already do today, but we do it across 3 different web applications).

[Fuzzy]

I, personally, am much happier messing with my TV in front of the TV, so I also rarely use the web interface (actually, never from home). I have occasionally used it from a friends house to set a recording up, but at work if I need to access my server, I use placeshifter, where I get the full sage UI. The only times I use BMT is when there's a problem with fanart/metadata I want to fix. With the android miniclient, I don't really need a browser to stream to my phone either (though I do see a need for improvements to the transcoding). Just don't see a lot of need for most of these features. I'm not saying some don't - but I think the sage UI can already do all of this, so I'd rather see more work to refine that, or bring that to more platforms. I certainly don't see a reason to configure sage through a web browser when it will be used on a tv anyway.

[stuckless]

Originally Posted by Fuzzy

I, personally, am much happier messing with my TV in front of the TV, so I also rarely use the web interface (actually, never from home). I have occasionally used it from a friends house to set a recording up, but at work if I need to access my server, I use placeshifter, where I get the full sage UI. The only times I use BMT is when there's a problem with fanart/metadata I want to fix. With the android miniclient, I don't really need a browser to stream to my phone either (though I do see a need for improvements to the transcoding). Just don't see a lot of need for most of these features. I'm not saying some don't - but I think the sage UI can already do all of this, so I'd rather see more work to refine that, or bring that to more platforms. I certainly don't see a reason to configure sage through a web browser when it will be used on a tv anyway.

I can't argue with most of that... ie, I rarely use BMT (actually can't remember the last time I actually used it, but when I did it was to correct a lookup). That's why 3&4 are really about those things.. ie, lesser used.

Personally, I think that as SageTV moves forward, a "UI" might be used less and less. ie, I can see people installing SageTV to simply manage recordings but use Emby, Plex or other UIs as their principal "TV" devices.

In terms of configuration... I find configuring anything using the remote to be painful, which why I use the Web UI to search airing, manage favorites, delete/clean out recordings, etc. Doing these tasks on the TV is tedious in my mind.

Even the Phoenix APP for Android (which is not supported at the moment) only serves 2 function for me... Show me what recorded recently... and Show me what is going to be recorded... Both of these operations could easily be rolled into the web ui... and even though BMT supports those views... BMT is not a mobile friendly UI.

I don't see this as replacing the STV for people that use the STV to do these configurations... but, I think the functions that core web UI does today, combined with the ability to configure aspects of sagetv is an important long term plan.

[Fuzzy]

Originally Posted by stuckless

I can't argue with most of that... ie, I rarely use BMT (actually can't remember the last time I actually used it, but when I did it was to correct a lookup). That's why 3&4 are really about those things.. ie, lesser used.

Personally, I think that as SageTV moves forward, a "UI" might be used less and less. ie, I can see people installing SageTV to simply manage recordings but use Emby, Plex or other UIs as their principal "TV" devices.

In terms of configuration... I find configuring anything using the remote to be painful, which why I use the Web UI to search airing, manage favorites, delete/clean out recordings, etc. Doing these tasks on the TV is tedious in my mind.

Even the Phoenix APP for Android (which is not supported at the moment) only serves 2 function for me... Show me what recorded recently... and Show me what is going to be recorded... Both of these operations could easily be rolled into the web ui... and even though BMT supports those views... BMT is not a mobile friendly UI.

I don't see this as replacing the STV for people that use the STV to do these configurations... but, I think the functions that core web UI does today, combined with the ability to configure aspects of sagetv is an important long term plan.

If I'm doing any significant configuration, or deleting a bunch of recordings, etc, I don't use a remote either. I use with a wireless keyboard if on the living room client, or SageTVClient or Placeshifter if on a desktop. I just find navigating to clean up recordings more natural if it's the way I normally see those recordings anyway. Configuring sources I can't imagine being any easier in a web ui either, as I often will be previewing channels often during that process.

[KarylFStein]

I generally use the TV to do configurations, but can see it in a web UI for people used to that. I use the web UI a bit even locally for searching/scheduling/favorites.

One thing important to me is being able to have a link direct to a show's "DetailedInfo" or similar screen. I use Premiere Alerts and like to be able to just click on a show name and have it take me to a screen where I can set it as a favorite, etc.

[will]

Originally Posted by stuckless

Technology wise... I've been looking at several different things... From Polymer to Bootstrap to MDL and lastly GWT Material Design. As a person that has been using Javascript for almost 20 years... I can say that maintaining a project written in javascript (I have many) is a PITA... Which is why I'm always looking to alternate tools. GWT (java based) combined with MDL seems to be a fairly good technology to create something that can be maintained, refactored, etc. I haven't fully committed to using GWT, but, it's only framework, so far, that I think is mature and offers some ability to be maintained over a long haul.

I can see something like this becoming large and complex very quickly. I'd recommend using TypeScript with a JS framework like Angular 2 or React.

I recommend TypeScript because it makes JS pretty amazing and maintains legacy compatibility (ECMA 4, 5, and will be an easy upgrade to 6). I would also recommend Angular over React; I feel like Angular can be organized better when you have 200,000 lines of code vs React. As for a CSS framework I like Angular Material but I'm also comfortable with creating my own with pre- and post-processing (Stylus for the pre).

Personally, I feel the most important part isn't the technology but how it is organized for maintainability. This code base could easily be in existence for ten years and will need to be organized for maintainability and new developer on-boarding.

[Telecore]

Originally Posted by stuckless

Currently we have SageTV Web App (work on desktop) and a SageTV Mobile Web App (for phones/tablets) and BMT (works on desktop), they serve 3 different roles with some overlapp (expecially on the SageTV/Mobile apps).

I'd like to start a project that will focus on rewriting all 3 of these into a single web Application that supports desktop and mobile.

I think this is a great idea - I use all 3 of these apps.

[KryptoNyte]

1 thru 3 is absolutely beautiful, love it. 4 would be worth chasing if the media could be watched remotely via web browser, you've probably already been through this challenge to some degree with the Miniclient regarding rendering, not so much on the remote viewing.

I personally find the TV screen to be too limiting in resolution vs. sitting distance to see enough information at one time, so the Web Interface has been a lifesaver, I use it every day. Managing my television from a computer screen is bliss. Some folks won't agree.

[NetworkGuy]

Originally Posted by stuckless

The goal is use nothing more than a web browser for this, and be able to access it over LAN from a Desktop or Mobile.

What about access over a WAN, so there is something to replace PlaceShifter?

[Carlton Bale]

Originally Posted by Telecore

I think this is a great idea - I use all 3 of these apps.

Ditto.

[stuckless]

Originally Posted by will

I can see something like this becoming large and complex very quickly. I'd recommend using TypeScript with a JS framework like Angular 2 or React.

I recommend TypeScript because it makes JS pretty amazing and maintains legacy compatibility (ECMA 4, 5, and will be an easy upgrade to 6). I would also recommend Angular over React; I feel like Angular can be organized better when you have 200,000 lines of code vs React. As for a CSS framework I like Angular Material but I'm also comfortable with creating my own with pre- and post-processing (Stylus for the pre).

Personally, I feel the most important part isn't the technology but how it is organized for maintainability. This code base could easily be in existence for ten years and will need to be organized for maintainability and new developer on-boarding.

Yeah, TS would be my runner up choice, to be honest. I've used it a few times and I think it's best JS alternative out there. The problem that I have with Angular and even Polymer is that these frameworks are complex to configure (running into this at work as well... many people are just overwhelmed by getting something simple to run). Granted, GWT can be a PITA for other reasons... but, getting off the ground quickly, is just 2 lines... mvn clean install followed by mnv gwt:run and your are up and running.

One the bigger problems that I've run into with TS is that you need nodejs installed for it to work (same with polymer), and I run into nodejs dependency hell everytime I try to use it It's gotten to the point that if I see a framework that requires nodejs I know I'm spending a weekend just getting node to run properly before I can even look at the framework

GWT being java does have some advantages (especially for java developer )... build systems, librareis, etc, all work fine... things like unit testing work out of the box. The part I don't like abut GWT is that there is a short compile before each run... but TS would be similar as well (although quicker, I'm sure, and some IDEs will auto-compile as your edit).

But for sure, creating a maintainable project is key, especially if we are combining 3 apps.

[Taddeusz]

I've used straight React for my own personal use and can say that I honestly love working with it. I have not used TS. Wrote mine in ES6/JSX and use Babel to transpile to ES5.

MobX on React is supposed to be really great. I've not personally worked with it yet but sat through a presentation on it. Basically it adds observables to React.

[stuckless]

Originally Posted by Taddeusz

I've used straight React for my own personal use and can say that I honestly love working with it. I have not used TS. Wrote mine in ES6/JSX and use Babel to transpile to ES5.

MobX on React is supposed to be really great. I've not personally worked with it yet but sat through a presentation on it. Basically it adds observables to React.

I've looked a react... and to be honest, I'm a little put off when I see code mixed with the html...

  render: function() {
    var createItem = function(item) {
      return <li key={item.id}>{item.text}</li>;
    };
    return <ul>{this.props.items.map(createItem)}</ul>;
  }

Seems like a step back in terms of building a UI... Reminds me of the php/jsp years of mixing code+html except now we are doing it all on the client...

ES6 and Babel is a good pairing... but again, when I've gone to play with this, I end up in node dependency hell If I had dollar for every time I just wiped node from my system and started over...

[Taddeusz]

Originally Posted by stuckless

I've looked a react... and to be honest, I'm a little put off when I see code mixed with the html...

  render: function() {
    var createItem = function(item) {
      return <li key={item.id}>{item.text}</li>;
    };
    return <ul>{this.props.items.map(createItem)}</ul>;
  }

Seems like a step back in terms of building a UI... Reminds me of the php/jsp years of mixing code+html except now we are doing it all on the client...

ES6 and Babel is a good pairing... but again, when I've gone to play with this, I end up in node dependency hell If I had dollar for every time I just wiped node from my system and started over...

It does look weird but it beats typing it all out by hand. Babel takes care of transpiling it to the actual React statements.

I don't have my current home project on Github. It's a very simple page But I have each of the React components broken out to their own files and import and use them as needed.

I haven't tried Angular and I've read a lot of stuff against it. Especially for smaller projects. From what I've read Angular is more for "internet scale" applications (e.g. Facebook, Twitter, etc.). I guess the same could be argued for React but in my experience it's not as heavy as Angular. And Angular is not a virtual DOM like React.

I'll try and get my current project up on my Github so you can take a look at it.

[stuckless]

Originally Posted by Taddeusz

I'll try and get my current project up on my Github so you can take a look at it.

That would be good... It would be nice to get a "real" sense of what a real project might look like. I'm not convinced that react is the way to go... especially given that as popular as JS is today... there are no decent tools that actually allow you to easily and safely refactor code, etc (I use WebStorm for work and it's probably the best of JS IDEs that I've used, and I've used them all include MS ones... -- That's that TypeScript, to me, holds promise since being a typesafe super script it allows the IDE to safely do code refactoring -- Likely why Angular 2 moves to TS as well)

[Taddeusz]

Ok, here's the starting point for the client side of my app. main.js is the entry point for the client JS. components/app.js the root component. Please feel free to give any criticism on my coding. It won't hurt my feelings. I'm relatively new to JS programming.

https://github.com/jason-bean/home_t...src/client/app

[panteragstk]

My use for the webUI would be for managing favorites, resolve conflicts, searching for things to record, and channel manager.

Being able to set up the server start to finish from the webUI would be nice, but the PVR management is my main use.

I don't ever watch TV from the webUI so that really isn't on my radar.

Setting up metadata from the webUI would be great, but it's just as easy from the couch IMHO.

[Bagal]

I agree with most of the comments here, that combining the 3 existing web apps into one responsive web app makes sense to me and combining the functionality into the 4 suggested areas also makes sense as those areas can be worked on separately and I can see people adding features as and when they need them.

As for tech stack and I should say this is a personal opinion rather than "I think your wrong/right" etc, I can understand the reasons for going with something like GWT or TypeScript, however I'm a firm believer that if you're writing for the web, you should use the web stack of HTML/CSS/JS and not some form of intermediary, to me it's just an extra layer of complexity.

With that said, I do think you're overlooking a reason to stick with pure JS, you've already said that something like GWT is great for Java developers, over the years I've seen plenty of comments on these forums where people say hey, I'd like to help out, I've done some web work but never done any Java etc. so going with a pure JS solution would at least broaden the potential developer base.

Any of the large JS frameworks have pros and cons (I've worked with Angular v1 a lot and generally it's great), I think you just need to pick one and go with it, or throw up a poll and see what the community decides.

Bootstrap is probably the de-facto CSS framework these days, I've worked with Bootstrap quite a bit and for any kind of admin website I can't think of any reason why you wouldn't use it, it's got pretty much everything you need, great community support and you can get a site up and running really quickly.

Ultimately all devs have got their own opinions of the right way to do things but realistically I don't think it matters what you choose, so long as it's well known and can therefore be picked up easily by anyone that wants to contribute.