Topic: NEW: Panel -- A Built-in Web App for MC and Engen (Read 204414 times)

JimH · « **on:** July 08, 2016, 06:54:04 pm »

Note: Instructions are at the bottom of this post. You need to have MC 23 installed and running (either MC or Media Server). Media Network must be turned on in MC settings.

JRiver Media Center runs a web server that you can connect to with Panel. You connect to it from a browser on port 52199.

Panel is a very exciting new feature. Synergy is a great word to describe it. The whole is greater than the sum of the parts.

[Edit: This feature has been extended and improved in MC23.]

Here's are some screenshots from October, 2017:

More screenshots

Panel on a phone

It works with a computer, a phone, or a tablet. It uses HTML5 to do some cool stuff.

The web page in the screenshot is generated by MC and it brings together many of the client apps that we've built. It builds on work we've done over the years, and on a lot of recent work by most members of the team. It looks simple, but it isn't.

Panel is a suite of apps in one location, a smart web app that's easy to use. It provides direct access to apps that you may have used or heard about: WebGizmo, WebPlay, WebRemote, Engen, and MC.

It's friendly. Point and click (or touch). Something happens.

The settings icon provides remote access to the JRiver Id settings now and will give you access to some of MC's settings in the future.

The + icon leads to more apps.

Panel will be expanded to include other apps. It will always be the easy to find launch point.

Demonstration
A demonstration of Panel is here:

Id Outside

Instructions
Media Center 23 (or higher) or Media Server must be installed and running. Media Network must be turned on in MC settings.

You can open Panel from a web browser by entering this URL:

http://[IP_Address]:52199 (changing [IP_Address] to your own IP address) Example: http://192.168.0.13:52199

localhost:52199 will do the same thing when the browser is running on the same machine as MC.

Alternatively

You can access Panel with the Access Key from your server by browsing to this URL:

https://jriver.com/panel.html

Enter your access key, select your playback location, and click connect.

Hilton · « **Reply #1 on:** July 10, 2016, 09:19:53 am »

nice one!

astromo · « **Reply #2 on:** July 11, 2016, 09:03:48 am »

Quote from: JimH on July 08, 2016, 06:54:04 pm

It uses HTML5 to do some cool stuff.

Gotta love cool stuff.

JimH · « **Reply #3 on:** July 11, 2016, 11:05:29 am »

This project has its roots in the Pretty Face discussion from last year.

Castius · « **Reply #4 on:** July 11, 2016, 01:42:32 pm »

I like the star background it makes em feel the sky's the limit.

You mentioned "It's friendly. Point and click (or touch)"
I'm curious how remote control friendly fits into that.
Are there any thoughts about how those two world collide?

Thanks

JimH · « **Reply #5 on:** July 11, 2016, 01:59:57 pm »

What do you mean by "remote control friendly"?

jgreen · « **Reply #6 on:** July 11, 2016, 03:37:50 pm »

Congrats, JimH! Sky's the limit!!

jachin99 · « **Reply #7 on:** July 11, 2016, 03:42:16 pm »

Quote from: JimH on July 11, 2016, 01:59:57 pm

What do you mean by "remote control friendly"?

Can you assign a button on a point and click remote to perform the same actions that would take place when pressing any given icon on a touchscreen

Hendrik · « **Reply #8 on:** July 11, 2016, 03:53:36 pm »

Quote from: jachin99 on July 11, 2016, 03:42:16 pm

Can you assign a button on a point and click remote to perform the same actions that would take place when pressing any given icon on a touchscreen

Its a web interface, so its not inherently designed for remotes. You could probably get something setup using various custom remote control mapping tools.

mattkhan · « **Reply #9 on:** July 11, 2016, 04:31:37 pm »

Quote from: Hendrik on July 11, 2016, 03:53:36 pm

Its a web interface, so its not inherently designed for remotes. You could probably get something setup using various custom remote control mapping tools.

do buttons map 1:1 to REST api calls?

Hendrik · « **Reply #10 on:** July 11, 2016, 04:34:37 pm »

Quote from: mattkhan on July 11, 2016, 04:31:37 pm

do buttons map 1:1 to REST api calls?

Everything is powered by MCWS of course, although there is a bunch of JavaScript magic and whatnot to make everything act nicely.

jachin99 · « **Reply #11 on:** July 11, 2016, 09:45:43 pm »

