[feat]Use Ajax for paginating happening_now

app/assets/javascripts/application.js

@@ -54,6 +54,7 @@
 //= require selectize
 //= require bootstrap-select
 //= require osem-survey
+//= require pagy
 
 $(document).ready(function() {
     $('a[disabled=disabled]').click(function(event){
@@ -63,4 +64,6 @@ $(document).ready(function() {
     $('body').smoothScroll({
         delegateSelector: 'a.smoothscroll'
     });
+
+    window.addEventListener("load", Pagy.init);
 });

app/controllers/conferences_controller.rb

@@ -77,7 +77,7 @@ class ConferencesController < ApplicationController
       events_schedules_list = get_happening_now_events_schedules(@conference)
       @events_schedules_limit = EVENTS_PER_PAGE
       @events_schedules_length = events_schedules_list.length
-      @pagy, @events_schedules = pagy_array(events_schedules_list, items: @events_schedules_limit)
+      @pagy, @events_schedules = pagy_array(events_schedules_list, items: @events_schedules_limit, link_extra: 'data-remote="true"')
       @happening_now_url = happening_now_conference_schedule_path(conference_id: @conference.short_title, format: :json)
     end
   end

app/views/conferences/_about_and_happening_now.haml

@@ -4,18 +4,10 @@
       -# happening now events are displayed second in md or lg view
       .col-md-6.col-md-push-6.col-lg-4.col-lg-push-8
         #happening-now
-          - if conference.splashpage.include_happening_now
-            - if @events_schedules.any?
-              .row
-                %h2.text-center{ style: 'margin-bottom:30px' } Happening Now
-              - events_schedules.each do |event_schedule|
-                = render 'schedules/event', conference: conference, event_schedule: event_schedule, event: event_schedule.event
-              - if events_schedules_length > events_schedules_limit
-                .container{ style: 'width:100%; text-align:center' }
-                  != pagy_bootstrap_nav(pagy)
-            - else
-              .row
-                %h3.text-center There are no events happening now.
+          = render 'happening_now', conference: conference,
+            events_schedules: events_schedules, pagy: pagy,
+            events_schedules_length: events_schedules_length,
+            events_schedules_limit: events_schedules_limit
       - if conference.description.present?
         .col-md-6.col-md-pull-6.col-lg-8.col-lg-pull-4
           #about

app/views/conferences/_happening_now.haml

@@ -0,0 +1,12 @@
+- if conference.splashpage.include_happening_now
+  - if events_schedules.any?
+    .row
+      %h2.text-center{ style: 'margin-bottom:30px' } Happening Now
+    - events_schedules.each do |event_schedule|
+      = render 'schedules/event', conference: conference, event_schedule: event_schedule, event: event_schedule.event
+    - if events_schedules_length > events_schedules_limit
+      .container{ style: 'width:100%; text-align:center' }
+        != pagy_bootstrap_nav_js(pagy)
+  - else
+    .row
+      %h3.text-center There are no events happening now.

app/views/conferences/show.js.erb

@@ -0,0 +1,5 @@
+$('#happening-now').html("<%= j(render 'happening_now', conference: @conference,
+                                events_schedules: @events_schedules, pagy: @pagy,
+                                events_schedules_length: @events_schedules_length,
+                                events_schedules_limit: @events_schedules_limit)%>");
+Pagy.init(document.getElementById('happening-now'));