Feature #3096

Upgrade WebUI framework (ExtJS 6 ?, Angular ?)

Added by Jaroslav Kysela almost 3 years ago. Updated 5 months ago.

Status:AcceptedStart date:2016-03-26
Priority:NormalDue date:
Assignee:Jaroslav Kysela% Done:

100%

Category:User Interface
Target version:4.4

Subtasks

Feature #3660: WebUI layout for mobile and small monitorsRejected

Bug #4878: What version of extjs are you using? Rejected

History

#1 Updated by Mark Clarkstone almost 3 years ago

There is no option to quote or add a comment to this feature request so I had to edit it instead.

The below list are some of the ideas & improvements to the webui I could think of. Some of them may seem pointless or damn right odd :).

Note to perexg: Feel free to comment, link to issues/features (or even split them into separate issues) for the suggestions as you please.

  • Improve saving & loading of configuration, the TV adapters tab for example doesn't correctly refresh the tuner config if you make changes then select another tree item & go back.
  • Consolidate some tabs. The status tab for example could be made into one sortable list (Multiple sort grid?).
  • Improve the Live TV player. Add an option to select player back-end (using either html video tags or a browser plug-in).
  • Implement a quick start guide something along the lines of a pop-up wizard that guides the user through a simple configuration.
  • Make all the tabs sortable and hide-able however this may cause issues when people forget they've hidden an item (reset tabs button?).
  • Improve the EPG guide. Replace with a timeline version (or maybe keep both & let the user decide) also make it configurable (display channel logos, programme genre colourisation, etc).
  • Rename Tv Adapters tab. Mainly because SAT>IP tuners aren't what I would call adapters but are network tuners, rename it to Devices or Tuners?
  • Display all users (even anonymous ones) regardless of where they came from (HTTP, HTSP, API, etc).
  • User selectable themes.
  • Channel logo importer. Add a user interface that searches something like http://www.lyngsat-logo.com/ for logos? Might be useful to contact lynsat to see if they offer some sort of API.

#2 Updated by Prof Yaffle almost 3 years ago

Random additions...

  • Search thetvdb (c/f the current imdb search) for upcoming broadcasts' details
  • Search thetvdb/imdb for completed recordings' details/programme information
  • Touch-compatible interface (one of the main drivers for extjs 5+ IMO)
  • More information about the backend system - CPU load, I/O load, disc space by filesystem (or as part of recording path setup?)
  • Searching of recordings (e.g. free-text search of description and title)?

#3 Updated by Prof Yaffle almost 3 years ago

  • Right-click context menu actions for rename/delete/edit/filter/etc.

#4 Updated by Mathias Neuhaus almost 3 years ago

  • save column layout of tables

#5 Updated by C vH almost 3 years ago

  • bulk select (all/none/invert) through maybe right click
  • select from / to (shift + click)
  • optimize size of icons and "things" for at least HD
  • channel sort window (a special view that only shows channel names in a compact view and let them sort per drag and drop) + search with auto complete, if you search for RTL you got instantly ~20 channels you can select and drag to position (should be a huge easing for this task)

#6 Updated by Christian Glombek over 2 years ago

Hello, I'd like to propose the following:

  • Split Out the Live TV UI (with EPG) to a second (public) WebUI.
If done right, this gives us these opportunities:
  • use the WebUI as reference implementation of HTSP
  • easily port the WebUI App to native platforms. (For that matter I'd like to propose using the React.js Framework)
  • no more need for app on the client (viewer) for simply watching TV and setting the Recorder - in a browser simply go to the WebUI's IP. Functionality could be disabled or restricted through auth

#7 Updated by saen acro 11 months ago

Is this switch to ExtJS 6 will be available sometime, new owner of project make it paid
https://www.sencha.com/pricing/

#8 Updated by Jaroslav Kysela 11 months ago

https://www.sencha.com/legal/gpl/

But we can probably look also for fully open-source javascript frameworks. Although ExtJS has many tools build-in, the licencing is a bit problem.

#9 Updated by Jaroslav Kysela 11 months ago

  • Subject changed from WebUI to ExtJS 6 switch to Upgrade WebUI framework (ExtJS 6 ?, Angular ?)

#10 Updated by Mark Clarkstone 11 months ago

Jaroslav Kysela wrote:

https://www.sencha.com/legal/gpl/

But we can probably look also for fully open-source javascript frameworks. Although ExtJS has many tools build-in, the licencing is a bit problem.

3.4 of ExtJS is under the same license, no? Could you explain the problem? :)

OpenUI5 Looks very nice :).

#11 Updated by Jaroslav Kysela 11 months ago

Another choice: https://getuikit.com/ (thanks Mark)

#12 Updated by C vH 9 months ago

Just to add Webix -> https://webix.com/demos

Webix - an advanced, easy to learn, mobile-friendly, responsive and rich free&open source JavaScript UI components library. Webix spun off from DHTMLX Touch (a project with 8 years of development behind it) and went on to become a standalone UI components framework.

#13 Updated by Mark Clarkstone 9 months ago

C vH wrote:

Just to add Webix -> https://webix.com/demos

Webix - an advanced, easy to learn, mobile-friendly, responsive and rich free&open source JavaScript UI components library. Webix spun off from DHTMLX Touch (a project with 8 years of development behind it) and went on to become a standalone UI components framework.

I looked at webix and thought it was promising but then decided against it due to some widgets - that might be needed - being commercial only.

#14 Updated by Poul Kalff 6 months ago

What is the progress on this? I would like to help out, if possible, but I have very limited experience with javascript. I have a lot of programming experience, though, mostly Python and PHP. I'd love learn some javascript.....

#15 Updated by Mark Clarkstone 6 months ago

Poul Kalff wrote:

What is the progress on this? I would like to help out, if possible, but I have very limited experience with javascript. I have a lot of programming experience, though, mostly Python and PHP. I'd love learn some javascript.....

I don't think there has been any progress - not that I've noticed. Jaroslav has been busy improving the main code for 4.4.

I'm not a fan of Javascript & avoid it where possible. I wouldn't mind seeing the webui using minimal javascript for the frontend & something like micropython for the backend. I'm not sure how good that idea is as python can be rather slow in certain situations.

#16 Updated by Poul Kalff 6 months ago

Python is not good for frontends.. not at all! Other than that, I have no oppinion on the matter, I'm just offering to help, if I can. But, obviously, someone has to decide on where to begin... I don't even know how the UI maps to the rest of the program....

#17 Updated by Mark Clarkstone 6 months ago

Poul Kalff wrote:

Python is not good for frontends.. not at all!

I specifically mentioned the backend of the webui, not the frontend, but yes it's not great for frontends.

Other than that, I have no oppinion on the matter, I'm just offering to help, if I can. But, obviously, someone has to decide on where to begin... I don't even know how the UI maps to the rest of the program....

The webui is just served by tvh, it uses a json api. Take a look at the dev tools in your browser with the ui open :).

If you want a starting point, look at the simple.html / tv.html pages. You can work on another gui without affecting the current one.

#18 Updated by Poul Kalff 5 months ago

Alright, thanks, mark, I'll have a look and follow the forums, see if any plans are made for the webui

#19 Updated by Jaroslav Kysela 5 months ago

As the main tvh developer, I would be really grateful to have another leader for the webui development. But it would be really difficult to migrate all things implemented to the new framework.

#20 Updated by saen acro 5 months ago

@Poul Kalff
Write some to demonstrate programming potential and skills ;)
https://tvheadend.org/issues/3992

#21 Updated by Poul Kalff 5 months ago

saen acro wrote:

@Poul Kalff
Write some to demonstrate programming potential and skills ;)
https://tvheadend.org/issues/3992

I agree that there should be a separate leader for the UI, but it can't be me. As I've stated above, I know very little about JS, only thing I can offer this project is a willingness to help and to learn. Besides, I've just had my third child born, and I'm starting a new job this month (as a developer).... thus, I have no skill and no time, so hardly the ideal leader..... what about some of the people who have have suggested different technologies in this thread? Mark...?

#22 Updated by Mark Clarkstone 5 months ago

Poul Kalff wrote:

saen acro wrote:

@Poul Kalff
Write some to demonstrate programming potential and skills ;)
https://tvheadend.org/issues/3992

I agree that there should be a separate leader for the UI, but it can't be me. As I've stated above, I know very little about JS, only thing I can offer this project is a willingness to help and to learn. Besides, I've just had my third child born, and I'm starting a new job this month (as a developer).... thus, I have no skill and no time, so hardly the ideal leader..... what about some of the people who have have suggested different technologies in this thread? Mark...?

Bad idea! I'm no UI developer nor am I a fan of Javascript (I'm on the side of despising it). However, I'm not against helping out.

Here's a few reasons why I'd be a bad fit:-

  • It would be worse than what we have now, and I mean worse. think the current simple.html :p
  • It would take me years to even write half the code as I only type one handed (due to a physical/mental disability). read: I'm slow (in more ways than one :p).

Also available in: Atom PDF