Im not very good with developer lingo but could you associate mcc commands into the web server and assign button presses to execute said mcc commands. The latter i believe is already possible with event ghost

rpalmer68 · « **Reply #12 on:** July 11, 2016, 10:56:13 pm »

I'd like to see something like this on my tablet so eventually I might be able to replace my remote control with "The Panel"

Press the "Media Centre" button and the TV and Amp turn on, and select the correct inputs and away we go....

If The Panel can send commands to external application like Girder ( I assume via MC running on the same PC) then in theory it should all be possible.

Richard

JimH · « **Reply #13 on:** July 12, 2016, 06:50:10 am »

Quote from: jachin99 on July 11, 2016, 09:45:43 pm

Im not very good with developer lingo but could you associate mcc commands into the web server and assign button presses to execute said mcc commands. The latter i believe is already possible with event ghost

The Panel app isn't customizeable, but you could probably build your own menu. Both MC and Engen have REST interfaces. The MCWS documentation on the DevZone page should get you started with MC. Please start a new topic for help.

JonnyRedHed · « **Reply #14 on:** July 12, 2016, 04:08:48 pm »

Maybe some curves to those square menu boxes. Additionally maybe a little 3d depth. A slightly hyper large soft aliased rounded font. Maybe like the larger soft google font.

AndrewFG · « **Reply #15 on:** July 12, 2016, 04:37:04 pm »

Small bug: The Panel web page displays the title "MC 21" in the browser tab (as opposed to "MC 22")
Bigger bug: The Panel Settings cog wheel displays an empty page (iPad Safari)

JimH · « **Reply #16 on:** July 12, 2016, 05:44:08 pm »

Windows setup isn't hooked up yet. It's only working for the Id. We needed it there because some people want to run it headless when possible.

Maybe next week it will be partially working on the Windows version.

JimH · « **Reply #17 on:** July 12, 2016, 06:28:53 pm »

Quote from: rpalmer68 on July 11, 2016, 10:56:13 pm

I'd like to see something like this on my tablet so eventually I might be able to replace my remote control with "The Panel"

Press the "Media Centre" button and the TV and Amp turn on, and select the correct inputs and away we go....

If The Panel can send commands to external application like Girder ( I assume via MC running on the same PC) then in theory it should all be possible.

The Lighting item on the menu links to Engen, if installed. In Engen, you can turn switches on and off. I have my receiver and TV plugged into a Z-Wave power strip. A single click can turn both on.

What you're thinking about is more or less where we're going.

The discussion we had at work was partly about this scenario:

Man arrives at house. Engen recognizes presence. Opens garage door, unlocks the house, turns on lights if needed, starts a little music.

This obviously requires a lot of logic. We have the ability to flip all the switches now. We just need to add the logic and the user interface.

A.K. · « **Reply #18 on:** July 13, 2016, 07:24:10 am »

Looks very promising

That could be just perfect for novice users, without fear of accidentally messing up settings or filenames.

Castius · « **Reply #19 on:** July 13, 2016, 11:42:43 am »

Hitting launch for lighting panel does not use JRiver configured port. So it doesn't open

marko · « **Reply #20 on:** July 13, 2016, 11:43:55 am »

Quote from: JimH on July 12, 2016, 06:28:53 pm

Man arrives at house. Engen recognizes presence. Opens garage door, unlocks the house, turns on lights if needed, starts a little music.

This obviously requires a lot of logic. We have the ability to flip all the switches now. We just need to add the logic and the user interface.

Don't forget the default, hard coded WAF mode...

Wife/Partner arrives at house. Engen recognizes presence. Unlocks the house, turns on lights in kitchen, if needed, turns on oven.

This obviously requires not a lot of logic. We have the ability to flip all the switches now. We just need to add the logic and don't need the user interface.

JimH · « **Reply #21 on:** July 13, 2016, 12:40:10 pm »

Quote from: Castius on July 13, 2016, 11:42:43 am

Hitting launch for lighting panel does not use JRiver configured port. So it doesn't open

It requires Engen to be running. That's only available on the beta board for Engen. Let me know if you want to help out there. You would need some Z-Wave equipment.

Castius · « **Reply #22 on:** July 13, 2016, 01:21:32 pm »

Ahh i see. I think i will i'l let you know when they get here.

In regards to the remote control support.
Yes i was referring to supporting the basic up down left right ok logic in there UI.

