fix some error

This commit is contained in:
chiu 2021-09-06 13:44:20 +08:00
parent cb51768c5a
commit 687dcb8f8c
5 changed files with 125 additions and 91 deletions

View File

@ -1,4 +1,4 @@
var CalendarModuleMonth2 = function(date,dom,subpart,url,index_flag){
var EventCalendarModuleMonth2 = function(date,dom,subpart,url,index_flag){
_this = this;
var events = {}
var template = dom.find(".month_template"),
@ -16,7 +16,7 @@
lastDay = new Date(Date.UTC(year,month+1,0)),
today = date.getDate(),
last_inserted_date = 1,
monthDom = $("<div data-year='"+year+"' data-month='"+month+"'></div>"),
monthDom = $("<div class=\"height100\" data-year='"+year+"' data-month='"+month+"'></div>"),
eventHTML = dom.find('div.calendar-events')[0],
event_template = dom.find('div.calendar-events .event').prop('outerHTML'),
prevMonthFunc,
@ -24,7 +24,7 @@
toggle_data,
hover_step=10,
hover_step_max=10,
hover_max_height=19.2,
hover_max_height=13,
toggling=false,
switching=false,
tp1,
@ -101,28 +101,28 @@
}
$(window).resize(function(){
var window_w = $(window).width()
$('.widget-calendar-2 div.calendar-events').each(function(){
var this_w = $(this).parents('.widget-calendar-2').width()
if (this_w>=728 && window_w>=768){
if (!$(this).hasClass('width-50')){
$(this).removeClass('width-100')
$(this).addClass('width-50')
$(this).css('width','50%')
$(this).parents('div[data-module="calendar"]').find('div').eq(0).css('width','50%')
}
}else{
if (!$(this).hasClass('width-100')){
$(this).addClass('width-100')
$(this).removeClass('width-50')
$(this).css('width','100%')
$(this).parents('div[data-module="calendar"]').find('div').eq(0).css('width','100%')
}
var this_w = dom.width()
var event_doc = dom.find('.calendar-events');
if (this_w>=728 && window_w>=768){
if (!event_doc.hasClass('width-50')){
event_doc.removeClass('width-100')
event_doc.addClass('width-50')
event_doc.css('width','50%')
event_doc.parents('div.w-calendar').find('div').eq(0).css('width','50%')
}
}else{
if (!event_doc.hasClass('width-100')){
event_doc.addClass('width-100')
event_doc.removeClass('width-50')
event_doc.css('width','100%')
event_doc.parents('div.w-calendar').find('div').eq(0).css('width','100%')
}
}
})
})
var show_event = function(date,ele){
var event_div = $(ele).parents('div[data-module="calendar"]').find('div.calendar-events')
var event_div = $(ele).parents('div.w-calendar').find('div.calendar-events')
$(ele).parents('.w-calendar').find('td.shown').removeClass('shown')
$(ele).addClass('shown')
function set_event(date,active_flag){
@ -260,63 +260,64 @@
$('.ui-dialog button').blur();
})
function event_hover(){
if (!$(this).hasClass('active')){
tp1 = $(this).parents('.calendar-events').eq(0).find('.event.active .event-containers')
tp2 = $(this).find('.event-containers')
var event_doc = $(this).parents('.event').eq(0);
if (!event_doc.hasClass('active')){
tp1 = event_doc.parents('.calendar-events').eq(0).find('.event.active .event-containers');
tp2 = event_doc.find('.event-containers');
if (!toggling){
tp2.css('height','0')
tp2.css('min-height','0')
hover_step = hover_step_max
tp2.css('height','0');
tp2.css('min-height','0');
hover_step = hover_step_max;
}else{
hover_step = hover_step_max - hover_step
hover_step = hover_step_max - hover_step;
}
$(this).addClass('active')
event_doc.addClass('active');
function toggle_height(){
tp1.css('height',(hover_step*hover_max_height/hover_step_max)+'em')
tp2.css('height',(hover_max_height-hover_step*hover_max_height/20)+'em')
tp1.css('height',(hover_step*hover_max_height/hover_step_max)+'em');
tp2.css('height',(hover_max_height-hover_step*hover_max_height/hover_step_max)+'em');
hover_step = hover_step-1;
if (hover_step>=0){
setTimeout(toggle_height,50)
setTimeout(toggle_height,50);
}else{
tp1.css('min-height','')
tp2.css('min-height','')
tp1.css('height','')
tp2.css('height','')
toggling = false
tp1.css('min-height','');
tp2.css('min-height','');
tp1.css('height','');
tp2.css('height','');
toggling = false;
}
}
if (!toggling){
setTimeout(toggle_height,50)
setTimeout(toggle_height,50);
}
tp1.css('height',tp1.height())
tp1.css('min-height','0')
tp1.parents('.event').removeClass('active')
toggling = true
tp1.css('height',tp1.height());
tp1.css('min-height','0');
tp1.parents('.event').removeClass('active');
toggling = true;
}
}
event_div.find('.event').hover(event_hover)
event_div.find('.event').click(event_hover)
$(ele).parents('div[data-module="calendar"]').css('display','flex')
if ($(ele).parents('div[data-module="calendar"]').width()>=728 && $(window).width()>=768){
event_div.find('.event .event-header').hover(event_hover);
event_div.find('.event .event-header').click(event_hover);
$(ele).parents('div.w-calendar').css('display','flex');
if ($(ele).parents('div.w-calendar').width()>=728 && $(window).width()>=768){
event_div.css('width','50%')
event_div.addClass('width-50')
event_div.removeClass('width-100')
$(ele).parents('div[data-module="calendar"]').find('div').eq(0).css('width','50%')
$(ele).parents('div.w-calendar').find('div').eq(0).css('width','50%')
}else{
event_div.css('width','100%')
event_div.addClass('width-100')
event_div.removeClass('width-50')
$(ele).parents('div[data-module="calendar"]').find('div').eq(0).css('width','100%')
$(ele).parents('div.w-calendar').find('div').eq(0).css('width','100%')
}
event_div.show()
}
var hide_event = function(ele){
$(ele).parents('.w-calendar').find('td.shown').removeClass('shown')
var event_div = $(ele).parents('div[data-module="calendar"]').find('div.calendar-events')
$(ele).parents('div[data-module="calendar"]').css('display','block')
$(ele).parents('div[data-module="calendar"]').find('div').eq(0).css('width','')
var event_div = $(ele).parents('div.w-calendar').find('div.calendar-events')
$(ele).parents('div.w-calendar').css('display','block')
$(ele).parents('div.w-calendar').find('div').eq(0).css('width','')
event_div.hide()
//$(ele).parents('div[data-module="calendar"]').find('td.w-calendar-toggle').removeClass('w-calendar-toggle')
//$(ele).parents('div.w-calendar').find('td.w-calendar-toggle').removeClass('w-calendar-toggle')
event_div.find('.event-container-one').remove()
}
var renderMonth = function(){
@ -462,7 +463,7 @@
type : "get"
}).done(function(data){
events = {}
$(dom).find('.w-calendar-title span').eq(-1).html(data['calendar_title'])
$(dom).find('.w-calendar-title span').eq(0).html(data['calendar_title'])
$.each(data.events,function(index,eve){
var sd = new Date(eve.start),
ed = new Date(eve.end),
@ -475,7 +476,7 @@
}
if(dayDiff > 0){
var inserting_date = sd.getDate();
for(var i = 0;i <= dayDiff; i++){
for(var i = 0;i < dayDiff; i++){
var dt = inserting_date + "-" + sd.getMonth() + "-" + sd.getFullYear(),
td = dom.find("td[data-date-node=" + dt + "]");
if (events[dt]==undefined){
@ -532,7 +533,7 @@
this.currentMonth = function(){
renderMonth();
var div_tag = $('<div></div>')
var div_tag = $('<div class="height100"></div>')
var widge_title = dom.find('.w-calendar-title').eq(0)
div_tag.html(monthDom)
div_tag.prepend(widge_title)

View File

@ -2,6 +2,12 @@
.w-calendar-table {
table-layout: fixed;
width: 100%;
flex: 1;
}
.height100 {
flex: 1;
display: flex;
flex-direction: column;
}
a.event-container-one{
color: inherit;
@ -39,9 +45,14 @@
.calendar-events{
position: relative;
background: #fbfbfb;
display: flex;
flex-direction: column;
}
.month_template{
position: relative;
height: 100%;
display: flex;
flex-direction: column;
}
flex-wrap: wrap;
margin-top: 2em;
@ -55,6 +66,7 @@
color: inherit;
cursor: pointer;
border: 0;
vertical-align: middle;
}
.w-calendar-table td div{
display: inline-flex;
@ -89,11 +101,17 @@
color: rgb(255, 255, 255);
padding: 0px 10%;
display: flex;
flex-flow: row-reverse wrap;
line-height: 2em;
justify-content: center;
justify-content: space-between;
font-size: 1.85em;
width: 100%;
.w-calendar-title span:last-child{
float: right;
}
}
.w-calendar-title.center{
text-align: center;
justify-content: center;
}
.calendar-dialog div.ui-dialog-content {
max-height: 20em !important;
@ -201,13 +219,14 @@
.event-wraper{
position: relative;
overflow: hidden;
flex: 1;
}
.event-container-one:not(.active) {
right: -100%;
}
.event.active .event-containers{
min-height: 19.2em;
height: auto;
min-height: 13em;
height: 100%;
}
.calendar-events.width-100 .switch_button_wraper{
width: 100%;
@ -231,4 +250,10 @@
box-shadow: 0em 0.1em 0.3em 0em;
margin-bottom: 0.25em;
}
.event{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
}

View File

@ -432,7 +432,10 @@ class EventNewsController < ApplicationController
"read_more" => read_more_url,
"read_more_text" => "read more",
"extra_brefore_html" => extra_html,
"extra_after_html" => extra_after_html
"extra_after_html" => extra_after_html,
"calendar_title" => get_calendar_title,
"widget_title" => subpart.title,
'widget_title_class' => subpart.title.blank? ? 'center' : '',
}
}
end
@ -818,14 +821,16 @@ class EventNewsController < ApplicationController
all_tags = ['all'] if all_tags.length==0
page = Page.where(:page_id=> subpart.read_more_page_id).first rescue nil
page = Page.where(:module => "event_news").first rescue nil if page.nil?
read_more_url = "/#{I18n.locale.to_s + page.url}" rescue ""
read_more_url = read_more_url + "?" + {"category"=>all_cats,"tags"=> all_tags}.to_param if read_more_url != ""
read_more_url_root = "/#{I18n.locale.to_s + page.url}" rescue ""
read_more_url = read_more_url_root + "?" + {"category"=>all_cats,"tags"=> all_tags}.to_param if read_more_url != ""
else
page = Page.where(:module => "event_news").first
read_more_url_root = "/#{I18n.locale.to_s + page.url}" rescue ""
end
if params[:unix_start].present? && params[:unix_end].present?
agenda_start = Time.at(params[:unix_start].to_i).utc.to_s
agenda_end = Time.at(params[:unix_end].to_i).utc.to_s
events = EventNews.agenda_events(agenda_start,agenda_end)
events = EventNews.agenda_events(agenda_start,agenda_end,read_more_url_root)
end
render json: {"events" => events,"calendar_title"=>get_calendar_title(Time.at(params[:month_start].to_i).utc)}.to_json({"frontend" => true})
end

View File

@ -207,20 +207,20 @@ class EventNews
(self.custom_carousel_image_width.blank? ? AnnouncementSetting.last.carousel_image_width : self.custom_carousel_image_width)
end
def self.agenda_events(agenda_start, agenda_end)
events = self.monthly_event(agenda_start, agenda_end).convert_front
def self.agenda_events(agenda_start, agenda_end,read_more_url)
events = self.monthly_event(agenda_start, agenda_end).convert_front(read_more_url)
end
def self.monthly_event(start_date,end_date)
self.any_of({:event_date.lte => start_date,:event_end_date.gte => start_date},{:event_date.gte => start_date,:event_end_date.lte => end_date},{:event_date.lte => end_date,:event_end_date.gte => end_date}).asc(:event_date)
end
def self.convert_front
def self.convert_front(read_more_url)
self.all.collect do |re|
{:id => re.id.to_s,
:title=>re.title,
:note=>re.subtitle || "",
:allDay => false,
:color => nil,
:url_linked => (re.is_external_link? ? re.external_link : OrbitHelper.widget_item_url(re.to_param) rescue ""),
:url_linked => (re.is_external_link? ? re.external_link : "#{read_more_url}/#{re.to_param}" rescue ""),
:start => re.event_date,
:end => re.event_end_date}
end

View File

@ -1,6 +1,7 @@
<div class="w-calendar widget-calendar-2 widget-event-news-calendar-2" data-module="event_news">
<div class="w-calendar-title">
<span>{{widget-title}}</span>
<div class="w-calendar-title {{widget_title_class}}">
<span>{{calendar_title}}</span>
<span>{{widget_title}}</span>
</div>
<div class='month_template'>
<h4 class="widget-title ">
@ -54,27 +55,29 @@
</div>
<%= stylesheet_link_tag "event_news_calendar_widget2" %>
<script>
if(document.getElementById("event-news-calendar-widget_module2") == null){
var tag = document.createElement('script');
tag.setAttribute("id", "event-news-calendar-widget_module2");
tag.src = "/assets/event_news_calendar_widget2.js";
tag.onload = function(){
$("div.widget-calendar-2[data-module=event_news]").each(function(index){
var calendar = $(this),
cmi = new CalendarModuleMonth2(new Date(), calendar,calendar.data("subpart-id"),"{{more_url}}",false);
cmi.currentMonth();
calendar.find("div.w-calendar-nav a").on("click",function(){
var el = $(this);
if(el.hasClass("w-calendar-nav-prev")){
cmi.prevMonth();
}else if(el.hasClass("w-calendar-nav-next")){
cmi.nextMonth();
}
return false;
$(document).ready(function(){
if(document.getElementById("event-news-calendar-widget_module2") == null){
var tag = document.createElement('script');
tag.setAttribute("id", "event-news-calendar-widget_module2");
tag.src = "<%= asset_path('event_news_calendar_widget2.js') %>";
tag.onload = function(){
$("div.widget-calendar-2[data-module=event_news]").each(function(index){
var calendar = $(this),
cmi = new EventCalendarModuleMonth2(new Date(), calendar,calendar.data("subpart-id"),"{{more_url}}",false);
cmi.currentMonth();
calendar.find("div.w-calendar-nav a").on("click",function(){
var el = $(this);
if(el.hasClass("w-calendar-nav-prev")){
cmi.prevMonth();
}else if(el.hasClass("w-calendar-nav-next")){
cmi.nextMonth();
}
return false;
})
})
})
}
var head = document.getElementsByTagName("head");
head[0].appendChild(tag);
}
var head = document.getElementsByTagName("head");
head[0].appendChild(tag);
}
})
</script>