WebsiteBaker Community Forum

WebsiteBaker Support (2.10.x) => Modules => Topic started by: Ruud on July 28, 2017, 05:23:58 PM

Title: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Ruud on July 28, 2017, 05:23:58 PM
After the successfull miniHero Banner module there is now a special version that uses video backgrounds.

Tip: always upload a mp4 and a webm version of the video to ensure playing on all (modern) browsers.

Demo, information and download: https://dev4me.com/modules-snippets/opensource/minihero-video-banners/
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: johnbroeckaert on July 28, 2017, 06:53:21 PM
Tested - Running smooth


T H A N K S!
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: dbs on July 28, 2017, 08:04:36 PM
Also tested. Works. Next cool module.  (Y)
No video sound hearable, good so.
Thanks for that.
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: crnogorac081 on July 28, 2017, 08:30:54 PM
nice one Ruud !  (Y)
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Hans on July 29, 2017, 12:00:19 AM
Thanks man! (Y)
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: CodeALot on July 30, 2017, 12:47:10 AM
After the successfull miniHero Banner module there is now a special version that uses video backgrounds.

Tip: always upload a mp4 and a webm version of the video to ensure playing on all (modern) browsers.

Demo, information and download: https://dev4me.com/modules-snippets/opensource/minihero-video-banners/

You rule. :)
 
For those looking for nice videos to use in this excellent new module: check https://coverr.co/ (https://coverr.co/)
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: zirzy on August 12, 2017, 07:58:52 AM
Thanks Rood for these cool MiniHero modules (Y)

But should video start automatically or from button? I tested the demo on my iPhone 7 and the video just  won't start.. or is the problem just iPhone? It didn't start with 4G and wifi connections.
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Ruud on August 13, 2017, 12:03:00 AM
I have no ways of testing on IOS. It seems there are a lot of poosible restrictions on autoplay video.

There is a nice story and testing page for video here: http://walterebert.com/blog/html5-video-autoplay-mobile-revisited/
Maybe you could do a small test there and tell us if the "playsinline" attribute helps on your device/
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: zirzy on August 13, 2017, 07:53:51 AM
This plays well but no sound on iPhone7:

Code: [Select]
<video autoplay muted playsinline controls>
   <source src="video.mp4" type="video/mp4">
   <source src="video.webm" type="video/webm">
</video>

First one plays from the start button on full screen, no sound. Second plays well but no sound. Third plays well from the start button, with sounds.

Tested with iOS Safari and iOS Chrome.


Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: CodeALot on August 14, 2017, 03:07:07 PM
Part of the most recent policies for autoplaying videos on iOS that they must be muted or contain no audio.
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Ruud on August 14, 2017, 03:47:53 PM
This plays well but no sound on iPhone7:

Code: [Select]
<video autoplay muted playsinline controls>
   <source src="video.mp4" type="video/mp4">
   <source src="video.webm" type="video/webm">
</video>
Could you check the demo on https://dev4me.com/modules-snippets/opensource/minihero-video-banners/demo/ again?
I added the missing playsinline parameter. Hopefully that fixes it for iPhones.

Note: It is not yet fixed in the download, I changed only the testpage to find out if it works!
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: zirzy on August 15, 2017, 09:54:33 AM
Quote
Could you check the demo on https://dev4me.com/modules-snippets/opensource/minihero-video-banners/demo/ again?
I added the missing playsinline parameter. Hopefully that fixes it for iPhones.

Yes, now it works correct on iPhone7.  (Y) (Y)
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Ruud on August 15, 2017, 10:46:39 AM
Yes, now it works correct on iPhone7.  (Y) (Y)

Cool, I updated the module (v0.2) with this fix.
Download: https://dev4me.com/modules-snippets/opensource/minihero-video-banners/
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: astricia on September 22, 2017, 12:40:25 PM
Just tried this module out for the first time - but the video does not play on Android, it seems?

Best,
Astrid
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Ruud on September 22, 2017, 01:44:12 PM
Just tried this module out for the first time - but the video does not play on Android, it seems?

Should be no problem on Android (recent versions) when using the MPEG-4/H.264 video format. (MP4)
You could also add a second version of the video encoded in "webm" format. That might help for some browsers. The browser will select the preferred video format.

You can test using your mobile by going to https://dev4me.com/demovideo/
This demo has both MP4 and WEBM video's available.
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: astricia on September 22, 2017, 02:10:59 PM
I have a fairly new Samsung Galaxy S7 edge with Android 7.0 and I am not seeimg your demo video. Just a big grey box with the text...

Astrid
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Ruud on September 22, 2017, 02:18:52 PM
I am also using Android 7 (Motorola phone) and it is working fine.
Using the "stock android" chrome browser!

I can't say about other browsers, but chrome should work.

(https://image.ibb.co/k6HMr5/screenshot.png)
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: astricia on September 22, 2017, 03:30:33 PM
Ok. I was using the preinstalled Samsung browser. With Chrome, I can see the video as well.

However if I go for example to www.coverr.co I can see their videos also with my Samsung browser. What are they doing differently? Samsung phones are rather popular, so I guess a big part of mobile users would use this browser.

Astrid
Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: Ruud on September 22, 2017, 04:21:20 PM
Just installed the Samsung Browser (version 6.2.00.38 beta) to test.

Both my demo page and coverr.co do not work. On coverr.co I get the "poster" jpg image but no video as well.

Title: Re: Did you like MiniHero? Now there is MiniHeroVideo
Post by: astricia on September 22, 2017, 04:32:35 PM
The initial video on coverr.co does not work (but shows at least a static image and not a blank box). But if you select any video below and set it to test as a cover, it will work.