HTML5 Video Player

Visuals, audio, animation. Blended, not stirred. If LiveCode is part of your rich media production toolbox, this is the forum for you.

Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller

FourthWorld
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 9842
Joined: Sat Apr 08, 2006 7:05 am
Location: Los Angeles
Contact:

Re: HTML5 Video Player

Post by FourthWorld » Mon Feb 22, 2016 9:17 pm

Steve Collins wrote:I was advised in a LC forum post that calling out a video file to play in a browser is prohibited, for security reasons.
It would be helpful to see the context in which that advice was given. As you've seen, media files tend to be handled well locally within browsers, but it's JavaScript for which some of the more secure browser impose limitations.

There may be other considerations as well, so if you can turn up the URL to that earlier discussion it would be helpful.
Richard Gaskin
LiveCode development, training, and consulting services: Fourth World Systems
LiveCode Group on Facebook
LiveCode Group on LinkedIn

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 7238
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: HTML5 Video Player

Post by jacque » Mon Feb 22, 2016 9:45 pm

According to the LC page you linked to, you'll need an html file that includes video tags:
Unlike the previous non-CEF browser, we no longer need a media player such as Quicktime installed in order to play many of the media types available to us. As long as the video/audio is in the appropriate tags within a web page, the content should play.

<video width=”320″ height=”240″ controls>
<source src=”movie.mp4″ type=”video/mp4″>
<source src=”movie.ogg” type=”video/ogg”>
Your browser does not support the video tag.
</video>
So it wouldn't work to just load the video URL, you need to construct an html file and load that. Also, you might have an extra slash at the front of the file URL, so check.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Mon Feb 22, 2016 11:02 pm

https://support.microsoft.com/en-us/kb/316992 shows Windows Media Player 12 added mp4 video. That version came out in 2009 with Windows 7.

Could not get mp4 video to play on player object on PC, Windows 10, even with QT set to of in startup script and toggled off in preferences. Video plays fine in Windows Media Player when double clicked. LC will load a WMV into the browser by not play it, just the first frame is visible. So path is not the problem.
Last edited by Steve Collins on Mon Feb 22, 2016 11:21 pm, edited 1 time in total.

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Mon Feb 22, 2016 11:18 pm

jacque wrote:According to the LC page you linked to, you'll need an html file that includes video tags:
Unlike the previous non-CEF browser, we no longer need a media player such as Quicktime installed in order to play many of the media types available to us. As long as the video/audio is in the appropriate tags within a web page, the content should play.

<video width=”320″ height=”240″ controls>
<source src=”movie.mp4″ type=”video/mp4″>
<source src=”movie.ogg” type=”video/ogg”>
Your browser does not support the video tag.
</video>
So it wouldn't work to just load the video URL, you need to construct an html file and load that. Also, you might have an extra slash at the front of the file URL, so check.
This HTML file opens and plays the video fine when dropped onto a browser, with the video in the same folder/directory:

<!DOCTYPE html>
<html>
<body>
<p><video width=”320″ height=”240″ controls>
<source src="TestVideo.mp4" type="video/mp4">
<source src=”movie.ogg” type=”video/ogg”>
Your browser does not support the video tag. </video>
</p>
<p>
</p>
</body>
</html>

but when loading that same HTML file with LC with this script, only the player with a broken link shows in LC:

put revBrowserOpenCef(the windowId of this stack, "file:///Users/stevecollins/Desktop/Player/TestHTML5Video.html") into tBrowserID
revBrowserSet tBrowserID, "rect", the rect of graphic "browserPlaceholder"

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Mon Feb 22, 2016 11:36 pm

FourthWorld wrote:
Steve Collins wrote:I was advised in a LC forum post that calling out a video file to play in a browser is prohibited, for security reasons.
It would be helpful to see the context in which that advice was given. As you've seen, media files tend to be handled well locally within browsers, but it's JavaScript for which some of the more secure browser impose limitations.

There may be other considerations as well, so if you can turn up the URL to that earlier discussion it would be helpful.
Neil Rogers posted that concern and provided this link for an HTML5 discussion:
http://stackoverflow.com/questions/8885 ... -video-tag

Responses toward the bottom indicate you can load a video if loaded into a cache and using its path there, coupled with a special type of call to trick the browser into thinking the video was selected by the user. Here is the simple version of that:

If you copy the file to a cache location and set the path of the video source to it, it will play. Copy file to context.getExternalCacheDir().getAbsolutePath(). Works for me. – Derek Wade Jul 1 '14 at 22:41

I think I need to have the HTML doc cache the video, find it's path and use that instead of the one leading to the actual video on the hard drive. I may need an HTML programmer to write that.

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Wed Feb 24, 2016 2:19 am

Seriously!!! What did I not understand here? After hours of trying everything under the sun to make revBrowserOpenCef work, different HTML codes, different LC scripts, different videos; this works:

Works: revBrowserOpen
Does not work: revBrowserOpenCef

It was like magic, the HTML file with a mp4 video played in LC just like in a browser. When "revBrowserOpenCef" could not even open a basic URL on testing, I took off the Cef and URL opened, so I did the same with my HTML5 video script. Now to test on Windows.

I'm using LC 7.1.1 on El Capitan

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 7238
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: HTML5 Video Player

Post by jacque » Wed Feb 24, 2016 5:47 am

That's odd. I'm using revBrowserOpenCEF and it works:

Code: Select all

  answer file "Choose a file to display:"
  if the result is not "cancel" then
    put it into tFile
    put revBrowserOpenCef(the windowId of this stack, "file://" & tFile) into sBrowserId
  end if 
