MP4 HTML5 Video - Bug - No live page view?

General Bug Reports
1

Hello,

Does Pinegrow have an issue or restriction previewing and playing mp4 video via it’s “ live page view ” ?

By contrast webm and ogg preview correctly but mp4 does not play. If you happen to include all 3 sources ( mp4 / webm / ogg ) you would not realize the issue is present. My tests were on Mac, so I’m not sure if the same issue persists on Windows and Linux.

Here are two basic examples that should demonstrate the problem:

Example 1:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>HTML5 Video</title>
	<style type="text/css">
		.vid-size {
			width: 427px;
			height: 240px;
		}
	</style>
</head>
<body>
	<div>
	<p>Example 1 --  mp4 only -- will not show / play</p>
		<video id="video1" class="vid-size" controls >
			<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
		</video>
	</div>
	<p>Example 2 -- mp4 / webm / ogg -- plays but uses other source, not mp4</p>
	<div>
		<video id="video2" class="vid-size" controls >
			<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
			<source src="https://www.w3schools.com/html/mov_bbb.webm" type="video/webm">
			<source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
		</video>
	</div>
</body>
</html>

Example 2:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>HTML5 Video</title>
	<style type="text/css">
		.vid-size {
			width: 427px;
			height: 240px;
		}
		.grey-button {
			display: inline-block;
			margin: 2px;
			padding: 10px 20px;
			cursor: pointer;
			text-align: center;
			text-decoration: none;
			color: black;
			border: none;
			background-color: #e7e7e7;
			font-size: 14px;
		}
	</style>
</head>
<body>
	<div>
		<video id="video" class="vid-size" controls ></video>
	</div>
	<p id="vid-source">Choose a Video Source:</p>
	<button class="grey-button" onclick="changeVideo('https://www.w3schools.com/html/mov_bbb.mp4')">MP4</button>
	<button class="grey-button" onclick="changeVideo('https://www.w3schools.com/html/mov_bbb.webm')">webm</button>
	<button class="grey-button" onclick="changeVideo('https://www.w3schools.com/html/mov_bbb.ogg')">ogg</button>
	<script type="text/javascript">
		function changeVideo(vURL) {
			document.getElementById('video').setAttribute("src", vURL);
			document.getElementById('video').load();
			document.getElementById('video').play();
			document.getElementById("vid-source").textContent = vURL;
		}
	</script>
</body>
</html>

So is it just me, or does Pinegrow have an issue with previewing and playing mp4 videos on page via its live page view?

I also backwards tested things from Pinegrow 2.951 up to the latest version 4.3. With each version resulting in the same outcome of not playing mp4 videos. Also regardless of trying multiple video sources. This was also confirmed by one other Mac user as well.

Is there some underlying issue, glitch, oversight, restriction, or bug regarding MP4 and “live page view” in Pinegrow ?

Thanks. :wink:

:heart: :evergreen_tree:

2

Due to licensing issues, Pinegrow doesn’t ship with the necessary codecs for patented media formats.

3

mmmm, a hack called for? :slight_smile:
yoo hoo… @itsmeleo… :smiley:

4

This is just a preview issue in PG, if you preview from the browser, these media are visible.
I don’t think there is a big deal here …

5

yes no problems.
just the fun factor of a bit of a nice challenge :slight_smile:

6

Thanks for the response @Emmanuel

Yes I was already aware of that, so I was specifically questioning Pinegrow’s “live page view” inabilties.

I had not throught of that. But yes now that I am tipped as to what to look for I see it being discussed.

Seems to be for many from what I have now seen after looking into it surrounding NW.js.

I see there are suggestions for recompiling FFmpeg. Seems like some are trying:

:thinking: Sigh. Codecs & Patents, not much has changed in 20+ years, a pitty.

1 Like
7

Good bit of detective work there.
so! which version of NWJS does the current Pinegrow 4.3 use, in order to experiment with the
mac dylib

found

here

?

I found a libffmpeg.dylib version at /Applications/Pinegrow_4.3.app/Contents/Versions/63.0.3239.108

8

I’m would assume they use the latest NW.js release for Pinegrow builds they release (secrity/performance/etc.), but I’m not sure if that is the case. They may however stay back a bit to ensure compatibility or reliabilty. But based on the assumption date wise that they use the latest upon release, then between the two these would match up.

nwjs

pinegrow

nwjs

But that is merely my assumption. :no_mouth:

I had initially hoped it was an some underlying issue, glitch, oversight, regarding MP4. That could be fixed and released as part of the app itself.

9

Yeah, I did the same as you wrt the dates.
So, have you tried the replacement and seen if it allows you to view your file in Pinegrow Preview?
if so, how did it go?

10

Yep! :slight_smile:
that works.

that version works fine and plays.
latest version causes it to crash to desktop on rendering :slight_smile:

tidy! I now have more versatile Pinegrow :smiley:
good catch and link hunting @Pinegrow_User

Pimped!

My very own PimpGrow 4.3.
Lovely

11

Yes, I had tried things also and it does resolve the issue in Pinegrow.

I understand the licensing, legalities and the aspects that entails. But as stated I had hoped it was a simple oversight or glitch — I just had not thought of the patent aspect when I posted.

So if desired people can pair up the correct versions of the modified “nwjs-ffmpeg” linked and referenced above. But doubt that I want to remember and mess with applying patches with each update of Pinegrow, etc., even as ‘easy’ as it is to do.

At least the issue is deciphered and a fix is available to those whom desire it. I just wish it was resolvable and part of the Pinegrow releases.

3 options to resolve the issue of playing MP4 in Pinegrow (live page view):

  • Swap and use the corresponding version of the “nwjs-ffmpeg” patch
  • Reference multiple video sources
  • Preview page in browser (CMD+B) and view in Chrome, not Chromium (NW.js / Pinegrow)
  • etc.,

Onward. Thanks for the discussion @schpengle, and your responses @Emmanuel .

:evergreen_tree: :heart: