Search code examples
jqueryiframepopupmagnific-popup

Multiple vimeo pattern for magnific popup


question to those who customized magnific popup - how do I combine multiple vimeo patterns for iframe type in Magnific Popup plugin? Here is the video urls I need to play and their patterns:

https://player.vimeo.com/external/xxxxx.hd.mp4

patterns: {
    ...
    vimeo: {
       index: '//vimeo.com/',
       id: '/',
       src: '//player.vimeo.com/external/%id%'
    },
    ...
}

https://vimeo.com/xxxx

patterns: {
    ...
    vimeo: {
       index: 'vimeo.com/',
       id: '/',
       src: '//player.vimeo.com/video/%id%?autoplay=1'
    },
    ...
}

Each pattern works individually, but the question is how to use them together?

Thanks


Solution

  • The solution was to use id as a function:

    patterns: {
          vimeo: {
            index: 'vimeo.com/',
            id: function(src){
               if (src.indexOf('external') > -1) {
                  return 'external/' + src.substr(src.lastIndexOf('/')+1, src.length);
               } else {
                  return 'video/' + src.substr(src.lastIndexOf('/')+1, src.length);
               }
            },
            src: '//player.vimeo.com/%id%?autoplay=1'
          },
        },