Reformat prettyphoto Vimeo Player embed expression

Question

I'm having trouble with prettyphoto outputting the video embed links in the wrong order for unlisted videos, resulting in the video player stating that the video does not exist.

Background: the video link will be something like this:

https://vimeo.com/12345/abcde

The output becomes:

https://player.vimeo.com/video/12345?title=0&byline=0&portrait=0&autoplay=1&allowFullScreen=1;h=abcde;

As you can see, the unlisted video hash gets appended to the end of the link. It SHOULD look like this:

https://player.vimeo.com/video/12345?h=abcde&title=0&byline=0&portrait=0&autoplay=1&allowFullScreen=1;

Note the hash "h=abcde" comes after the video id "12345".

Prettyphoto uses the code below to output the video player:

case 'vimeo':
    pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport
                
    movie_id = pp_images[set_position];
    var regExp = /http(s?):\/\/(www\.)?vimeo.com\/(\d+)/;
    var match = movie_id.match(regExp);
                    
    movie = 'http://player.vimeo.com/video/'+ match[3] +'?title=0&amp;byline=0&amp;portrait=0';
    if(settings.autoplay) movie += "&autoplay=1;";
            
    vimeo_width = pp_dimensions['width'] + '/embed/?moog_width='+ pp_dimensions['width'];
            
    toInject = settings.iframe_markup.replace(/{width}/g,vimeo_width).replace(/{height}/g,pp_dimensions['height']).replace(/{path}/g,movie);
break;

How can I edit this match expression so that the player link outputs correctly? I feel like this should be easy, but I can't figure it out.

score 0 · Accepted Answer · answered Feb 23 '23 at 22:57

In case it's any use to anyone. I've figured out part of the solution to this.

I updated the Vimeo portion of the prettyphoto code to this:

case 'vimeo':
    pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport
                
    movie_id = pp_images[set_position];
    var regExp = /^https?:\/\/(?:www\.)?vimeo\.com\/(\d+)\/(\w+)/;
    var match = movie_id.match(regExp);
    var videoId = match[1];
    var videoHash = match[2];
                    
    movie = 'https://player.vimeo.com/video/'+ videoId +'?h=' + videoHash +'&title=0&amp;byline=0&amp;portrait=0';
    if(settings.autoplay) movie += "&autoplay=1&";
    else movie += "&autoplay=0&";

    vimeo_width = pp_dimensions['width'] + '/embed/?moog_width='+ pp_dimensions['width'];
            
    toInject = settings.iframe_markup.replace(/{width}/g,vimeo_width).replace(/{height}/g,pp_dimensions['height']).replace(/{path}/g,movie);
break;

The only thing I couldn't get around is that somehow someway, it's still appending the hash string to the end of the output URL. I couldn't figure out how to stop that from happening, so I just added the "&" after the autoplay parameter, and Vimeo seems to allow that.

Working for now, but a bit hacky.

Reformat prettyphoto Vimeo Player embed expression

1 Answers1