harry
/
calendar
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix some js and style error

This commit is contained in:
chiu 2020-08-13 16:51:04 +08:00
parent c1c7b98638
commit 1105f57bf9
5 changed files with 83 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
app/assets/javascripts/calendar_widget.js
View File

@ -10,6 +10,8 @@
fetchInterval = null,
month = date.getMonth(),
year = date.getFullYear(),
first_target_day = new Date(year,month,1),
last_target_day = new Date(year,month+1,0),
firstDay = new Date(year,month,1),
lastDay = new Date(year,month+1,0),
today = date.getDate(),
@ -40,12 +42,12 @@
}
function lighten_color(my_hex,percent){
if (my_hex[0] == '#'){
my_hex = my_hex.slice(1,-1)
my_hex = my_hex.slice(1)
}
var comp = ''
var rgb = []
var batch_size = Math.ceil(my_hex.length/3)
for (i=0;i<3;i++){
for (var i=0;i<3;i++){
rgb.push(my_hex.slice(batch_size*i,batch_size*(i+1)))
}
$.each(rgb,function(){
@ -55,7 +57,7 @@
if (tmp>255) tmp = 255
if (tmp < 0) tmp = 0
tmp = tmp.toString(16)
for (i=0;i<2-tmp.length;i++){
for (var i=0;i<2-tmp.length;i++){
tmp = '0' + tmp
}
comp = comp + tmp
@ -222,6 +224,7 @@
var first_line_first_date = first_line_first_day.getDate()
var first_line_first_month = first_line_first_day.getMonth()
var first_line_first_year = first_line_first_day.getFullYear()
first_target_day = new Date(first_line_first_year,first_line_first_month,first_line_first_date)
for(var i = 0;i < 7;i++){
var td = $("<td><div></div></td>");
if(i >= firstDay.getDay()){
@ -258,6 +261,7 @@
next_month = 0;
next_year = next_year + 1;
}
last_target_day = new Date(next_year,next_month,6-lastDay.getDay())
for(var i = 0;i < 7;i++){
var td = $("<td><div></div></td>");
if(i <= lastDay.getDay()){
@ -303,10 +307,11 @@
}
var fetchEvents = function(){
var usd = Math.round(firstDay/1000),
ued = Math.round(lastDay/1000);
usd_target = Math.round(first_target_day/1000),
ued_target = Math.round(last_target_day/1000);
$.ajax({
url : "/xhr/calendars/agenda",
data : {"unix_start" : usd, "unix_end" : ued, "subpart_id" : subpartid, "locale" : $('html').attr('lang')},
data : {"month_start" : usd,"unix_start" : usd_target, "unix_end" : ued_target, "subpart_id" : subpartid, "locale" : $('html').attr('lang')},
dataType : "json",
type : "get"
}).done(function(data){
@ -369,9 +374,9 @@
})
var clicked_color = dom.find('.w-calendar-event').css('background-color')
if (clicked_color){
clicked_color = lighten_color(rgb2hex(clicked_color),-20)
clicked_color = lighten_color(rgb2hex(clicked_color),-35)
if (clicked_color!='#000000'){
dom.find('table').append($('<style>.w-calendar-table .w-calendar-toggle{ background-color:'+clicked_color+';color: white;}</style>'))
dom.find('table').append($('<style>.widget-calendar-1 table.w-calendar-table .w-calendar-toggle{ background-color:'+clicked_color+';color: white;}</style>'))
}
}
monthDom.find("i.loading").addClass("hide");
@ -402,14 +407,20 @@
lastDay = new Date(year,month+1,0);
today = (initialDate.getMonth() == month && initialDate.getFullYear() == year ? initialDate.getDate() : 0);
last_inserted_date = 1;
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
var toggle_type,ele;
if (toggle_data && toggle_flag){
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_type = (ele.hasClass('w-calendar-event') ? 'show' : 'hide')
}else{
toggle_data = undefined
}
fetchInterval = setTimeout(fetchEvents,1000);
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
if (ele){
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_event(ele,toggle_type)
}
fetchInterval = setTimeout(fetchEvents,300);
}
nextMonthFunc = this.nextMonth;
this.prevMonth = function(toggle_flag){
@ -424,14 +435,20 @@
lastDay = new Date(year,month+1,0);
today = (initialDate.getMonth() == month && initialDate.getFullYear() == year ? initialDate.getDate() : 0);
last_inserted_date = 1;
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
var toggle_type,ele;
if (toggle_data && toggle_flag){
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_type = (ele.hasClass('w-calendar-event') ? 'show' : 'hide')
}else{
toggle_data = undefined
}
fetchInterval = setTimeout(fetchEvents,1000);
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
if (ele){
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_event(ele,toggle_type)
}
fetchInterval = setTimeout(fetchEvents,300);
}
prevMonthFunc = this.prevMonth;
}

47
app/assets/javascripts/calendar_widget2.js
View File

@ -10,6 +10,8 @@
fetchInterval = null,
month = date.getMonth(),
year = date.getFullYear(),
first_target_day = new Date(year,month,1),
last_target_day = new Date(year,month+1,0),
firstDay = new Date(year,month,1),
lastDay = new Date(year,month+1,0),
today = date.getDate(),
@ -40,12 +42,12 @@
}
function lighten_color(my_hex,percent){
if (my_hex[0] == '#'){
my_hex = my_hex.slice(1,-1)
my_hex = my_hex.slice(1)
}
var comp = ''
var rgb = []
var batch_size = Math.ceil(my_hex.length/3)
for (i=0;i<3;i++){
for (var i=0;i<3;i++){
rgb.push(my_hex.slice(batch_size*i,batch_size*(i+1)))
}
$.each(rgb,function(){
@ -55,7 +57,7 @@
if (tmp>255) tmp = 255
if (tmp < 0) tmp = 0
tmp = tmp.toString(16)
for (i=0;i<2-tmp.length;i++){
for (var i=0;i<2-tmp.length;i++){
tmp = '0' + tmp
}
comp = comp + tmp
@ -222,6 +224,7 @@
var first_line_first_date = first_line_first_day.getDate()
var first_line_first_month = first_line_first_day.getMonth()
var first_line_first_year = first_line_first_day.getFullYear()
first_target_day = new Date(first_line_first_year,first_line_first_month,first_line_first_date)
for(var i = 0;i < 7;i++){
var td = $("<td><div></div></td>");
if(i >= firstDay.getDay()){
@ -258,6 +261,7 @@
next_month = 0;
next_year = next_year + 1;
}
last_target_day = new Date(next_year,next_month,6-lastDay.getDay())
for(var i = 0;i < 7;i++){
var td = $("<td><div></div></td>");
if(i <= lastDay.getDay()){
@ -303,10 +307,11 @@
}
var fetchEvents = function(){
var usd = Math.round(firstDay/1000),
ued = Math.round(lastDay/1000);
usd_target = Math.round(first_target_day/1000),
ued_target = Math.round(last_target_day/1000);
$.ajax({
url : "/xhr/calendars/agenda",
data : {"unix_start" : usd, "unix_end" : ued, "subpart_id" : subpartid, "locale" : $('html').attr('lang')},
data : {"month_start" : usd,"unix_start" : usd_target, "unix_end" : ued_target, "subpart_id" : subpartid, "locale" : $('html').attr('lang')},
dataType : "json",
type : "get"
}).done(function(data){
@ -369,9 +374,9 @@
})
var clicked_color = dom.find('.w-calendar-event').css('background-color')
if (clicked_color){
clicked_color = lighten_color(rgb2hex(clicked_color),-20)
clicked_color = lighten_color(rgb2hex(clicked_color),-35)
if (clicked_color!='#000000'){
dom.find('table').append($('<style>.w-calendar-table .w-calendar-toggle{ background-color:'+clicked_color+';color: white;}</style>'))
dom.find('table').append($('<style>.widget-calendar-2 table.w-calendar-table .w-calendar-toggle{ background-color:'+clicked_color+';color: white;}</style>'))
}
}
monthDom.find("i.loading").addClass("hide");
@ -402,14 +407,20 @@
lastDay = new Date(year,month+1,0);
today = (initialDate.getMonth() == month && initialDate.getFullYear() == year ? initialDate.getDate() : 0);
last_inserted_date = 1;
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
var toggle_type,ele;
if (toggle_data && toggle_flag){
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_type = (ele.hasClass('w-calendar-event') ? 'show' : 'hide')
}else{
toggle_data = undefined
}
fetchInterval = setTimeout(fetchEvents,1000);
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
if (ele){
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_event(ele,toggle_type)
}
fetchInterval = setTimeout(fetchEvents,300);
}
nextMonthFunc = this.nextMonth;
this.prevMonth = function(toggle_flag){
@ -424,14 +435,20 @@
lastDay = new Date(year,month+1,0);
today = (initialDate.getMonth() == month && initialDate.getFullYear() == year ? initialDate.getDate() : 0);
last_inserted_date = 1;
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
var toggle_type,ele;
if (toggle_data && toggle_flag){
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_type = (ele.hasClass('w-calendar-event') ? 'show' : 'hide')
}else{
toggle_data = undefined
}
fetchInterval = setTimeout(fetchEvents,1000);
renderMonth();
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
if (ele){
ele = dom.find('td[data-date-node="'+toggle_data+'"]')
toggle_event(ele,toggle_type)
}
fetchInterval = setTimeout(fetchEvents,300);
}
prevMonthFunc = this.prevMonth;
}

17
app/assets/stylesheets/calendar_widget1.css
View File

@ -96,3 +96,20 @@ a.event-container{
.widget-calendar-1 td{
cursor: pointer;
}
.widget-calendar-1 .w-calendar-table td div {
width: 3em;
height: 3em;
display: inline-flex;
align-items: center;
justify-content: center;
}
.widget-calendar-1 .w-calendar-table td:hover {
background: #eaeaea;
color: black;
}
.widget-calendar-1 .w-calendar-table .w-calendar-event {
background: #444444;
}
.widget-calendar-1 table td.w-calendar-other-month {
color: #999797;
}

2
app/controllers/calendars_controller.rb
View File

@ -66,7 +66,7 @@ class CalendarsController < ApplicationController
events = Event.agenda_events(agenda_start,agenda_end)
end
end
render json: {"events" => events,"calendar_title"=>get_calendar_title(Time.at(params[:unix_start].to_i))}.to_json({"frontend" => true})
render json: {"events" => events,"calendar_title"=>get_calendar_title(Time.at(params[:month_start].to_i))}.to_json({"frontend" => true})
end
end
def get_calendar_title(now_date=nil)

2
app/models/event.rb
View File

@ -155,7 +155,7 @@ class Event
end
when "Weekly"
@start_date = re.start
@end_date = re.end
@edn_date = re.end
@i = TimeDifference.between(re.start.to_date,end_date.to_date).in_weeks.to_i
(1..@i).each do |i|
@start_date += (7*re.frequency.to_i)