Advertisement
Barbareshet

ajax pagination - JS part

Dec 4th, 2017
140
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. jQuery(document).ready(function($){
  2.  
  3.     function find_page_number( element ) {
  4.         element.find('span').remove();
  5.         return parseInt( element.html() );
  6.     }
  7.     // //Trigger ajax at the end of page
  8.     $(window).scroll(function(){
  9.         var top = $('body.home').scrollTop();
  10.          //console.log(top);
  11.         var height = $(window).height();
  12.          // console.log(height);
  13.         var docheight = $(document).height();
  14.         // console.log('docheight: '+ docheight);
  15.         var screen = Number(docheight) - Number(height);
  16.         // console.log('screen: ' + screen);
  17.         // if( top >= height ){
  18.         //     $('a.showmore').click();
  19.         // }
  20.     });
  21.     function yHandler() {
  22.         var wrap = document.getElementById('primary');
  23.         var contHeight = wrap.offsetHeight;//get page content height
  24.         //get vertical scroll position
  25.         var yOffset = window.pageYOffset;
  26.         var y = yOffset + window.innerHeight;
  27. //            console.log(y);
  28.         if( y >= contHeight ){
  29.             $('a.showmore').click();
  30.         }
  31.  
  32.     }
  33.     window.onscroll = yHandler;
  34.     var page = 1;
  35.     var count = 10;
  36.     $('a.showmore').on('click', function( event ){
  37.         event.preventDefault();
  38.         //console.log('clicked');
  39.         page++;
  40.         if(request){
  41.             request.abort();
  42.         }
  43.         var request = $.ajax({
  44.             url: ajaxpagination.ajaxurl,
  45.             type: 'post',
  46.             data: {
  47.                 action: 'ajax_pagination',
  48.                 query_vars: ajaxpagination.query_vars,
  49.                 page: page,
  50.                 postType: $(this).data('type')
  51.  
  52.  
  53.             },
  54.             beforeSend: function(){
  55.  
  56.  
  57.             },
  58.             success: function( html ) {
  59.  
  60.                 $('#loader').remove();
  61.                 $('#primary-grid:last').append(  html  );
  62.                 //console.log( html);
  63.                 $('.grid').ajaxComplete(function () {
  64.                     //console.log('done');
  65.                     var post = $('.grid > article');
  66.                     if(!$(post).hasClass('post-num-1')){
  67.                         $(post).removeClass('xlarge-66 large-66');
  68.                         $(post).addClass('all-33 small-100 tiny-100');
  69.                     }
  70.                     $(post).on('mouseover', function () {
  71.                         //console.log('hover ok');
  72.                         $(this).addClass('t5-effect');
  73.                     });
  74.                     $(post).on('mouseout', function () {
  75.                         $(this).removeClass('t5-effect');
  76.                     });
  77.  
  78.  
  79.                 });
  80.                 if(html == '' || null){
  81.                     //$('a.showmore').hide();
  82.                     $('a.showmore').remove();
  83.                     $('.grid:last').after( '<div class="no-more-posts sr-only" style="text-align:center;">No More Posts to Show</div>' );
  84.                     function remove_no_more_posts() {
  85.                         $('.no-more-posts').remove();
  86.                     }
  87.                     setTimeout(remove_no_more_posts, 150);
  88.                     $.ajaxStop
  89.  
  90.                 }
  91.             }
  92.             // complete: $.ajaxStop
  93.         })
  94.     });
  95.  
  96. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement