<div class="w-annc  widget-announcement-4">
  <div class="w-annc__more-wrap clearfix">
    <h2 class="w-annc__widget-title">
      <span>{{widget-title}}</span>
    </h2>
    <a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
  </div>
  <ul class="w-annc__list  row" data-level="0" data-list="announcements">
    <li class="w-annc__item  col-md-4">
    <div class="w-annc__img-wrap bullseye">
      <img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
    </div>
    <div class="w-annc__content-wrap">
      <h4 class="w-annc__entry-title">
        <a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
      </h4>
      <p class="w-annc__subtitle">{{subtitle}}</p>
    </div>
    </li>
  </ul>
</div>
<script>
	var lilength = $('.widget-announcement-4 li.w-annc__item').length;
	function combineul(){
		for(var i=1;i<$('.widget-announcement-4 ul.w-annc__list').length;i++)
			$('.widget-announcement-4 ul.w-annc__list').eq(0).find('>li').eq(-1).after($('.widget-announcement-4 ul.w-annc__list').eq(i).html());
		var ullength = $('.widget-announcement-4 ul.w-annc__list').length;
		for(var i = 1;i < ullength;i++)
			$('.widget-announcement-4 ul.w-annc__list').eq(-1).remove();
	};
	function reorganize(num){
		combineul();
		for(var i=1;i< Math.ceil(lilength/num);i++){
			$('.widget-announcement-4 ul.w-annc__list').eq(-1).after('<ul class="w-annc__list  row" data-level="0" data-list="announcements"></ul>')
			var lihtml="";
			if(i != (Math.ceil(lilength/num)-1)){
				for(var j=0;j<num;j++)
					lihtml += "<li class='w-annc__item  col-md-4'>"+$('.widget-announcement-4 li.w-annc__item').eq(i*num+j).html()+"</li>"
			}else{
				for(var j=0;j< lilength - num *(Math.ceil(lilength/num)-1) ;j++)
					lihtml += "<li class='w-annc__item  col-md-4'>"+$('.widget-announcement-4 li.w-annc__item').eq(i*num+j).html()+"</li>"
			};
			$('.widget-announcement-4 ul.w-annc__list').eq(-1).html(lihtml);
		};
		if(Math.ceil(lilength/num) != 1 )
			for(var i=0;i< lilength -num ; i++ )
				$('.widget-announcement-4 ul.w-annc__list').eq(0).find("li.w-annc__item").eq(num).remove();
		$('.widget-announcement-4 ul.w-annc__list >li').css('width','calc('+100/num+'% - '+20/16+'em)'); //20px=>li的margin
	};
	$(document).ready(function(){
		if($(window).width()>1024){
			reorganize(3);
			num=3;
		}else if($(window).width()>576){
			reorganize(2);
			num=2;
		}else{
			reorganize(1);
			num=1;
		}
	});
	$(window).resize(function(){
		if($(window).width()>1024){
			reorganize(3);
			num=3;
		}else if($(window).width()>576){
			reorganize(2);
			num=2;
		}else{
			reorganize(1);
			num=1;
		}
	})
</script>