So even if you don't support it directly. At least UI by design can supports the workflow.
I can try to find a way to use a plugin to control a web site.

hoyt · « **Reply #23 on:** July 13, 2016, 02:23:30 pm »

Quote from: JimH on July 11, 2016, 11:05:29 am

This project has its roots in the Pretty Face discussion from last year.

Very nice. Excited to see where this goes.

Is the vision for this to replace Theatre View? I am concerned about the comment that it's not customizable. Perhaps I'm taking that too literally. Will we build menu support, like Theatre View, Standard View, Gizmo Views, etc? Thanks!

Castius · « **Reply #24 on:** July 13, 2016, 03:38:18 pm »

Something like this
https://chrome.google.com/webstore/detail/mediaremote/gedcefoonkhpifmebflhmfdgahnhnbpg

or even better
http://chromemote.com/
https://www.youtube.com/watch?v=Ok0egjv3eCk

JimH · « **Reply #25 on:** July 13, 2016, 07:02:34 pm »

More current pictures:

http://www.pix01.com/gallery/8D12431D-7EA0-495D-9EA2-775091458CB9/MC22_Web_Interface_Apps/

The second picture is of the Settings Page. It's only functional for the JRiver Id at this time.

Hilton · « **Reply #26 on:** July 13, 2016, 07:29:49 pm »

Our vigilant web screening firewall classified that pic as p.o.r.n.

I guess you could call it that.

JimH · « **Reply #27 on:** July 13, 2016, 08:30:38 pm »

Good to know you're safe.

mikek200 · « **Reply #28 on:** July 14, 2016, 07:54:23 pm »

OK,tried to download the link for the "panel" ,Jim sent me back over here...tried to open the http://IP_ADD8SS1:52100 from my web browser,still a no go

Anyone??

Thanks,
Mike

Whistler Fred · « **Reply #29 on:** July 14, 2016, 08:04:21 pm »

Greetings!

When I try to load the web page I'm getting a "Secure Connection Failed" message. Is this a firewall issue? I'm using Firefox as my web browser.

Thanks!

Matt · « **Reply #30 on:** July 14, 2016, 08:19:44 pm »

Quote from: mikek200 on July 14, 2016, 07:54:23 pm

OK,tried to download the link for the "panel" ,Jim sent me back over here...tried to open the http://IP_ADD8SS1:52100 from my web browser,still a no go

Check the port again.

Options > Media Network > Advanced > TCP Port

The default is 52199, not 52100.

JimH · « **Reply #31 on:** July 15, 2016, 12:32:02 am »

Quote from: Whistler Fred on July 14, 2016, 08:04:21 pm

When I try to load the web page I'm getting a "Secure Connection Failed" message. Is this a firewall issue? I'm using Firefox as my web browser.

Possibly. Try localhost:52199 from the same machine, just to see what happens.

Whistler Fred · « **Reply #32 on:** July 15, 2016, 11:41:13 am »

Quote from: JimH on July 15, 2016, 12:32:02 am

Possibly. Try localhost:52199 from the same machine, just to see what happens.

Just tried it using Google and it worked. Go fig!

Thanks!

SThatcher · « **Reply #33 on:** July 15, 2016, 01:34:33 pm »

Doesn't work in Windows 10 which is very disappointing

JimH · « **Reply #34 on:** July 15, 2016, 03:39:52 pm »

Quote from: SThatcher on July 15, 2016, 01:34:33 pm

Doesn't work in Windows 10 which is very disappointing

It does. Firewall?

A.K. · « **Reply #35 on:** July 16, 2016, 10:09:29 am »

Quote from: JimH on July 08, 2016, 06:54:04 pm

An early build of MC22 is at the top of this board now.

One of the features I'm most excited about is Panel. Synergy is a great word to describe it. The whole is greater than the sum of the parts.

Here's a screenshot:

...

I couldn't get Panel to work in Android tablet or phone browser. Gizmo app running in the background, MC in computer, media network on. Am I missing something very simple?

JimH · « **Reply #36 on:** July 16, 2016, 10:36:31 am »

You need to have MC 22.0.9 (or higher) installed.

Then you connect to it from a browser. Instructions are at the bottom of the post you linked. I just made a correction. One of the ports was wrong.

A firewall might also block access.

What did you do? What happened?

Which browser?

A.K. · « **Reply #37 on:** July 16, 2016, 11:45:28 am »

