auto update calendar template and fix many error
This commit is contained in:
parent
cee8b1f008
commit
c1c7b98638
|
|
@ -79,21 +79,35 @@ var Calendar = function(dom){
|
|||
}
|
||||
|
||||
c.event_create_space.show();
|
||||
var dtpick = $('.datetimepick');
|
||||
var pickers = new Array();
|
||||
var pickers = $('.default_picker input');
|
||||
var checked = ($("#all_day_check").is(":checked") ? true : false);
|
||||
var checked_function = function(c){
|
||||
var d = new Date()
|
||||
if(c){
|
||||
for(i=0;i<pickers.length;i++){
|
||||
var input = pickers[i].find("input");
|
||||
input.val(input.val().split(" ")[0]);
|
||||
pickers.eq(i).ui_datetimepicker("destroy");
|
||||
pickers.eq(i).attr('placeholder','yyyy/MM/dd')
|
||||
var value = pickers.eq(i).val()
|
||||
if (value != ''){
|
||||
pickers.eq(i).val(value.split(" ")[0])
|
||||
}
|
||||
pickers.eq(i).ui_datepicker({dateFormat: 'yy/mm/dd',show_view: ''})
|
||||
}
|
||||
}else{
|
||||
for(i=0;i<pickers.length;i++){
|
||||
var d = new Date();
|
||||
var input = pickers[i].find("input");
|
||||
if(input.val())
|
||||
input.val(input.val() + " " + d.getHours() + ":" + d.getMinutes());
|
||||
pickers.eq(i).ui_datepicker("destroy");
|
||||
pickers.eq(i).attr('placeholder','yyyy/MM/dd HH:mm')
|
||||
var value = pickers.eq(i).val()
|
||||
if (value != ''){
|
||||
pickers.eq(i).val(value + " " + d.getHours() + ":" + d.getMinutes())
|
||||
}
|
||||
pickers.eq(i).ui_datetimepicker({
|
||||
dateFormat: 'yy/mm/dd',
|
||||
controlType: 'select',
|
||||
timeInput: true,
|
||||
oneLine: true,
|
||||
timeFormat: 'HH:mm'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -104,25 +118,13 @@ var Calendar = function(dom){
|
|||
c.event_create_space.find("#event_frequency").removeAttr("disabled");
|
||||
}
|
||||
}
|
||||
dtpick.each(function() {
|
||||
var $data = $(this).data();
|
||||
var options = {
|
||||
format: $data.dateFormat,
|
||||
pickTime: $data.picktime,
|
||||
language: $data.language,
|
||||
place: "top"
|
||||
}
|
||||
pickers.push(
|
||||
$(this).datetimepicker(options)
|
||||
);
|
||||
});
|
||||
$("a.btn-close").one("click",function(){
|
||||
c.event_create_space.html("").hide();
|
||||
$('.bootstrap-datetimepicker-widget').remove();
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#all_day_check").click(function(){
|
||||
$("#all_day_check").change(function(){
|
||||
if($(this).is(":checked")){
|
||||
checked = true;
|
||||
}else{
|
||||
|
|
@ -147,17 +149,7 @@ var Calendar = function(dom){
|
|||
c.event_create_space.find("#event_period").change(function(){
|
||||
//repeat_function();
|
||||
})
|
||||
for(i=0;i<pickers.length;i++){
|
||||
pickers[i].on("changeDate",function(e){
|
||||
if(checked){
|
||||
var input = $(this).find("input");
|
||||
input.val(input.val().split(" ")[0]);
|
||||
}
|
||||
})
|
||||
}
|
||||
//repeat_function();
|
||||
if(allDay)
|
||||
checked_function(checked);
|
||||
}
|
||||
c.success_event = success_event;
|
||||
var dview = (c.currentView == "agenda" ? "month" : c.currentView);
|
||||
|
|
@ -375,7 +367,7 @@ var EventDialog = function(calendar,event){
|
|||
event_quick_view = $('<div class="modal calendar-modal" style="display:none;"></div>');
|
||||
template = '<div class="modal-header">' +
|
||||
'<button type="button" class="close event-close-btn" data-dismiss="modal" aria-hidden="true">×</button>' +
|
||||
'<h3>'+ _event.title +'</h3>' +
|
||||
'<h3>'+ (_event.url_linked=='' ? _event.title : ("<a href=\"" +_event.url_linked+"\">"+_event.title+"</a>")) +'</h3>' +
|
||||
'</div>' +
|
||||
'<div class="modal-body">' +
|
||||
'<div class="event_summary">' +
|
||||
|
|
|
|||
|
|
@ -159,7 +159,7 @@ var EventDialog = function(calendar,event){
|
|||
template = '<div class="modal-content">' +
|
||||
'<div class="modal-header">' +
|
||||
'<button type="button" class="close event-close-btn" data-dismiss="modal" aria-hidden="true">×</button>' +
|
||||
'<h3>' + _event.title + '</h3>' +
|
||||
'<h3>' + (_event.url_linked=='' ? _event.title : ("<a href=\"" +_event.url_linked+"\">"+_event.title+"</a>")) + '</h3>' +
|
||||
'</div>' +
|
||||
'<div class="modal-body">' +
|
||||
'<div class="event_summary">' + time_string + '</div>' +
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
var CalendarModuleMonth = function(date,dom,subpart,url){
|
||||
_this = this;
|
||||
var events = {}
|
||||
var template = dom.find(".month_template"),
|
||||
month_names = ["Jan","Feb","March","April","May","June","July","Aug","Sep","Oct","Nov","Dec"],
|
||||
monthNames = ['January','February','March','April','May','June','July','August','September','October','November','December'],
|
||||
initialDate = date,
|
||||
subpartid = subpart,
|
||||
|
|
@ -12,11 +14,166 @@
|
|||
lastDay = new Date(year,month+1,0),
|
||||
today = date.getDate(),
|
||||
last_inserted_date = 1,
|
||||
monthDom = $("<div data-year='"+year+"' data-month='"+month+"'></div>");
|
||||
monthDom = $("<div data-year='"+year+"' data-month='"+month+"'></div>"),
|
||||
eventHTML = dom.find('div.calendar-events')[0],
|
||||
prevMonthFunc,
|
||||
nextMonthFunc,
|
||||
toggle_data;
|
||||
monthDom.html(template);
|
||||
var format_time = function(date){
|
||||
var hours = date.getHours(),
|
||||
minutes = date.getMinutes();
|
||||
if (hours < 10) {hours = "0"+hours}
|
||||
if (minutes < 10) {minutes = "0"+minutes}
|
||||
return hours+':'+minutes;
|
||||
}
|
||||
function rgb2hex(rgb) {
|
||||
rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
||||
function hex(x) {
|
||||
return ("0" + parseInt(x).toString(16)).slice(-2);
|
||||
}
|
||||
if (rgb){
|
||||
return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
|
||||
}else{
|
||||
return "#000000";
|
||||
}
|
||||
}
|
||||
function lighten_color(my_hex,percent){
|
||||
if (my_hex[0] == '#'){
|
||||
my_hex = my_hex.slice(1,-1)
|
||||
}
|
||||
var comp = ''
|
||||
var rgb = []
|
||||
var batch_size = Math.ceil(my_hex.length/3)
|
||||
for (i=0;i<3;i++){
|
||||
rgb.push(my_hex.slice(batch_size*i,batch_size*(i+1)))
|
||||
}
|
||||
$.each(rgb,function(){
|
||||
var a = this
|
||||
var tmp
|
||||
tmp = Math.ceil(parseInt(a,16)*(1+percent/100))
|
||||
if (tmp>255) tmp = 255
|
||||
if (tmp < 0) tmp = 0
|
||||
tmp = tmp.toString(16)
|
||||
for (i=0;i<2-tmp.length;i++){
|
||||
tmp = '0' + tmp
|
||||
}
|
||||
comp = comp + tmp
|
||||
})
|
||||
return '#'+comp
|
||||
}
|
||||
var format_date = function(date){
|
||||
var y = date.getFullYear(),
|
||||
m = date.getMonth() + 1,
|
||||
d = date.getDate();
|
||||
if (m < 10) {m = "0"+m}
|
||||
if (d < 10) {d = "0"+d}
|
||||
return y+'/'+m+'/'+d;
|
||||
}
|
||||
var formate_datetime = function(date){
|
||||
date = new Date(date)
|
||||
return [format_date(date),format_time(date)]
|
||||
}
|
||||
$(window).resize(function(){
|
||||
var window_w = $(window).width()
|
||||
$('div.calendar-events').each(function(){
|
||||
if ($(this).width()>=728 && window_w>=768){
|
||||
if ($(this).css('width')!='50%'){
|
||||
$(this).css('width','50%')
|
||||
$(this).parents('div[data-module="calendar"]').find('div').eq(0).css('width','50%')
|
||||
}
|
||||
}else{
|
||||
if ($(this).css('width')=='50%'){
|
||||
$(this).css('width','100%')
|
||||
$(this).parents('div[data-module="calendar"]').find('div').eq(0).css('width','100%')
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
var show_event = function(date,ele){
|
||||
var date_split = date.split('-')
|
||||
var event_div = $(ele).parents('div[data-module="calendar"]').find('div.calendar-events')
|
||||
event_div.find('.event-header').text(parseInt(date_split[2])+'/'+(parseInt(date_split[1])+1)+'/'+parseInt(date_split[0]))
|
||||
event_div.find('.event-container').remove()
|
||||
$(ele).parents('.w-calendar').find('td.shown').removeClass('shown')
|
||||
$(ele).addClass('shown')
|
||||
$.each(events[date],function(k,v){
|
||||
var tp
|
||||
if (v.url_linked==''){
|
||||
var time_string = ''
|
||||
if(v.allDay) {
|
||||
var end_time
|
||||
var start_time = formate_datetime(v.start)[0]
|
||||
if(v.end)
|
||||
end_time = formate_datetime(v.end)[0]
|
||||
else
|
||||
end_time = start_time
|
||||
time_string = (start_time==end_time ? "<p class='start-date'><i class='icons-calendar' /> " + start_time + "</p>" : "<i class='icons-calendar' /> " + start_time + " <i class='icons-arrow-right-5' /> " + end_time + "")
|
||||
}else{
|
||||
var st = formate_datetime(v.start),
|
||||
et = formate_datetime(v.end),
|
||||
start_time = st[0],
|
||||
end_time = et[0],
|
||||
same = (start_time==end_time),
|
||||
etime = et[1],
|
||||
stime = st[1]
|
||||
time_string = (same ? "<p class='date'><i class='icons-calendar' /> " + start_time + "</p><p class='time'><i class='icons-clock' /> " + stime + " <i class='icons-arrow-right-5' /> " + etime : "<p class='start-date'><i class='icons-arrow-right-2' /> " + start_time + "<span class='pull-right'>" + stime + "</span></p><p class='end-date'><i class='icons-arrow-left-2' /> " + end_time + "<span class='pull-right'>" + etime + "</p>");
|
||||
}
|
||||
var modal_tp = ('<div class="dialog_event" style="display: none;">' +
|
||||
'<div class="modal-header">' +
|
||||
'<h3>' + v.title + '</h3>' +
|
||||
'</div>' +
|
||||
'<div class="modal-body">' +
|
||||
'<div class="event_summary">' + time_string + '</div>' +
|
||||
v.note +
|
||||
'</div>' +
|
||||
'</div>')
|
||||
tp = $('<div class="event-container" onclick="var tmp=$(this).find(\'.dialog_event\').clone().dialog({dialogClass: \'calendar-dialog\'});$(\'.ui-dialog button\').blur();return false;"><div class="event-icon"><div class="event-bullet-event"></div></div><div class="event-info"></div><div class="model-content"></div>'+modal_tp+'</div>')
|
||||
}else{
|
||||
tp = $('<a class="event-container"><div class="event-icon"><div class="event-bullet-event"></div></div><div class="event-info"></div></a>').attr('href',v.url_linked)
|
||||
}
|
||||
var sd = formate_datetime(v.start),
|
||||
ed = formate_datetime(v.end),
|
||||
duration = '';
|
||||
if(v.allDay){
|
||||
if (sd[0]!=ed[0]){
|
||||
duration = sd[0]+'>'+ed[0] +'<br>'
|
||||
}
|
||||
}else if (sd[0]==ed[0]){
|
||||
duration = sd[1]+'>'+ed[1] +'<br>'
|
||||
}else{
|
||||
duration = sd[0]+' '+sd[1]+'>'+ed[0]+' '+ed[1] +'<br>'
|
||||
}
|
||||
tp.find('.event-info').html(duration+v.title+"<div class=\"event-content\">"+v.note+"</div>")
|
||||
tp.find('.event-bullet-event').css('background',v.color)
|
||||
event_div.find('.event-containers').append(tp)
|
||||
})
|
||||
|
||||
$(ele).parents('div[data-module="calendar"]').css('display','flex')
|
||||
if ($(ele).parents('div[data-module="calendar"]').width()>=728 && $(window).width()>=768){
|
||||
event_div.css('width','50%')
|
||||
$(ele).parents('div[data-module="calendar"]').find('div').eq(0).css('width','50%')
|
||||
}else{
|
||||
event_div.css('width','100%')
|
||||
$(ele).parents('div[data-module="calendar"]').find('div').eq(0).css('width','100%')
|
||||
}
|
||||
event_div.show()
|
||||
$('.close_box').off('click')
|
||||
$('.close_box').on('click',function(){
|
||||
hide_event(this)
|
||||
})
|
||||
}
|
||||
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','')
|
||||
event_div.hide()
|
||||
//$(ele).parents('div[data-module="calendar"]').find('td.w-calendar-toggle').removeClass('w-calendar-toggle')
|
||||
event_div.find('.event-container').remove()
|
||||
}
|
||||
var renderMonth = function(){
|
||||
var num_of_rows = getNumberOfRows(year,month),
|
||||
var num_of_rows = getNumberOfRows(),
|
||||
head_title = monthDom.find("h4 span.text"),
|
||||
table_body = monthDom.find("table.table tbody");
|
||||
table_body.html("");
|
||||
|
|
@ -36,10 +193,9 @@
|
|||
table_body.append(tr);
|
||||
head_title.text(monthNames[firstDay.getMonth()] + " " + firstDay.getFullYear());
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
var getNumberOfRows = function(year, month) {
|
||||
var getNumberOfRows = function() {
|
||||
var day = 1,
|
||||
sat_counter = 0,
|
||||
sunday_counter = 0,
|
||||
|
|
@ -62,41 +218,59 @@
|
|||
var row = $("<tr></tr>");
|
||||
switch (position){
|
||||
case "first":
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td></td>");
|
||||
if(i >= firstDay.getDay()){
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.attr("class","w-calendar-today");
|
||||
}
|
||||
td.text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
}
|
||||
row.append(td);
|
||||
var first_line_first_day = new Date(year,month,firstDay.getDate()-firstDay.getDay())
|
||||
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()
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td><div></div></td>");
|
||||
if(i >= firstDay.getDay()){
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.addClass("w-calendar-today");
|
||||
}
|
||||
td.find('div').text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
}else{
|
||||
td.find('div').text(first_line_first_date+i)
|
||||
td.attr("data-date-node",(first_line_first_date+i)+"-"+first_line_first_month+"-"+first_line_first_year);
|
||||
td.addClass("w-calendar-other-month")
|
||||
}
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
case "middle":
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td></td>");
|
||||
var td = $("<td><div></div></td>");
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.attr("class","w-calendar-today");
|
||||
}
|
||||
td.text(last_inserted_date);
|
||||
td.find('div').text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
case "last":
|
||||
var next_month = month+1,
|
||||
next_year = year;
|
||||
if (next_month==12){
|
||||
next_month = 0;
|
||||
next_year = next_year + 1;
|
||||
}
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td></td>");
|
||||
var td = $("<td><div></div></td>");
|
||||
if(i <= lastDay.getDay()){
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.attr("class","w-calendar-today");
|
||||
}
|
||||
td.text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.attr("class","w-calendar-today");
|
||||
}
|
||||
td.find('div').text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
}else{
|
||||
td.find('div').text(i-lastDay.getDay())
|
||||
td.attr("data-date-node",(i-lastDay.getDay())+"-"+next_month+"-"+next_year);
|
||||
td.addClass("w-calendar-other-month")
|
||||
}
|
||||
row.append(td);
|
||||
}
|
||||
|
|
@ -107,33 +281,60 @@
|
|||
}
|
||||
return row;
|
||||
}
|
||||
|
||||
function toggle_event(ele,type){
|
||||
$(ele).parents('.month_template').find('td').removeClass('w-calendar-toggle')
|
||||
if ($(ele).length==1){
|
||||
$(ele).addClass('w-calendar-toggle')
|
||||
toggle_data = $(ele).data('date-node')
|
||||
}
|
||||
var toggle_month = $(ele).data('date-node').split('-')[1]
|
||||
if (toggle_month==month || $(ele).length!=1){
|
||||
if (type=='show'){
|
||||
show_event($(ele).data('date-node'),ele)
|
||||
}else{
|
||||
hide_event(ele)
|
||||
}
|
||||
}
|
||||
else if(toggle_month==month+1 || toggle_month==0){
|
||||
nextMonthFunc(toggle_data)
|
||||
}else{
|
||||
prevMonthFunc(toggle_data)
|
||||
}
|
||||
}
|
||||
var fetchEvents = function(){
|
||||
var usd = Math.round(firstDay/1000),
|
||||
ued = Math.round(lastDay/1000);
|
||||
$.ajax({
|
||||
url : "/xhr/calendars/agenda",
|
||||
data : {"unix_start" : usd, "unix_end" : ued, "subpart_id" : subpartid},
|
||||
data : {"unix_start" : usd, "unix_end" : ued, "subpart_id" : subpartid, "locale" : $('html').attr('lang')},
|
||||
dataType : "json",
|
||||
type : "get"
|
||||
}).done(function(data){
|
||||
events = {}
|
||||
$(dom).find('.w-calendar-title span').eq(-1).html(data['calendar_title'])
|
||||
$.each(data.events,function(index,eve){
|
||||
var sd = new Date(eve.start),
|
||||
ed = new Date(eve.end),
|
||||
timeDiff = Math.abs(ed.getTime() - sd.getTime()),
|
||||
dayDiff = Math.ceil(timeDiff / (1000 * 3600 * 24));
|
||||
if(eve.allDay){
|
||||
dayDiff = 1 ;
|
||||
sd_date = new Date(formate_datetime(eve.start)[0]),
|
||||
ed_date = new Date(formate_datetime(eve.end)[0]),
|
||||
timeDiff = ed_date.getTime() - sd_date.getTime(),
|
||||
dayDiff = Math.round(timeDiff / (1000 * 3600 * 24));
|
||||
if(eve.allDay && dayDiff < 1){
|
||||
dayDiff = 1
|
||||
}
|
||||
if(dayDiff > 0){
|
||||
var inserting_date = (sd < firstDay ? 1 : sd.getDate());
|
||||
for(i = 0;i <= dayDiff; i++){
|
||||
var inserting_date = sd.getDate();
|
||||
for(var i = 0;i <= dayDiff; i++){
|
||||
var dt = inserting_date + "-" + month + "-" + year,
|
||||
td = dom.find("td[data-date-node=" + dt + "]");
|
||||
if (events[dt]==undefined){
|
||||
events[dt]=[]
|
||||
}
|
||||
events[dt].push(eve)
|
||||
td.addClass("w-calendar-event");
|
||||
if(index_url != ""){
|
||||
td.on("click",function(){
|
||||
window.location.href = "http://" + window.location.host + index_url + '/' + eve.id + '-';
|
||||
if(events[dt].length==1){
|
||||
td.click(function(){
|
||||
toggle_event(this,'show')
|
||||
})
|
||||
}
|
||||
inserting_date++;
|
||||
|
|
@ -144,21 +345,52 @@
|
|||
}else{
|
||||
var dt = sd.getDate() + "-" + sd.getMonth() + "-" + sd.getFullYear();
|
||||
td = dom.find("td[data-date-node=" + dt + "]");
|
||||
if (events[dt]==undefined){
|
||||
events[dt]=[]
|
||||
}
|
||||
events[dt].push(eve)
|
||||
if(events[dt].length==1){
|
||||
td.click(function(){
|
||||
toggle_event(this,'show')
|
||||
})
|
||||
}
|
||||
td.addClass("w-calendar-event");
|
||||
}
|
||||
})
|
||||
if (!toggle_data){
|
||||
if (dom.find('td.w-calendar-today').length != 0){
|
||||
toggle_event(dom.find('td.w-calendar-today'),'show')
|
||||
}else{
|
||||
toggle_event(dom.find('td'),'hide')
|
||||
}
|
||||
}
|
||||
dom.find('td:not(td.w-calendar-event)').click(function(){
|
||||
toggle_event(this,'hide')
|
||||
})
|
||||
var clicked_color = dom.find('.w-calendar-event').css('background-color')
|
||||
if (clicked_color){
|
||||
clicked_color = lighten_color(rgb2hex(clicked_color),-20)
|
||||
if (clicked_color!='#000000'){
|
||||
dom.find('table').append($('<style>.w-calendar-table .w-calendar-toggle{ background-color:'+clicked_color+';color: white;}</style>'))
|
||||
}
|
||||
}
|
||||
monthDom.find("i.loading").addClass("hide");
|
||||
})
|
||||
}
|
||||
|
||||
this.currentMonth = function(){
|
||||
renderMonth();
|
||||
dom.html(monthDom);
|
||||
var div_tag = $('<div></div>')
|
||||
var widge_title = dom.find('.w-calendar-title').eq(0)
|
||||
div_tag.html(monthDom)
|
||||
div_tag.prepend(widge_title)
|
||||
dom.html(div_tag);
|
||||
monthDom.find("i.loading").removeClass("hide");
|
||||
fetchInterval = setTimeout(fetchEvents,300);
|
||||
dom.find('div').eq(0).after(eventHTML)
|
||||
}
|
||||
|
||||
this.nextMonth = function(){
|
||||
this.nextMonth = function(toggle_flag){
|
||||
clearTimeout(fetchInterval);
|
||||
monthDom.find("i.loading").removeClass("hide");
|
||||
month++;
|
||||
|
|
@ -172,10 +404,15 @@
|
|||
last_inserted_date = 1;
|
||||
renderMonth();
|
||||
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
|
||||
if (toggle_data && toggle_flag){
|
||||
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
|
||||
}else{
|
||||
toggle_data = undefined
|
||||
}
|
||||
fetchInterval = setTimeout(fetchEvents,1000);
|
||||
}
|
||||
|
||||
this.prevMonth = function(){
|
||||
nextMonthFunc = this.nextMonth;
|
||||
this.prevMonth = function(toggle_flag){
|
||||
clearTimeout(fetchInterval);
|
||||
monthDom.find("i.loading").removeClass("hide");
|
||||
month--;
|
||||
|
|
@ -189,19 +426,12 @@
|
|||
last_inserted_date = 1;
|
||||
renderMonth();
|
||||
dom.find("table.w-calendar-table tbody").html(monthDom.find("tbody").html());
|
||||
if (toggle_data && toggle_flag){
|
||||
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
|
||||
}else{
|
||||
toggle_data = undefined
|
||||
}
|
||||
fetchInterval = setTimeout(fetchEvents,1000);
|
||||
|
||||
}
|
||||
prevMonthFunc = this.prevMonth;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,437 @@
|
|||
var CalendarModuleMonth = function(date,dom,subpart,url){
|
||||
_this = this;
|
||||
var events = {}
|
||||
var template = dom.find(".month_template"),
|
||||
month_names = ["Jan","Feb","March","April","May","June","July","Aug","Sep","Oct","Nov","Dec"],
|
||||
monthNames = ['January','February','March','April','May','June','July','August','September','October','November','December'],
|
||||
initialDate = date,
|
||||
subpartid = subpart,
|
||||
index_url = url,
|
||||
fetchInterval = null,
|
||||
month = date.getMonth(),
|
||||
year = date.getFullYear(),
|
||||
firstDay = new Date(year,month,1),
|
||||
lastDay = new Date(year,month+1,0),
|
||||
today = date.getDate(),
|
||||
last_inserted_date = 1,
|
||||
monthDom = $("<div data-year='"+year+"' data-month='"+month+"'></div>"),
|
||||
eventHTML = dom.find('div.calendar-events')[0],
|
||||
prevMonthFunc,
|
||||
nextMonthFunc,
|
||||
toggle_data;
|
||||
monthDom.html(template);
|
||||
var format_time = function(date){
|
||||
var hours = date.getHours(),
|
||||
minutes = date.getMinutes();
|
||||
if (hours < 10) {hours = "0"+hours}
|
||||
if (minutes < 10) {minutes = "0"+minutes}
|
||||
return hours+':'+minutes;
|
||||
}
|
||||
function rgb2hex(rgb) {
|
||||
rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
||||
function hex(x) {
|
||||
return ("0" + parseInt(x).toString(16)).slice(-2);
|
||||
}
|
||||
if (rgb){
|
||||
return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
|
||||
}else{
|
||||
return "#000000";
|
||||
}
|
||||
}
|
||||
function lighten_color(my_hex,percent){
|
||||
if (my_hex[0] == '#'){
|
||||
my_hex = my_hex.slice(1,-1)
|
||||
}
|
||||
var comp = ''
|
||||
var rgb = []
|
||||
var batch_size = Math.ceil(my_hex.length/3)
|
||||
for (i=0;i<3;i++){
|
||||
rgb.push(my_hex.slice(batch_size*i,batch_size*(i+1)))
|
||||
}
|
||||
$.each(rgb,function(){
|
||||
var a = this
|
||||
var tmp
|
||||
tmp = Math.ceil(parseInt(a,16)*(1+percent/100))
|
||||
if (tmp>255) tmp = 255
|
||||
if (tmp < 0) tmp = 0
|
||||
tmp = tmp.toString(16)
|
||||
for (i=0;i<2-tmp.length;i++){
|
||||
tmp = '0' + tmp
|
||||
}
|
||||
comp = comp + tmp
|
||||
})
|
||||
return '#'+comp
|
||||
}
|
||||
var format_date = function(date){
|
||||
var y = date.getFullYear(),
|
||||
m = date.getMonth() + 1,
|
||||
d = date.getDate();
|
||||
if (m < 10) {m = "0"+m}
|
||||
if (d < 10) {d = "0"+d}
|
||||
return y+'/'+m+'/'+d;
|
||||
}
|
||||
var formate_datetime = function(date){
|
||||
date = new Date(date)
|
||||
return [format_date(date),format_time(date)]
|
||||
}
|
||||
$(window).resize(function(){
|
||||
var window_w = $(window).width()
|
||||
$('div.calendar-events').each(function(){
|
||||
if ($(this).width()>=728 && window_w>=768){
|
||||
if ($(this).css('width')!='50%'){
|
||||
$(this).css('width','50%')
|
||||
$(this).parents('div[data-module="calendar"]').find('div').eq(0).css('width','50%')
|
||||
}
|
||||
}else{
|
||||
if ($(this).css('width')=='50%'){
|
||||
$(this).css('width','100%')
|
||||
$(this).parents('div[data-module="calendar"]').find('div').eq(0).css('width','100%')
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
var show_event = function(date,ele){
|
||||
var date_split = date.split('-')
|
||||
var event_div = $(ele).parents('div[data-module="calendar"]').find('div.calendar-events')
|
||||
event_div.find('.event-header').text(parseInt(date_split[2])+'/'+(parseInt(date_split[1])+1)+'/'+parseInt(date_split[0]))
|
||||
event_div.find('.event-container').remove()
|
||||
$(ele).parents('.w-calendar').find('td.shown').removeClass('shown')
|
||||
$(ele).addClass('shown')
|
||||
$.each(events[date],function(k,v){
|
||||
var tp
|
||||
if (v.url_linked==''){
|
||||
var time_string = ''
|
||||
if(v.allDay) {
|
||||
var end_time
|
||||
var start_time = formate_datetime(v.start)[0]
|
||||
if(v.end)
|
||||
end_time = formate_datetime(v.end)[0]
|
||||
else
|
||||
end_time = start_time
|
||||
time_string = (start_time==end_time ? "<p class='start-date'><i class='icons-calendar' /> " + start_time + "</p>" : "<i class='icons-calendar' /> " + start_time + " <i class='icons-arrow-right-5' /> " + end_time + "")
|
||||
}else{
|
||||
var st = formate_datetime(v.start),
|
||||
et = formate_datetime(v.end),
|
||||
start_time = st[0],
|
||||
end_time = et[0],
|
||||
same = (start_time==end_time),
|
||||
etime = et[1],
|
||||
stime = st[1]
|
||||
time_string = (same ? "<p class='date'><i class='icons-calendar' /> " + start_time + "</p><p class='time'><i class='icons-clock' /> " + stime + " <i class='icons-arrow-right-5' /> " + etime : "<p class='start-date'><i class='icons-arrow-right-2' /> " + start_time + "<span class='pull-right'>" + stime + "</span></p><p class='end-date'><i class='icons-arrow-left-2' /> " + end_time + "<span class='pull-right'>" + etime + "</p>");
|
||||
}
|
||||
var modal_tp = ('<div class="dialog_event" style="display: none;">' +
|
||||
'<div class="modal-header">' +
|
||||
'<h3>' + v.title + '</h3>' +
|
||||
'</div>' +
|
||||
'<div class="modal-body">' +
|
||||
'<div class="event_summary">' + time_string + '</div>' +
|
||||
v.note +
|
||||
'</div>' +
|
||||
'</div>')
|
||||
tp = $('<div class="event-container" onclick="var tmp=$(this).find(\'.dialog_event\').clone().dialog({dialogClass: \'calendar-dialog\'});$(\'.ui-dialog button\').blur();return false;"><div class="event-icon"><div class="event-bullet-event"></div></div><div class="event-info"></div><div class="model-content"></div>'+modal_tp+'</div>')
|
||||
}else{
|
||||
tp = $('<a class="event-container"><div class="event-icon"><div class="event-bullet-event"></div></div><div class="event-info"></div></a>').attr('href',v.url_linked)
|
||||
}
|
||||
var sd = formate_datetime(v.start),
|
||||
ed = formate_datetime(v.end),
|
||||
duration = '';
|
||||
if(v.allDay){
|
||||
if (sd[0]!=ed[0]){
|
||||
duration = sd[0]+'>'+ed[0] +'<br>'
|
||||
}
|
||||
}else if (sd[0]==ed[0]){
|
||||
duration = sd[1]+'>'+ed[1] +'<br>'
|
||||
}else{
|
||||
duration = sd[0]+' '+sd[1]+'>'+ed[0]+' '+ed[1] +'<br>'
|
||||
}
|
||||
tp.find('.event-info').html(duration+v.title+"<div class=\"event-content\">"+v.note+"</div>")
|
||||
tp.find('.event-bullet-event').css('background',v.color)
|
||||
event_div.find('.event-containers').append(tp)
|
||||
})
|
||||
|
||||
$(ele).parents('div[data-module="calendar"]').css('display','flex')
|
||||
if ($(ele).parents('div[data-module="calendar"]').width()>=728 && $(window).width()>=768){
|
||||
event_div.css('width','50%')
|
||||
$(ele).parents('div[data-module="calendar"]').find('div').eq(0).css('width','50%')
|
||||
}else{
|
||||
event_div.css('width','100%')
|
||||
$(ele).parents('div[data-module="calendar"]').find('div').eq(0).css('width','100%')
|
||||
}
|
||||
event_div.show()
|
||||
$('.close_box').off('click')
|
||||
$('.close_box').on('click',function(){
|
||||
hide_event(this)
|
||||
})
|
||||
}
|
||||
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','')
|
||||
event_div.hide()
|
||||
//$(ele).parents('div[data-module="calendar"]').find('td.w-calendar-toggle').removeClass('w-calendar-toggle')
|
||||
event_div.find('.event-container').remove()
|
||||
}
|
||||
var renderMonth = function(){
|
||||
var num_of_rows = getNumberOfRows(),
|
||||
head_title = monthDom.find("h4 span.text"),
|
||||
table_body = monthDom.find("table.table tbody");
|
||||
table_body.html("");
|
||||
|
||||
for(var i = 0; i < num_of_rows; i++){
|
||||
var tr = null;
|
||||
if(i == 0){
|
||||
tr = makeRow("first");
|
||||
}else if(i == (num_of_rows - 1)){
|
||||
tr = makeRow("last");
|
||||
}else{
|
||||
tr = makeRow("middle");
|
||||
}
|
||||
if(tr == null){
|
||||
break;
|
||||
}
|
||||
table_body.append(tr);
|
||||
head_title.text(monthNames[firstDay.getMonth()] + " " + firstDay.getFullYear());
|
||||
}
|
||||
}
|
||||
|
||||
var getNumberOfRows = function() {
|
||||
var day = 1,
|
||||
sat_counter = 0,
|
||||
sunday_counter = 0,
|
||||
date = new Date(year, month, day);
|
||||
|
||||
while(date.getMonth() === month) {
|
||||
if(date.getDay() === 0) {
|
||||
sunday_counter++;
|
||||
}else if(date.getDay() === 6) {
|
||||
sat_counter++;
|
||||
}
|
||||
day++;
|
||||
date = new Date(year, month, day);
|
||||
}
|
||||
return (sunday_counter == 5 && sat_counter == 5 ? 6 : 5);
|
||||
}
|
||||
|
||||
var makeRow = function(position){
|
||||
if(last_inserted_date <= lastDay.getDate()){
|
||||
var row = $("<tr></tr>");
|
||||
switch (position){
|
||||
case "first":
|
||||
var first_line_first_day = new Date(year,month,firstDay.getDate()-firstDay.getDay())
|
||||
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()
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td><div></div></td>");
|
||||
if(i >= firstDay.getDay()){
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.addClass("w-calendar-today");
|
||||
}
|
||||
td.find('div').text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
}else{
|
||||
td.find('div').text(first_line_first_date+i)
|
||||
td.attr("data-date-node",(first_line_first_date+i)+"-"+first_line_first_month+"-"+first_line_first_year);
|
||||
td.addClass("w-calendar-other-month")
|
||||
}
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
case "middle":
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td><div></div></td>");
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.attr("class","w-calendar-today");
|
||||
}
|
||||
td.find('div').text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
case "last":
|
||||
var next_month = month+1,
|
||||
next_year = year;
|
||||
if (next_month==12){
|
||||
next_month = 0;
|
||||
next_year = next_year + 1;
|
||||
}
|
||||
for(var i = 0;i < 7;i++){
|
||||
var td = $("<td><div></div></td>");
|
||||
if(i <= lastDay.getDay()){
|
||||
if(today != 0 && last_inserted_date == today){
|
||||
td.attr("class","w-calendar-today");
|
||||
}
|
||||
td.find('div').text(last_inserted_date);
|
||||
td.attr("data-date-node",last_inserted_date+"-"+firstDay.getMonth()+"-"+firstDay.getFullYear());
|
||||
last_inserted_date++;
|
||||
}else{
|
||||
td.find('div').text(i-lastDay.getDay())
|
||||
td.attr("data-date-node",(i-lastDay.getDay())+"-"+next_month+"-"+next_year);
|
||||
td.addClass("w-calendar-other-month")
|
||||
}
|
||||
row.append(td);
|
||||
}
|
||||
break;
|
||||
}
|
||||
}else{
|
||||
var row = null;
|
||||
}
|
||||
return row;
|
||||
}
|
||||
function toggle_event(ele,type){
|
||||
$(ele).parents('.month_template').find('td').removeClass('w-calendar-toggle')
|
||||
if ($(ele).length==1){
|
||||
$(ele).addClass('w-calendar-toggle')
|
||||
toggle_data = $(ele).data('date-node')
|
||||
}
|
||||
var toggle_month = $(ele).data('date-node').split('-')[1]
|
||||
if (toggle_month==month || $(ele).length!=1){
|
||||
if (type=='show'){
|
||||
show_event($(ele).data('date-node'),ele)
|
||||
}else{
|
||||
hide_event(ele)
|
||||
}
|
||||
}
|
||||
else if(toggle_month==month+1 || toggle_month==0){
|
||||
nextMonthFunc(toggle_data)
|
||||
}else{
|
||||
prevMonthFunc(toggle_data)
|
||||
}
|
||||
}
|
||||
var fetchEvents = function(){
|
||||
var usd = Math.round(firstDay/1000),
|
||||
ued = Math.round(lastDay/1000);
|
||||
$.ajax({
|
||||
url : "/xhr/calendars/agenda",
|
||||
data : {"unix_start" : usd, "unix_end" : ued, "subpart_id" : subpartid, "locale" : $('html').attr('lang')},
|
||||
dataType : "json",
|
||||
type : "get"
|
||||
}).done(function(data){
|
||||
events = {}
|
||||
$(dom).find('.w-calendar-title span').eq(-1).html(data['calendar_title'])
|
||||
$.each(data.events,function(index,eve){
|
||||
var sd = new Date(eve.start),
|
||||
ed = new Date(eve.end),
|
||||
sd_date = new Date(formate_datetime(eve.start)[0]),
|
||||
ed_date = new Date(formate_datetime(eve.end)[0]),
|
||||
timeDiff = ed_date.getTime() - sd_date.getTime(),
|
||||
dayDiff = Math.round(timeDiff / (1000 * 3600 * 24));
|
||||
if(eve.allDay && dayDiff < 1){
|
||||
dayDiff = 1
|
||||
}
|
||||
if(dayDiff > 0){
|
||||
var inserting_date = sd.getDate();
|
||||
for(var i = 0;i <= dayDiff; i++){
|
||||
var dt = inserting_date + "-" + month + "-" + year,
|
||||
td = dom.find("td[data-date-node=" + dt + "]");
|
||||
if (events[dt]==undefined){
|
||||
events[dt]=[]
|
||||
}
|
||||
events[dt].push(eve)
|
||||
td.addClass("w-calendar-event");
|
||||
if(events[dt].length==1){
|
||||
td.click(function(){
|
||||
toggle_event(this,'show')
|
||||
})
|
||||
}
|
||||
inserting_date++;
|
||||
if(inserting_date > lastDay.getDate() || (ed.getMonth() == month && inserting_date > ed.getDate())){
|
||||
break;
|
||||
}
|
||||
}
|
||||
}else{
|
||||
var dt = sd.getDate() + "-" + sd.getMonth() + "-" + sd.getFullYear();
|
||||
td = dom.find("td[data-date-node=" + dt + "]");
|
||||
if (events[dt]==undefined){
|
||||
events[dt]=[]
|
||||
}
|
||||
events[dt].push(eve)
|
||||
if(events[dt].length==1){
|
||||
td.click(function(){
|
||||
toggle_event(this,'show')
|
||||
})
|
||||
}
|
||||
td.addClass("w-calendar-event");
|
||||
}
|
||||
})
|
||||
if (!toggle_data){
|
||||
if (dom.find('td.w-calendar-today').length != 0){
|
||||
toggle_event(dom.find('td.w-calendar-today'),'show')
|
||||
}else{
|
||||
toggle_event(dom.find('td'),'hide')
|
||||
}
|
||||
}
|
||||
dom.find('td:not(td.w-calendar-event)').click(function(){
|
||||
toggle_event(this,'hide')
|
||||
})
|
||||
var clicked_color = dom.find('.w-calendar-event').css('background-color')
|
||||
if (clicked_color){
|
||||
clicked_color = lighten_color(rgb2hex(clicked_color),-20)
|
||||
if (clicked_color!='#000000'){
|
||||
dom.find('table').append($('<style>.w-calendar-table .w-calendar-toggle{ background-color:'+clicked_color+';color: white;}</style>'))
|
||||
}
|
||||
}
|
||||
monthDom.find("i.loading").addClass("hide");
|
||||
})
|
||||
}
|
||||
|
||||
this.currentMonth = function(){
|
||||
renderMonth();
|
||||
var div_tag = $('<div></div>')
|
||||
var widge_title = dom.find('.w-calendar-title').eq(0)
|
||||
div_tag.html(monthDom)
|
||||
div_tag.prepend(widge_title)
|
||||
dom.html(div_tag);
|
||||
monthDom.find("i.loading").removeClass("hide");
|
||||
fetchInterval = setTimeout(fetchEvents,300);
|
||||
dom.find('div').eq(0).after(eventHTML)
|
||||
}
|
||||
|
||||
this.nextMonth = function(toggle_flag){
|
||||
clearTimeout(fetchInterval);
|
||||
monthDom.find("i.loading").removeClass("hide");
|
||||
month++;
|
||||
if(month == 12){
|
||||
year++;
|
||||
month = 0;
|
||||
}
|
||||
firstDay = new Date(year,month,1);
|
||||
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());
|
||||
if (toggle_data && toggle_flag){
|
||||
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
|
||||
}else{
|
||||
toggle_data = undefined
|
||||
}
|
||||
fetchInterval = setTimeout(fetchEvents,1000);
|
||||
}
|
||||
nextMonthFunc = this.nextMonth;
|
||||
this.prevMonth = function(toggle_flag){
|
||||
clearTimeout(fetchInterval);
|
||||
monthDom.find("i.loading").removeClass("hide");
|
||||
month--;
|
||||
if(month == -1){
|
||||
year--;
|
||||
month = 11;
|
||||
}
|
||||
firstDay = new Date(year,month,1);
|
||||
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());
|
||||
if (toggle_data && toggle_flag){
|
||||
toggle_event(dom.find('td[data-date-node="'+toggle_data+'"]'),'show')
|
||||
}else{
|
||||
toggle_data = undefined
|
||||
}
|
||||
fetchInterval = setTimeout(fetchEvents,1000);
|
||||
}
|
||||
prevMonthFunc = this.prevMonth;
|
||||
}
|
||||
|
|
@ -1176,7 +1176,9 @@ function EventManager(options, _sources) {
|
|||
|
||||
/* Event Normalization
|
||||
-----------------------------------------------------------------------------*/
|
||||
|
||||
function addMinutes(date, minutes) {
|
||||
return new Date(date.getTime() + minutes*60000);
|
||||
}
|
||||
|
||||
function normalizeEvent(event) {
|
||||
var source = event.source || {};
|
||||
|
|
@ -1191,7 +1193,7 @@ function EventManager(options, _sources) {
|
|||
event._start = cloneDate(event.start = parseDate(event.start, ignoreTimezone));
|
||||
event.end = parseDate(event.end, ignoreTimezone);
|
||||
if (event.end && event.end < event.start) {
|
||||
event.end = event.start;
|
||||
event.end = addMinutes(event.start,1);
|
||||
}
|
||||
event._end = event.end ? cloneDate(event.end) : null;
|
||||
if (event.allDay === undefined) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,98 @@
|
|||
a.event-container{
|
||||
color: inherit;
|
||||
}
|
||||
.event-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 1em;
|
||||
transition: all .3s ease;
|
||||
cursor: pointer;
|
||||
padding: 0.5em;
|
||||
min-height: 3em;
|
||||
position: relative;
|
||||
}
|
||||
.close_box{
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
float: right;
|
||||
padding: 0.5em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.close_box:hover{
|
||||
color: red;
|
||||
}
|
||||
.event-bullet-event {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.event-bullet-event {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 1em;
|
||||
}
|
||||
.event-container:hover {
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0.1em 0.7em -0.25em rgba(0, 0, 0, 0.65);
|
||||
}
|
||||
.event-container > .event-icon {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 15%;
|
||||
height: 100%;
|
||||
z-index: 5;
|
||||
}
|
||||
.event-container > .event-icon::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 1em;
|
||||
left: 50%;
|
||||
width: 0.1em;
|
||||
height: calc(100% + 1.5em);
|
||||
background-color: #eaeaea;
|
||||
z-index: -1;
|
||||
}
|
||||
.event-container:first-child > .event-icon::before {
|
||||
top: 1.5em;
|
||||
position: absolute;
|
||||
}
|
||||
.event-container:last-child > .event-icon::before {
|
||||
height: 0;
|
||||
}
|
||||
.event-container:only-child > .event-icon::before {
|
||||
background-color: unset;
|
||||
}
|
||||
.event-header{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 1.7em;
|
||||
font-weight: bold;
|
||||
padding: 0.35em 0;
|
||||
}
|
||||
.event-info{
|
||||
padding-left: 15%;
|
||||
}
|
||||
.calendar-events{
|
||||
position: relative;
|
||||
background: #fbfbfb;
|
||||
}
|
||||
.month_template{
|
||||
position: relative;
|
||||
}
|
||||
.w-calendar.widget-calendar-1{
|
||||
flex-wrap: wrap;
|
||||
margin-top: 2em;
|
||||
}
|
||||
.widget-calendar-1 .w-calendar-nav a {
|
||||
top: 2em;
|
||||
}
|
||||
.calendar-dialog div.ui-dialog-content {
|
||||
max-height: 20em !important;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
.widget-calendar-1 td{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -0,0 +1,145 @@
|
|||
a.event-container{
|
||||
color: inherit;
|
||||
}
|
||||
.event-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 1em;
|
||||
transition: all .3s ease;
|
||||
cursor: pointer;
|
||||
padding: 0.5em;
|
||||
min-height: 3em;
|
||||
position: relative;
|
||||
}
|
||||
.close_box{
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
float: right;
|
||||
padding: 0.5em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.close_box:hover{
|
||||
color: red;
|
||||
}
|
||||
.event-bullet-event {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.event-bullet-event {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 1em;
|
||||
}
|
||||
.event-container:hover {
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0.1em 0.7em -0.25em rgba(0, 0, 0, 0.65);
|
||||
}
|
||||
.event-container > .event-icon {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 15%;
|
||||
height: 100%;
|
||||
z-index: 5;
|
||||
}
|
||||
.event-container > .event-icon::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 1em;
|
||||
left: 50%;
|
||||
width: 0.1em;
|
||||
height: calc(100% + 1.5em);
|
||||
background-color: #eaeaea;
|
||||
z-index: -1;
|
||||
}
|
||||
.event-container:first-child > .event-icon::before {
|
||||
top: 1.5em;
|
||||
position: absolute;
|
||||
}
|
||||
.event-container:last-child > .event-icon::before {
|
||||
height: 0;
|
||||
}
|
||||
.event-container:only-child > .event-icon::before {
|
||||
background-color: unset;
|
||||
}
|
||||
.event-header{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 1.7em;
|
||||
font-weight: bold;
|
||||
padding: 0.35em 0;
|
||||
}
|
||||
.event-info{
|
||||
padding-left: 15%;
|
||||
}
|
||||
.calendar-events{
|
||||
position: relative;
|
||||
background: #fbfbfb;
|
||||
}
|
||||
.month_template{
|
||||
position: relative;
|
||||
}
|
||||
.w-calendar.widget-calendar-2{
|
||||
flex-wrap: wrap;
|
||||
margin-top: 2em;
|
||||
}
|
||||
.widget-calendar-2 .w-calendar-table td:hover {
|
||||
background-color: #eaeaea;
|
||||
color: #333;
|
||||
}
|
||||
.widget-calendar-2 .w-calendar-table td {
|
||||
background: inherit;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
border: 0;
|
||||
}
|
||||
.widget-calendar-2 .w-calendar-table td div{
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: auto;
|
||||
width: 3em;
|
||||
height: 3em;
|
||||
}
|
||||
.widget-calendar-2 .w-calendar-table th {
|
||||
background: unset;
|
||||
color: unset;
|
||||
border: 0;
|
||||
width: 3em;
|
||||
height: 3em;
|
||||
}
|
||||
.widget-calendar-2.w-calendar .widget-title {
|
||||
padding: 0.2em;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.widget-calendar-2 table.w-calendar-table td.w-calendar-toggle div {
|
||||
background: #6f0007;
|
||||
border-radius: 1.5em;
|
||||
color: white;
|
||||
}
|
||||
.widget-calendar-2 .w-calendar-table td.w-calendar-event div{
|
||||
border: 1px #6f0007 solid;
|
||||
background: #eee;
|
||||
border-radius: 1.5em;
|
||||
}
|
||||
.widget-calendar-2 .w-calendar-title{
|
||||
background: rgb(146, 8, 17);
|
||||
color: rgb(255, 255, 255);
|
||||
padding: 0px 10%;
|
||||
display: flex;
|
||||
flex-flow: row-reverse wrap;
|
||||
line-height: 2em;
|
||||
justify-content: space-between;
|
||||
font-size: 1.85em;
|
||||
width: 100%;
|
||||
}
|
||||
.calendar-dialog div.ui-dialog-content {
|
||||
max-height: 20em !important;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
.widget-calendar-2 table td.w-calendar-other-month {
|
||||
color: #999797;
|
||||
}
|
||||
|
|
@ -14,7 +14,7 @@ class Admin::CalendarsController < OrbitAdminController
|
|||
sdt = Time.at(params[:start].to_i)
|
||||
edt = Time.at(params[:end].to_i)
|
||||
@monthly_events = Event.monthly_event(sdt,edt).with_categories(filters("category"))
|
||||
.with_tags(filters("tag"))
|
||||
.with_tags(filters("tag")).convert_front
|
||||
@re = Event.with_categories(filters("category")).with_tags(filters("tag")).recurring_event(sdt,edt)
|
||||
allevents = @monthly_events.inject(@re, :<<)
|
||||
events = allevents.to_json
|
||||
|
|
|
|||
|
|
@ -22,11 +22,12 @@ class CalendarsController < ApplicationController
|
|||
|
||||
def widget
|
||||
part = OrbitHelper.get_current_widget
|
||||
|
||||
{
|
||||
"extras" => {
|
||||
"subpart-id" => part.id.to_s,
|
||||
"more_url" => OrbitHelper.widget_more_url
|
||||
"more_url" => OrbitHelper.widget_more_url,
|
||||
'widget_title' => part.title,
|
||||
'calendar_title' => get_calendar_title
|
||||
}
|
||||
}
|
||||
end
|
||||
|
|
@ -38,7 +39,7 @@ class CalendarsController < ApplicationController
|
|||
if params[:start].present? && params[:end].present?
|
||||
sdt = Time.at(params[:start].to_i)
|
||||
edt = Time.at(params[:end].to_i)
|
||||
events = Event.monthly_event(sdt,edt)+Event.recurring_event(sdt,edt)
|
||||
events = Event.monthly_event(sdt,edt).convert_front+Event.recurring_event(sdt,edt)
|
||||
end
|
||||
end
|
||||
respond_to do |format|
|
||||
|
|
@ -48,23 +49,30 @@ class CalendarsController < ApplicationController
|
|||
end
|
||||
|
||||
def agenda
|
||||
if !params[:subpart_id].nil?
|
||||
subpartid = params[:subpart_id]
|
||||
widget = SubPart.find(subpartid)
|
||||
calendar_types = widget.custom_array_field
|
||||
else
|
||||
calendar_types = []
|
||||
end
|
||||
if params[:unix_start].present? && params[:unix_end].present?
|
||||
agenda_start = Time.at(params[:unix_start].to_i).to_s
|
||||
agenda_end = Time.at(params[:unix_end].to_i).to_s
|
||||
if !calendar_types.blank?
|
||||
events = Event.where(:calendar_type_id.in => calendar_types).agenda_events(agenda_start,agenda_end)
|
||||
I18n.with_locale(params[:locale]||I18n.locale) do
|
||||
if !params[:subpart_id].nil?
|
||||
subpartid = params[:subpart_id]
|
||||
widget = SubPart.find(subpartid)
|
||||
calendar_types = widget.custom_array_field
|
||||
else
|
||||
events = Event.agenda_events(agenda_start,agenda_end)
|
||||
calendar_types = []
|
||||
end
|
||||
if params[:unix_start].present? && params[:unix_end].present?
|
||||
agenda_start = Time.at(params[:unix_start].to_i).to_s
|
||||
agenda_end = Time.at(params[:unix_end].to_i).to_s
|
||||
if !calendar_types.blank?
|
||||
events = Event.where(:calendar_type_id.in => calendar_types).agenda_events(agenda_start,agenda_end)
|
||||
else
|
||||
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})
|
||||
end
|
||||
render json: {"events" => events}.to_json({"frontend" => true})
|
||||
end
|
||||
def get_calendar_title(now_date=nil)
|
||||
now_date = Time.now if now_date.nil?
|
||||
month_name = I18n.locale.to_s=='zh_tw' ? now_date.month : I18n.t("calendar.month_name.#{now_date.month}")
|
||||
I18n.t("calendar.calendar_title",year: now_date.year,month: month_name)
|
||||
end
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -19,8 +19,19 @@ class Event
|
|||
field :period
|
||||
field :create_user_id
|
||||
field :update_user_id
|
||||
field :bulletin_id
|
||||
field :module_key
|
||||
field :model_cat
|
||||
field :model_page_id
|
||||
field :model_tags,type: Array,default: []
|
||||
belongs_to :calendar_type
|
||||
field :url
|
||||
def get_module_url
|
||||
page = !self.model_page_id.blank? ? Page.find(self.model_page_id): Page.where(:module => self.module_key).where(:categories.in => Array(self.model_cat)+[[]],:tags.in=>Array(self.model_tags)+[[]]).first
|
||||
page.nil? ? '' : (page.url+'/'+eval(self.model_class).where(:id=>self.model_id).first.to_param)
|
||||
end
|
||||
def url_to_fronted
|
||||
self.url.blank? ? (self.model_class.blank? ? '' : self.get_module_url) : self.url
|
||||
end
|
||||
attr_accessor :agenda_start, :agenda_end, :get_agenda_events
|
||||
|
||||
#let other model can connect to this model
|
||||
|
|
@ -110,7 +121,14 @@ class Event
|
|||
end
|
||||
|
||||
def self.monthly_event(start_date,end_date)
|
||||
self.any_of(:start.gte => start_date, :end.gte => start_date).and(:start.lte => end_date).asc(:start)
|
||||
self.any_of({:start.lte => start_date,:end.gte => start_date},{:start.gte => start_date,:end.lte => end_date},{:start.lte => end_date,:end.gte => end_date}).asc(:start)
|
||||
end
|
||||
def self.convert_front
|
||||
self.all.collect do |re|
|
||||
edit_url = Rails.application.routes.url_helpers.edit_admin_calendar_path(:locale=>I18n.locale, :id=>re.id)
|
||||
delete_url = Rails.application.routes.url_helpers.admin_calendar_path(:locale=>I18n.locale, :id=>re.id)
|
||||
{:id => re.id.to_s, :title=>re.title, :note=>re.note || "", :allDay => re.all_day, :recurring => re.recurring, :calendar => re.calendar_type.id.to_s, :color => re.calendar_type.color, :edit_url => edit_url, :delete_url => delete_url, :url_linked => re.url_to_fronted, :start => re.start, :end => re.end}
|
||||
end
|
||||
end
|
||||
def self.get_diff_month(date1,date2)
|
||||
(date2.year-date1.year)*12+(date2.month-date1.month)
|
||||
|
|
@ -121,12 +139,14 @@ class Event
|
|||
@recurring_events.each do |re|
|
||||
edit_url = Rails.application.routes.url_helpers.edit_admin_calendar_path(:locale=>I18n.locale, :id=>re.id)
|
||||
delete_url = Rails.application.routes.url_helpers.admin_calendar_path(:locale=>I18n.locale, :id=>re.id)
|
||||
data = {:id => re.id.to_s, :title=>re.title, :note=>re.note, :allDay => re.all_day, :recurring => re.recurring, :calendar => re.calendar_type.id.to_s, :color => re.calendar_type.color, :edit_url => edit_url, :delete_url => delete_url}
|
||||
data = {:id => re.id.to_s, :title=>re.title, :note=>re.note || "", :allDay => re.all_day, :recurring => re.recurring, :calendar => re.calendar_type.id.to_s, :color => re.calendar_type.color, :edit_url => edit_url, :delete_url => delete_url, :url_linked => re.url_to_fronted}
|
||||
case re.period
|
||||
when 'Daily'
|
||||
days = (end_date.to_date-re.start.to_date)
|
||||
days = (end_date.to_date-re.start.to_date).to_i
|
||||
freq = re.frequency.to_i
|
||||
(1..days).each do |i|
|
||||
start_key = (start_date.to_date-re.start.to_date).to_i
|
||||
start_key = 1 if start_key<0
|
||||
(start_key..days).each do |i|
|
||||
if i%freq==0
|
||||
@start_date = re.start + i
|
||||
@end_date = re.end + i
|
||||
|
|
@ -136,7 +156,7 @@ class Event
|
|||
when "Weekly"
|
||||
@start_date = re.start
|
||||
@end_date = re.end
|
||||
@i = TimeDifference.between(re.start,end_date).in_weeks.to_i
|
||||
@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)
|
||||
@end_date += (7*re.frequency.to_i)
|
||||
|
|
@ -153,7 +173,9 @@ class Event
|
|||
if (diff_month%re.frequency.to_i)==0
|
||||
sd_tp = sd + diff_month.month
|
||||
ed_tp = ed + diff_month.month
|
||||
@recurring << data.merge({:start => sd_tp, :end => ed_tp})
|
||||
if sd_tp>start_date
|
||||
@recurring << data.merge({:start => sd_tp, :end => ed_tp})
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
|
|
@ -163,7 +185,7 @@ class Event
|
|||
ed = re.end
|
||||
start_datetime = start_date.to_datetime
|
||||
end_datetime = end_date.to_datetime
|
||||
if start_datetime>sd
|
||||
if start_datetime>sd && start_datetime.year != sd.year
|
||||
((start_datetime.year-sd.year)..(end_datetime.year-sd.year)).each do |year_diff|
|
||||
if (year_diff%re.frequency.to_i)==0
|
||||
sd_tp = sd + year_diff.year
|
||||
|
|
@ -181,7 +203,7 @@ class Event
|
|||
|
||||
def self.agenda_events(agenda_start, agenda_end)
|
||||
recurring = self.recurring_event(agenda_start,agenda_end)
|
||||
events = self.any_of(:start.gte => agenda_start).or(:end.gte => agenda_start).and(:start.lte => agenda_end).asc(:start)
|
||||
events = self.monthly_event(agenda_start, agenda_end).convert_front
|
||||
all_events = recurring.concat(events)
|
||||
recurring
|
||||
end
|
||||
|
|
|
|||
|
|
@ -36,6 +36,12 @@
|
|||
<%= f.text_area :note, :rows => 3 %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<%= f.label t("url"), :class=>"control-label" %>
|
||||
<div class="controls">
|
||||
<%= f.text_field :url %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label"></label>
|
||||
<div class="controls">
|
||||
|
|
@ -44,35 +50,19 @@
|
|||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<% data_format = (@event.all_day || @event.new_record?) ? 'yyyy/MM/dd' : 'yyyy/MM/dd hh:mm' %>
|
||||
<div class="control-group">
|
||||
<%= f.label t("start_date"), :class=>"control-label" %>
|
||||
<%#= f.datetime_select :start %>
|
||||
<div class="controls">
|
||||
<div data-date-format="yyyy/MM/dd hh:mm" data-language="en" data-picktime="true" class="input-append datetimepick">
|
||||
<%= f.text_field :start, :class => "input-large", data: {"fv-validation" => "required;","fv-messages" => "Cannot be empty;"}, :placeholder => 'YYYY/MM/DD',:value => @start_d_t %>
|
||||
<span class="add-on clearDate">
|
||||
<i class="icons-cross-3"></i>
|
||||
</span>
|
||||
<span class="add-on iconbtn">
|
||||
<i data-time-icon="icons-clock" data-date-icon="icons-calendar"></i>
|
||||
</span>
|
||||
</div>
|
||||
<%= f.datetime_picker :start, :class => "input-large", data: {"fv-validation" => "required;","fv-messages" => "Cannot be empty;"}, :placeholder => data_format, :new_record => @event.new_record?, :format => data_format %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<%= f.label t("end_date"), :class=>"control-label" %>
|
||||
<%#= f.datetime_select :end %>
|
||||
<div class="controls">
|
||||
<div data-date-format="yyyy/MM/dd hh:mm" data-language="en" data-picktime="true" class="input-append datetimepick">
|
||||
<%= f.text_field :end, :class => "input-large", :placeholder => 'YYYY/MM/DD', :value => @end_d_t %>
|
||||
<!-- <input type="text" placeholder="YYYY/MM/DD" class="input-large" name="event[end]"></input> -->
|
||||
<span class="add-on clearDate">
|
||||
<i class="icons-cross-3"></i>
|
||||
</span>
|
||||
<span class="add-on iconbtn">
|
||||
<i data-time-icon="icons-clock" data-date-icon="icons-calendar"></i>
|
||||
</span>
|
||||
</div>
|
||||
<%= f.datetime_picker :end, :class => "input-large", :placeholder => data_format, :new_record => @event.new_record?, :format=> data_format %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
|
|
@ -120,3 +110,86 @@
|
|||
<a href="" class="btn btn-close">Cancel</a>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$('body').ready(function(){
|
||||
if ($('.default_picker,.time_picker,.date_picker').find('input').length!=0){
|
||||
$('.default_picker,.time_picker,.date_picker').find('.iconbtn').css('display','none')
|
||||
$('.default_picker,.date_picker').each(function(i,v){
|
||||
v = $(v).find('input')[0]
|
||||
$(v).attr('autocomplete','off')
|
||||
var org_format = $(v).data('format')
|
||||
var format = org_format.toLowerCase().replace(/yyyy/,'yy')
|
||||
var H_flag = false
|
||||
if (org_format.search(/tt|H/)!= null ){
|
||||
H_flag = true
|
||||
}
|
||||
var M_flag = false
|
||||
if (org_format.match(/[hH].*M/)!=null){
|
||||
M_flag = true
|
||||
}
|
||||
if (format.search(/h/)!= -1){
|
||||
var result = format.match(/\W+[?=h]/)
|
||||
if (result == null){
|
||||
result = format.match(/h/)
|
||||
}
|
||||
var indice = result.index
|
||||
var dateformat = format.slice(0,8)
|
||||
var time_format_start = format.search(/h/)
|
||||
var time_format = format.slice(time_format_start)
|
||||
if (H_flag){
|
||||
time_format = time_format.replace(/h/g,'H')
|
||||
}
|
||||
if (M_flag){
|
||||
time_format = time_format.replace(/m/g,'M')
|
||||
}
|
||||
$(v).ui_datetimepicker({
|
||||
dateFormat: dateformat,
|
||||
controlType: 'select',
|
||||
timeInput: true,
|
||||
oneLine: true,
|
||||
timeFormat: time_format
|
||||
})
|
||||
}else{
|
||||
var show_view = ''
|
||||
if (format.split(/\W/).slice(-1)[0].slice(-1)[0]=='m'){
|
||||
show_view = 'month'
|
||||
}
|
||||
if (format.split(/\W/).slice(-1)[0].slice(-1)[0]=='y'){
|
||||
show_view = 'year'
|
||||
}
|
||||
$(v).ui_datepicker({dateFormat: format,show_view: show_view})
|
||||
}
|
||||
})
|
||||
$('.default_picker,.time_picker,.date_picker').find('.clearDate').click(function(){
|
||||
$(this).parents('.default_picker,.time_picker,.date_picker').eq(-1).find('input').val('')
|
||||
$(this).parents('.default_picker,.time_picker,.date_picker').eq(-1).find('input').trigger('change')
|
||||
})
|
||||
$('.time_picker input').each(function(i,v){
|
||||
$(v).ui_timepicker({timeFormat: $(v).data('format'),
|
||||
controlType: 'select',
|
||||
timeInput: true,
|
||||
oneLine: true})
|
||||
})
|
||||
$('.separated_picker').find('.date_picker,.time_picker').find('input').change(function(){
|
||||
var parent_div = $(this).parents('.separated_picker').eq(-1)
|
||||
var date_picker_value = parent_div.find('.date_picker>input').val()
|
||||
var time_picker_value = parent_div.find('.time_picker>input').val()
|
||||
if (date_picker_value == '' || time_picker_value == ''){
|
||||
parent_div.children('input[type=hidden]').val('')
|
||||
}
|
||||
else{
|
||||
parent_div.children('input[type=hidden]').val(date_picker_value+' '+time_picker_value)
|
||||
}
|
||||
})
|
||||
}
|
||||
$('.simple-date-picker').find('input[type="text"],select').change(function(){
|
||||
var parent_div = $(this).parents('.simple-date-picker').eq(-1)
|
||||
var year = parent_div.find('.span3').val()
|
||||
var month = parent_div.find('.span2').val()
|
||||
var day = parent_div.find('.span1').val()
|
||||
if (year != '' && month != '' && day != ''){
|
||||
parent_div.find('input[type="hidden"]').eq(-1).val(year+'-'+month+'-'+day)
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
|
@ -1,7 +1,5 @@
|
|||
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
|
||||
<%= javascript_include_tag 'fullcalendar' %>
|
||||
<%= javascript_include_tag 'calendar' %>
|
||||
<%= javascript_include_tag 'bootstrap-datetimepicker' %>
|
||||
<%= javascript_include_tag 'validator' %>
|
||||
|
||||
<%= stylesheet_link_tag "fullcalendar"%>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,20 @@ $:.push File.expand_path("../lib", __FILE__)
|
|||
|
||||
# Maintain your gem's version:
|
||||
require "calendar/version"
|
||||
dir_pwd = ENV['PWD']
|
||||
template_path = dir_pwd + '/app/templates'
|
||||
all_template = Dir.glob(template_path+'/*/')
|
||||
|
||||
puts 'copying calendar module'
|
||||
all_template.each do |folder|
|
||||
if folder.split('/')[-1] != 'mobile'
|
||||
begin
|
||||
system ('cp -r '+ app_path + '/modules/ ' + folder)
|
||||
rescue
|
||||
puts 'error copy'
|
||||
end
|
||||
end
|
||||
end
|
||||
# Describe your gem and declare its dependencies:
|
||||
Gem::Specification.new do |s|
|
||||
s.name = "calendar"
|
||||
|
|
|
|||
|
|
@ -17,3 +17,17 @@ en:
|
|||
weekly: Weekly
|
||||
monthly: Monthly
|
||||
yearly: Yearly
|
||||
month_name:
|
||||
'1': 'January'
|
||||
'2': 'February'
|
||||
'3': 'March'
|
||||
'4': 'April'
|
||||
'5': 'May'
|
||||
'6': 'June'
|
||||
'7': 'July'
|
||||
'8': 'August'
|
||||
'9': 'September'
|
||||
'10': 'October'
|
||||
'11': 'November'
|
||||
'12': 'December'
|
||||
calendar_title: "%{month} %{year}"
|
||||
|
|
|
|||
|
|
@ -15,3 +15,4 @@ zh_tw:
|
|||
weekly: 每週
|
||||
monthly: 每月
|
||||
yearly: 每年
|
||||
calendar_title: "%{year}年%{month}月"
|
||||
|
|
@ -29,15 +29,22 @@
|
|||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="calendar-events" style="display: none;">
|
||||
<div class="close_box">X</div>
|
||||
<div class="event-header"></div>
|
||||
<div class="event-containers">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<%= stylesheet_link_tag "calendar_widget1" %>
|
||||
<script>
|
||||
if(document.getElementById("calendar-widget_module") == null){
|
||||
var tag = document.createElement('script');
|
||||
tag.setAttribute("id", "calendar-widget_module");
|
||||
tag.src = "/assets/calendar_widget.js";
|
||||
tag.onload = function(){
|
||||
$("div[data-module=calendar]").each(function(index){
|
||||
$("div.widget-calendar-1[data-module=calendar]").each(function(index){
|
||||
var calendar = $(this),
|
||||
cmi = new CalendarModuleMonth(new Date(), calendar,calendar.data("subpart-id"),"{{more_url}}");
|
||||
cmi.currentMonth();
|
||||
|
|
|
|||
|
|
@ -0,0 +1,69 @@
|
|||
<div class="w-calendar widget-calendar-2" data-module="calendar">
|
||||
<div class="w-calendar-title">
|
||||
<span>{{widget_title}}</span>
|
||||
<span>{{calendar_title}}</span>
|
||||
</div>
|
||||
<div class='month_template'>
|
||||
<h4 class="widget-title ">
|
||||
<span class="text"></span>
|
||||
<i class="fa fa-circle-o-notch fa-spin fa-fw loading hide"></i>
|
||||
</h4>
|
||||
<div class="w-calendar-nav">
|
||||
<a href="#" class="w-calendar-nav-prev">
|
||||
<i class="fa fa-chevron-left"></i>
|
||||
<span class="w-calendar-nav-prev-text hide">Prev</span>
|
||||
</a>
|
||||
<a href="#" class="w-calendar-nav-next">
|
||||
<i class="fa fa-chevron-right"></i>
|
||||
<span class="w-calendar-nav-next-text hide">Next</span>
|
||||
</a>
|
||||
</div>
|
||||
<table class="table table-condensed w-calendar-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Sun</th>
|
||||
<th>Mon</th>
|
||||
<th>Tue</th>
|
||||
<th>Wed</th>
|
||||
<th>Thu</th>
|
||||
<th>Fri</th>
|
||||
<th>Sat</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="calendar-events" style="display: none;">
|
||||
<div class="close_box">X</div>
|
||||
<div class="event-header"></div>
|
||||
<div class="event-containers">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<%= stylesheet_link_tag "calendar_widget2" %>
|
||||
<script>
|
||||
if(document.getElementById("calendar-widget_module2") == null){
|
||||
var tag = document.createElement('script');
|
||||
tag.setAttribute("id", "calendar-widget_module2");
|
||||
tag.src = "/assets/calendar_widget2.js";
|
||||
tag.onload = function(){
|
||||
$("div.widget-calendar-2[data-module=calendar]").each(function(index){
|
||||
var calendar = $(this),
|
||||
cmi = new CalendarModuleMonth(new Date(), calendar,calendar.data("subpart-id"),"{{more_url}}");
|
||||
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);
|
||||
}
|
||||
</script>
|
||||
|
|
@ -17,6 +17,14 @@
|
|||
"en" : "1. Calendar"
|
||||
},
|
||||
"thumbnail" : "thumb.png"
|
||||
},
|
||||
{
|
||||
"filename" : "calendar_widget2",
|
||||
"name" : {
|
||||
"zh_tw" : "2. 行事曆加公告",
|
||||
"en" : "2. Calendar with announcement"
|
||||
},
|
||||
"thumbnail" : "thumb2.png"
|
||||
}
|
||||
]
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
Loading…
Reference in New Issue