script.js 4.87 KB
(function($){

    /**
     * initializeBlock
     *
     * Adds custom JavaScript to the block HTML.
     *
     * @date    15/4/19
     * @since   1.0.0
     *
     * @param   object $block The block jQuery element.
     * @param   object attributes The block attributes (only available when editing).
     * @return  void
     */
    var initializeBlock = function( $block ) {
        // $block.find('.carousel-items:not(.large)').slick({
        //     dots: false,
        //     infinite: true,
        //     speed: 300,
        //     slidesToShow: 4,
        //     adaptiveHeight: false,
        //     arrows:true,
        //     variableWidth: true,
        //     responsive: [
        //         {
        //           breakpoint: 1024,
        //           settings: {
        //             slidesToShow: 3,
        //             slidesToScroll: 1,
        //           }
        //         },
        //         {
        //           breakpoint: 600,
        //           settings: {
        //             slidesToShow: 2,
        //             slidesToScroll: 1
        //           }
        //         },
        //         {
        //           breakpoint: 480,
        //           settings: {
        //             slidesToShow: 1,
        //             slidesToScroll: 1
        //           }
        //         }
        //         // You can unslick at a given breakpoint now by adding:
        //         // settings: "unslick"
        //         // instead of a settings object
        //       ]
        // });
      //   $block.find('.carousel-items.large').slick({
      //     dots: false,
      //     centerMode:true,
      //     infinite: true,
      //     speed: 300,
      //     slidesToShow: 2,
      //     adaptiveHeight: false,
      //     arrows:true,
      //     variableWidth: true,
      //     responsive: [
      //         {
      //           breakpoint: 1024,
      //           settings: {
      //             slidesToShow: 2,
      //             slidesToScroll: 1,
      //           }
      //         },
      //         {
      //           breakpoint: 600,
      //           settings: {
      //             slidesToShow: 2,
      //             slidesToScroll: 1
      //           }
      //         },
      //         {
      //           breakpoint: 480,
      //           settings: {
      //             slidesToShow: 1,
      //             slidesToScroll: 1
      //           }
      //         }
      //         // You can unslick at a given breakpoint now by adding:
      //         // settings: "unslick"
      //         // instead of a settings object
      //       ]
      // });  
        // $('.slick-list').css('margin-left', $('.entry-content').css('margin-left'));
        $('.carousel').css('margin-left',"-"+$('.entry-content').css('margin-left'));            
    
    }

    $(window).on('resize', function(){
        // $('.slick-list').css('margin-left', $('.entry-content').css('margin-left'));
        $('.carousel').css('margin-left',"-"+$('.entry-content').css('margin-left'));             
    });

    // Initialize each block on page load (front end).
    $(document).ready(function(){
        $('.carousel').each(function(){
            initializeBlock( $(this) );
        });
    });

    // Initialize dynamic block preview (editor).
    if( window.acf ) {
        window.acf.addAction( 'render_block_preview/type=quote', initializeBlock );
    }
 
  
function stretch(){
  var margin_left =  parseInt($('.entry-content').css('margin-left')) + 20;
  var margin_right =  parseInt($('.entry-content').css('margin-right')) + 20;

  $('.stretch-left').css('margin-left',"-"+margin_left);  
  $('.stretch-left').css('padding-left',margin_left); 

  $('.stretch-right').css('margin-right',"-"+margin_right+'px');  
  $('.stretch-right').css('padding-right',+margin_right+'px');  
  
  $('.stretch').css('margin-left',"-"+margin_left+'px');  
  $('.stretch').css('margin-right',"-"+margin_right+'px');  
  $('.stretch').css('padding-left',margin_right+'px');  
  $('.stretch').css('padding-right',margin_left+'px');  
}

jQuery(function($) {
  stretch();
  $('.sameHeight').sameHeight();
  $(window).on('resize', function(){
      stretch();
      $('.sameHeight').sameHeight();    
  });
});

})(jQuery);


(function( $ ) {
  // the sameHeight functions makes all the selected elements of the same height
  $.fn.sameHeight = function() {

      var selector = this;
      var heights = [];

      // Save the heights of every element into an array
      selector.each(function(){
          var height = $(this).height();
          heights.push(height);
      });

      // Get the biggest height
      var maxHeight = Math.max.apply(null, heights);
      // Show in the console to verify
      console.log(heights,maxHeight);

      // Set the maxHeight to every selected element
      selector.each(function(){
          $(this).height(maxHeight);
      }); 
  
  };

}( jQuery ));