Flowplayer: Tips, Tweaks and other How To's

MikeLFD

Joined: 2013-03-22
Posts: 79
Posted: Fri, 2013-03-22 02:46

How can I stop Gallery 3 from automatically starting to play a video.
I'd prefer to have users click on the play button.
Thanks in advance.

**********************************************************************
April 5, 2013- I re-named this thread because it grew (from the original question) into more of a how to thread.

Mike
 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Fri, 2013-03-22 03:34

Edit gallery3/modules/gallery/views/movieplayer-flash.html.php adding the bold:

      "clip": {
        "scaling": "fit",
	"autoPlay": false,
        "onMetaData": function(clip) {

Dave

_____________________________________________
Blog & G2 || floridave - Gallery Team
 
MikeLFD

Joined: 2013-03-22
Posts: 79
Posted: Fri, 2013-03-22 04:34

Awesome! That did it.
Thank you
 
MarkRH

Joined: 2007-05-25
Posts: 241
Posted: Tue, 2013-04-02 05:15

Cool. TIP: autoPlay is, uhm, case sensitive LOL.

Is there a parameter that can be added to show a still image (movie's thumbnail), instead of blank white? Suppose I could go look at the docs for the player.

- Mark H.

Using Gallery 3.0.6 - gallery.markheadrick.com
 
MikeLFD

Joined: 2013-03-22
Posts: 79
Posted: Tue, 2013-04-02 14:57

How can we update flow player to flow player HTML5?
Downloading the player from flow player and uploading the flowplayer.js and flowplayer.swf causes the player to disappear.
 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Tue, 2013-04-02 22:38

For movie thumbnail for the BG image of the player edit the same file adding:

<style>
#<?= $attrs["id"] ?> {
  background: black url('<?= $theme->item()->thumb_url() ?>') center no-repeat !important;
  background-size:100% 100% !important;
}
</style>

to the end after the </script> tag

Dave

_____________________________________________
Blog & G2 || floridave - Gallery Team
 
shadlaws

Joined: 2012-03-14
Posts: 183
Posted: Wed, 2013-04-03 05:51

@MikeLFD - updating the player to HTML5 isn't a simple drop-in replacement. The yet-to-be-finished Gallery 3.1, however, already has this done :-).

Shad
 
MarkRH

Joined: 2007-05-25
Posts: 241
Posted: Wed, 2013-04-03 06:08

Thanks Dave. After trying it out, which did work, I removed the background-size part. Bits of the thumbnail image showed through above and below the part where the video played, making it look kind of funky. The black background with a centered image looks fine to me.

- Mark H.

Using Gallery 3.0.6 - gallery.markheadrick.com
 
MikeLFD

Joined: 2013-03-22
Posts: 79
Posted: Wed, 2013-04-03 13:10

@shadlaws- I figured that out. Thanks for the steer to 3.1 will have a look at it (when it's available).
@Dave- awesome on the thumb part. Works on clean canvas but not on grey dragon. I'll make a decision in a couple of days what look I want.
@Mark- I changed the second 100% to 95% and it cured that bleed over.

I was putzing with plugins yesterday and noticed 2 pseudostreaming files. Oddly it appears you can use either one.
Wondering if a new thread is in order strictly for flowplayer tweaks.
 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Wed, 2013-04-03 14:15

MikeLFD & MarkRH,
Perhaps you can create some docs for the codex with the various flowplayer changes? Giving back to the community.

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team
 
MikeLFD

Joined: 2013-03-22
Posts: 79
Posted: Wed, 2013-04-03 22:33

Not sure if this is what you meant or not Dave, But here is my procedure for using the Flowplayer sharing plugin

1st download the share plugin from flow player:
http://releases.flowplayer.org/flowplayer.sharing/flowplayer.sharing-3.2.14.swf
and upload it to your gallery lib folder
Next open /modules/gallery/views/movieplayer.html.php and find this section:

 $.extend(true, {
      "plugins": {
        "pseudostreaming": {
          "url": "<?= url::abs_file("lib/flowplayer.pseudostreaming-byterange.swf") ?>"
        },
        "controls": {
          "autoHide": "always",
          "hideDelay": 2000,
          "height": 24

below "url": "<?= url::abs_file("lib/flowplayer.pseudostreaming-byterange.swf") ?>"
}, and above "controls": {
Add the following

"sharing": {
            "url": "<?= url::abs_file("lib/flowplayer.sharing-3.2.14.swf") ?>",        
 "buttons": {
                 "Color": "#0040FF",
                 "overColor": "#ff0000"
            },

"email": {
                "subject": "Check out this new video ",
"template": "{1} "
               },




},

In the above code I have allowed ALL sharing (email, embed, twitter and facebook). You may pick and choose what sharing formats you want to use.
In the below code I have decided not to allow Facebook and Twitter sharing

"sharing": {
            "url": "<?= url::abs_file("lib/flowplayer.sharing-3.2.14.swf") ?>",        
 "buttons": {
                 "Color": "#0040FF",
                 "overColor": "#ff0000"
            },

"email": {
                "subject": "Check out this new video ",
"template": "{1} "
               },
"twitter": false,
"Facebook": false



},

For the code editing challenged (like I was 2 years ago) I'm attaching the file. just unzip and upload to your /modules/gallery/views/ folder.
My file "only allows" email and facebook sharing, reading the above should help you add or remove your own sharing preferences.

Have fun and remember always backup your original file before editing
 
MikeLFD

Joined: 2013-03-22
Posts: 79
Posted: Wed, 2013-04-03 20:35

I used blue with a mouse-over color of red for my choice of button colors in the above post.
You can change your button color and mouse-over color to find the right match for you.
simply change the color code in this section 

"buttons": {
                 "Color": "#0040FF",
                 "overColor": "#ff0000"
            },