I noticed you used three slashes in the URL though, and wondered if that was one too many. Does the non-CEF browser work with three slashes?
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Wed Feb 24, 2016 6:07 am

jacque wrote:That's odd. I'm using revBrowserOpenCEF and it works:

Code: Select all

  answer file "Choose a file to display:"
  if the result is not "cancel" then
    put it into tFile
    put revBrowserOpenCef(the windowId of this stack, "file://" & tFile) into sBrowserId
  end if 
I noticed you used three slashes in the URL though, and wondered if that was one too many. Does the non-CEF browser work with three slashes?
The above script alone only produces the answer file dialog, I select the mp4 and nothing happens after that.

This path with just "//" produces nothing, with or without the Cef: file:///Users/stevecollins/Desktop/Player/TestHTML5Video.html

In one version of the HTML file with the Vimeo player HTML5 code I get a more descriptive response. Nothing with "//" and Cef, but get this message with Cef and "///" "The media could not be loaded, either because the server or format is not supported."

Something is up with the Cef, either there is a setting I need to adjust or version 7.1.1 has a bug with Cef?

Loading browser in LC, I figure, loads the browser engine of whatever the user has installed for a browser, so calling out the HTML5 version on the LC end does not change the type of features. The HTML document does not change that either. It just uses code to call the features now in modern browsers?

Thanks,
Steve
Last edited by Steve Collins on Wed Feb 24, 2016 6:21 am, edited 1 time in total.

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 7238
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: HTML5 Video Player

Post by jacque » Wed Feb 24, 2016 6:19 am

Sorry, you mentioned that no URL worked at all. My script loads an html file, which isn't a video, and it works. But since you've found a workaround now, I'd say just use it. :)

I vaguely recall a bug fix for the CEF browser in the latest LC release notes, but I can't remember if it applies to your problem.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Wed Feb 24, 2016 9:26 pm

Darn! On PC, the browser in LC reports "Your browser does not support the video tag." When switched to the revBrowserOpenCef that should work, app does nothing, not even a browser window gets opened. The HTML files opened fine in IE and played the videos. My next pursuit is to downgrade LC to a date close to when Neil Rogers reported the revBrowserOpenCef is up and running for HTML5, assuming it worked then and sometime after revBrowserOpenCef picked up a bug. Ugh!

FourthWorld
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 9842
Joined: Sat Apr 08, 2006 7:05 am
Location: Los Angeles
Contact:

Re: HTML5 Video Player

Post by FourthWorld » Wed Feb 24, 2016 10:16 pm

Do you need the CEF browser specifically?
Richard Gaskin
LiveCode development, training, and consulting services: Fourth World Systems
LiveCode Group on Facebook
LiveCode Group on LinkedIn

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Wed Feb 24, 2016 10:20 pm

FourthWorld wrote:Do you need the CEF browser specifically?
I understand the CEF browser is the only one in LC that supports HTML5. HTML5 makes mp4 videos pretty much universal on PCs. Why the non CEF version works on my Mac is a mystery to me. Neither work on Windows 10 for the play video. I have not tried opening a Web page yet. On my Mac, the CEF version opened either no part or just part of an URL, where as the non-CEF opened the same page instantly and completely. Hmm.

FourthWorld
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 9842
Joined: Sat Apr 08, 2006 7:05 am
Location: Los Angeles
Contact:

Re: HTML5 Video Player

Post by FourthWorld » Wed Feb 24, 2016 11:11 pm

My understanding is that the benefit of the CEF browser is to provide consistency across platforms. Without it revBrowser will use whatever browser engine is available on the host OS. In your case that may be a good thing.
Richard Gaskin
LiveCode development, training, and consulting services: Fourth World Systems
LiveCode Group on Facebook
LiveCode Group on LinkedIn

Steve Collins
Posts: 47
Joined: Thu Jan 10, 2008 7:15 am
Location: Redondo Beach, CA
Contact:

Re: HTML5 Video Player

Post by Steve Collins » Wed Feb 24, 2016 11:54 pm

FourthWorld wrote:My understanding is that the benefit of the CEF browser is to provide consistency across platforms. Without it revBrowser will use whatever browser engine is available on the host OS. In your case that may be a good thing.
I should keep chasing the CEF version, then. Working on the most PCs is top priority. Just tried CEF version in LC 8.0 dp15 to see if updated since my version 7.1.1. No luck.

Starting to think the CEF thing is me, a setting or something, since Jacque said she could load a Web page with it. Any reason why this CEF version does not work but does work if I remove the CEF:

put revBrowserOpenCef(the windowId of this stack, "http://hermosacyclery.com/ken.html") into tBrowserID
revBrowserSet tBrowserID, "rect", the rect of graphic "browserPlaceholder"

I get nothing with CEF, not even a browser window that covers the art below, which you usually get no matter what else is working.

Thanks,
Steve
Last edited by Steve Collins on Thu Feb 25, 2016 12:25 am, edited 1 time in total.

jacque
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 7238
Joined: Sat Apr 08, 2006 8:31 pm
Location: Minneapolis MN
Contact:

Re: HTML5 Video Player

Post by jacque » Thu Feb 25, 2016 12:09 am

It works on my Mac and I see your web page using the CEF browser, but I didn't try in Windows. If you have the same experience (works on Mac, not on Windows) then I think it's time for a bug report.
Jacqueline Landman Gay | jacque at hyperactivesw dot com
HyperActive Software | http://www.hyperactivesw.com

Post Reply

Return to “Multimedia”