event_news/app/views/event_news_mods/show.html.erb

<%
  	require 'event_news_helper'
    data = action_data
  	params = OrbitHelper.params
    page = Page.where(url:params['url']).first
    @ad_banner_location = 2
    @show_back_and_next_flag = 0
    if page.methods.include? 'select_option_items'.to_sym
      ModuleApp.all.select{|tmp| tmp.key.to_s=='event_news'}.each do |module_app|
        @show_option_items = module_app.show_option_items rescue nil
      end
      page.select_option_items.each do |select_option_item|
        if !(@show_option_items.nil?)
          if select_option_item.field_name == @show_option_items.keys.first.to_s
            value = YAML.load(select_option_item.value)
            tmp = value[:en]
            I18n.with_locale(:en) do
              if tmp == t('event_news.not_show')
                @show_back_and_next_flag = 0
              elsif tmp == t('event_news.show_top')
                @show_back_and_next_flag = 1
              elsif tmp == t('event_news.show_bottom')
                @show_back_and_next_flag = 2
              end
            end
          elsif select_option_item.field_name == @show_option_items.keys[2].to_s
            value = YAML.load(select_option_item.value)
            tmp = value[:en]
            I18n.with_locale(:en) do
              if tmp == t('event_news.show_top')
                @ad_banner_location = 1
              elsif tmp == t('event_news.show_bottom')
                @ad_banner_location = 2
              end
            end
          end
        end
      end
    end
    if @show_back_and_next_flag != 0
      uid = params['uid']
      sorted,total_pages = get_sorted_annc(0)
      now_index = sorted.to_enum.with_index.select{|v| v[0].uid==uid}[0][1] rescue nil
      if !now_index.nil?
        if now_index != 0
          prev_result = sorted[now_index-1]
          prev_url = params['url'] + '/' + prev_result.to_param
          prev_content = "<a href='#{prev_url}' title='#{t('event_news.prev')}' class='prev'><b>#{t('event_news.prev')}</b><p>#{prev_result['title'][I18n.locale]}</p></a>"
        end
        if now_index != sorted.length-1
          next_result = sorted[now_index+1]
          next_url = params['url'] + '/' + next_result.to_param
          next_content = "<a href='#{next_url}' title='#{t('event_news.next')}' class='next'><b>#{t('event_news.next')}</b><p>#{next_result['title'][I18n.locale]}</p></a>"
        end
        content = "<div class='see_more_boxTitle'>#{prev_content}#{next_content}</div>".html_safe
      else
        content = ''
      end
    end
    ad_banner_content = render_ad_banner(data['event_carousel_images'],data['data'])
%>
<style type="text/css">
  .carousel_images{
    <%= data['data']['carousel_display_style'] %>
  }
</style>
<%= stylesheet_link_tag 'event_news_front.css' %>
<% if @show_back_and_next_flag!=0 %>
  <style type="text/css">
    .see_more_boxTitle{
      display: flex;
      margin: 1em 0em;
      padding: 1em;
      border: 0.2em solid;
    }
    a.prev, a.next{
      width: 50%;
      border: 0.2em solid;
      padding: 1em;
      flex: 1;
    }
    a.next{
      margin-left: 1em;
    }
    a.prev{
      margin-right: 1em;
    }
  </style>
<% end %>

<% if @show_back_and_next_flag==1 %>
<%= content %>
<% end %>

<% if @ad_banner_location==1 %>
<%= ad_banner_content %>
<% end %>

<%= render_view %>

<% if @ad_banner_location==2 %>
<%= ad_banner_content %>
<% end %>

<% if @show_back_and_next_flag==2 %>
<%= content %>
<% end %>