Quote from: JimH on July 16, 2016, 10:36:31 am

You need to have MC 22.0.9 (or higher) installed.

Then you connect to it from a browser. Instructions are at the bottom of the post you linked. I just made a correction. One of the ports was wrong.

A firewall might also block access.

What did you do? What happened?

Which browser?

MC 22.0.9 is installed in PC and running, opened my android tablet, Gizmo app loaded in tablet and running in background, typed "localhost:52199/Gizmo" in (tablet) Chrome address bar. No success. Tried with "localhost:52100/Gizmo" Same results.
Webgizmo works in same PC where MC is installed.

JimH · « **Reply #38 on:** July 16, 2016, 12:08:05 pm »

To use localhost, you have to use the browser on the same machine where MC is installed. That's what localhost means. You need to use the IP address of the machine where MC is installed.

It's not necessary to quote my post. You can just use "reply".

A.K. · « **Reply #39 on:** July 16, 2016, 12:51:25 pm »

OK thanks, but still no success. Tried both internal and outside PC address + 52199 and 52100 "address:52199" and "address:52100"

JimH · « **Reply #40 on:** July 16, 2016, 01:06:38 pm »

Is MC running?

If it is and you've entered something like http://192.168.0.12:52199 (with your own address instead of the one I've used) in your browser, then either it is a firewall problem or it is your browser.

A.K. · « **Reply #41 on:** July 16, 2016, 01:33:40 pm »

Yes I copied my internal address from ipconfig. Tablet (chrome) is just trying to load the page forever, but nothing shows up. Interestingly apps (Gizmo & eos) are working flawlessly. During MC 22 install, I gave permission to JRiver to bypass firewall.

JimH · « **Reply #42 on:** July 16, 2016, 03:03:51 pm »

If another application is using 52199, it won't work. MC22 needs full access.

Try removing the MC entries in your firewall so that it asks what to do again.

Reboot.

A.K. · « **Reply #43 on:** July 16, 2016, 04:27:23 pm »

Ok, I went to windows firewall settings checked that MC 22 is allowed in home network (it was). Unchecked MC 22 in firewall. Rebooted PC and tablet, unchecked MC 22 media network "use media network". Rebooted MC 22, then again: options> media network>checked "use media network". MC asks permission to bypass firewall and I click yes. Still nothing in tablet. Could it be a router thing?

JimH · « **Reply #44 on:** July 17, 2016, 01:07:17 am »

Try connecting from another machine, using a browser, just as a test.

Make sure you're not running a second firewall as part of some security package.

Or, on the machine where MC is running, try typing this in a browser:

http://localhost:52199

Make sure MC or Media Server is running.

A.K. · « **Reply #45 on:** July 17, 2016, 04:01:32 am »

Good morning from here!

Tried in another machine and it works

Here's how it went: I have a old netbook living room htpc which had MC 21 and windows 8.1. Upgraded to windows 10 couple of days ago, and fresh install of MC 22 today. Copied IP to chrome address bar to my android tablet, and voila! Panel opened just like it should.

Still nothing in my main PC, which has still win 8.1. And tried that same (main PC) IP in my htpc netbook browser, but nothing. Mysterious.

JimH · « **Reply #46 on:** July 17, 2016, 04:04:42 am »

That's good news. It probably means that there is a firewall blocking access on the first machine you were trying.

A.K. · « **Reply #47 on:** July 17, 2016, 04:46:52 am »

Further testing:
I got an ipad from my friend and seems like it works perfectly fine, it plays music to htpc and from htpc ("play here"). But none of the android devices I have don't play music to "play here", but they stream music to htpc, though volume control from android does nothing (slider doesn't move), so I have to change volume from htpc. Track change and selection works from android.

BryanC · « **Reply #48 on:** July 20, 2016, 11:29:18 am »

Request: improve ability to use playback slider on mobile devices

I can't seem to tap and grab the slider bar on my mobile phone, either because it isn't working or it is too small to touch accurately.

JustinChase · « **Reply #49 on:** July 21, 2016, 10:19:33 am »

Quote from: marko on July 13, 2016, 11:43:55 am

Don't forget the default, hard coded WAF mode...

Wife/Partner arrives at house ... [it] turns on oven.

This obviously requires not a lot of logic.

Now that's some funny stuff!!

INTERACT FORUM

Author Topic: NEW: Panel -- A Built-in Web App for MC and Engen (Read 204414 times)