frontend.js 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. (function($) {
  2. $(function() {
  3. $('.fl-embed-video').fitVids();
  4. // Fix multiple videos where autoplay is enabled.
  5. if (( $('.fl-module-video .fl-wp-video video').length > 1 ) && typeof $.fn.mediaelementplayer !== 'undefined' ) {
  6. $('.fl-module-video .fl-wp-video video').mediaelementplayer( {pauseOtherPlayers: false} );
  7. }
  8. });
  9. /**
  10. * Class for the Video Module
  11. * @since 2.4
  12. */
  13. FLBuilderVideo = function( settings ){
  14. // Set params
  15. this.nodeID = settings.id;
  16. this.nodeClass = '.fl-node-' + settings.id;
  17. this.wrapperClass = this.nodeClass + ' .fl-video';
  18. this._initVideo();
  19. this._initStickyOnScroll();
  20. };
  21. FLBuilderVideo.prototype = {
  22. _initVideo: function(){
  23. var origTop = $( this.nodeClass ).offset().top,
  24. origLeft = $( this.nodeClass ).offset().left,
  25. origHeight = $( this.nodeClass ).outerHeight(),
  26. origWidth = $( this.nodeClass ).outerWidth();
  27. $( this.nodeClass ).attr( 'data-orig-top', origTop );
  28. $( this.nodeClass ).attr( 'data-orig-left', origLeft );
  29. $( this.nodeClass ).attr( 'data-orig-height', origHeight );
  30. $( this.nodeClass ).attr( 'data-orig-width', origWidth );
  31. },
  32. _makeSticky: function(){
  33. var origLeft = $( this.nodeClass ).data( 'orig-left'),
  34. origHeight = $( this.nodeClass ).data( 'orig-height'),
  35. origWidth = $( this.nodeClass ).data( 'orig-width');
  36. $( this.nodeClass ).addClass( 'fl-video-sticky' );
  37. $( this.nodeClass ).css( 'left', origLeft );
  38. $( this.nodeClass ).css( 'height', origHeight );
  39. $( this.nodeClass ).css( 'width', origWidth );
  40. },
  41. _removeSticky: function(){
  42. $( this.nodeClass ).removeClass( 'fl-video-sticky' );
  43. },
  44. _initStickyOnScroll: function(){
  45. $( window ).on( 'scroll', $.proxy( function( e ) {
  46. var win = $( window ),
  47. winTop = win.scrollTop(),
  48. nodeTop = $( this.nodeClass ).data( 'orig-top' );
  49. isSticky = $( this.nodeClass ).hasClass( 'fl-video-sticky' );
  50. if ( winTop >= nodeTop ) {
  51. if ( ! isSticky ){
  52. this._makeSticky();
  53. }
  54. } else {
  55. this._removeSticky();
  56. }
  57. }, this ) );
  58. },
  59. };
  60. })(jQuery);