<script>
  (function($) {

    function hideEmptyEl(el, elParent) {
      if( el.length === 0) {
        elParent.addClass('hide');
      }
    }

    // Hiding parent element when children elements are not present
    // Tags
    hideEmptyEl($('.s-annc__tag'), $('.s-annc__tag-wrap'));
    
    // Attachments
    hideEmptyEl($('.s-annc__flie-title'), $('.s-annc__related-file'));
    
    // Links
    hideEmptyEl($('.s-annc__link-title'), $('.s-annc__related-link'));
    $("img[src='']").remove();
    $('.pause-slide').click(function(){
      $(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('pause');
      $(this).addClass('active');
      $(this).parents('.carousel_images').find('.resume-slide').removeClass('active');
    });
    $('.resume-slide').click(function(){
      $(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('resume');
      $(this).addClass('active');
      $(this).parents('.carousel_images').find('.pause-slide').removeClass('active');
    });
    $('.next-button').off('click').on('click',function(){
      $(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("next");
    })
    $('.prev-button').off('click').on('click',function(){
      $(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("prev");
    })
    window.active_slide = 0;
    $('.prev_img').off('click').on('click',function(){
      var carousel_images_slide = $('.carousel_images_slide');
      var carousel_images_slide_first_child = carousel_images_slide.find(">li").eq(active_slide);
      if(carousel_images_slide_first_child.length > 0){
        var content_size = Math.floor((carousel_images_slide.outerWidth() - Number.parseInt(carousel_images_slide.css('font-size')) * 3) / carousel_images_slide_first_child.outerWidth(true));
        content_size = Math.max(content_size,1);
        if(carousel_images_slide.find(">li").length > content_size && active_slide > 0){
          active_slide -= content_size;
          carousel_images_slide.find(">li").css("display","none");
          for(var i = active_slide; i < active_slide + content_size;i++){
            carousel_images_slide.find(">li").eq(i).css("display","block");
          }
        }
      }
    })
    $('.next_img').off('click').on('click',function(){
      var carousel_images_slide = $('.carousel_images_slide');
      var carousel_images_slide_first_child = carousel_images_slide.find(">li").eq(active_slide);
      if(carousel_images_slide_first_child.length > 0){
        var content_size = Math.floor((carousel_images_slide.outerWidth() - Number.parseInt(carousel_images_slide.css('font-size')) * 3) / carousel_images_slide_first_child.outerWidth(true));
        content_size = Math.max(content_size,1);
        var li_length = carousel_images_slide.find(">li").length;
        if(li_length > content_size){
          active_slide += content_size;
          active_slide = Math.min(active_slide,li_length - 1);
          carousel_images_slide.find(">li").css("display","none");
          for(var i = active_slide; i < active_slide + content_size;i++){
            carousel_images_slide.find(">li").eq(i).css("display","block");
          }
        }
      }

    })
    $(".carousel_img_item img").off("click").on("click",function(){
      $(".carousel_images .cycle-slideshow").cycle($(this).index(".carousel_img_item img"));
    })
    $(document).ready(function(){
      $(".carousel_images .cycle-slideshow").cycle('pause');
      var carousel_image_block_width = $('.carousel_images').width();
      var heights = $(".event_carousel_slide").map(function(i,v){
        return $(v).height() * carousel_image_block_width / $(v).width();
      })
      var max_height = Math.max.apply(null,heights);
      $(".event_carousel_slide").each(function(i,v){
        $(v).height(max_height);
      })
      $(".carousel_images .cycle-slideshow").cycle('resume');
      $('.carousel_images .resume-slide').addClass('active');
      $('.cycle-slideshow').on('cycle-after',function(){
        $(".active_slide").text($('.event_carousel_slide.cycle-slide-active').index());
      })
    })
    $(window).on("load",function(){
      $(".carousel_images .cycle-slideshow").cycle('pause');
      var carousel_image_block_width = $('.carousel_images').width();
      var heights = $(".event_carousel_slide").map(function(i,v){
        return $(v).height() * carousel_image_block_width / $(v).width();
      })
      var max_height = Math.max.apply(null,heights);
      $(".event_carousel_slide").each(function(i,v){
        $(v).height(max_height);
      })
      $(".carousel_images .cycle-slideshow").cycle('resume');
    })
    $(window).resize(function(){
      var carousel_images_slide = $('.carousel_images_slide');
      var carousel_images_slide_first_child = carousel_images_slide.find(">li").eq(active_slide);
      if(carousel_images_slide_first_child.length > 0){
        var content_size = Math.floor((carousel_images_slide.outerWidth() - Number.parseInt(carousel_images_slide.css('font-size')) * 3) / carousel_images_slide_first_child.outerWidth(true));
        content_size = Math.max(content_size,1);
        carousel_images_slide.find(">li").css("display","none");
        var active_count = carousel_images_slide.find(">li").length - active_slide;
        if(active_count < content_size){
          active_slide -= (content_size - active_count);
        }
        active_slide = Math.max(active_slide,0);
        console.log(content_size)
        for(var i = active_slide; i < active_slide + content_size;i++){
          carousel_images_slide.find(">li").eq(i).css("display","block");
        }
      }
      var carousel_image_block_width = $('.carousel_images').width();
      $(".event_carousel_slide").css("height",'');
      var heights = $(".event_carousel_slide").map(function(i,v){
        return $(v).height() * carousel_image_block_width / $(v).width();
      })
      var max_height = Math.max.apply(null,heights);
      $(".event_carousel_slide").each(function(i,v){
        $(v).height(max_height);
      })
    })
  }(jQuery));
</script>