mirror of
https://git.sekbaer.de/Friendica/friendica.git
synced 2025-06-17 04:15:15 +02:00
update to fullCalendar 3.0.1, frio: cal list view, frio: cal month hover
This commit is contained in:
rabuzarus
parent
20e10a50c0
commit
8064ff6ecb
34 changed files with 21940 additions and 6597 deletions
151
view/theme/frio/css/mod_events.css
Normal file
151
view/theme/frio/css/mod_events.css
Normal file
|
|
@ -0,0 +1,151 @@
|
|||
/**
|
||||
* @file view/theme/frio/css/mod_event.css
|
||||
*/
|
||||
|
||||
/**
|
||||
* The different views of js fullcalendar
|
||||
*/
|
||||
#fc-header {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#fc-header-left,
|
||||
#fc-header-right,
|
||||
#event-calendar-title {
|
||||
display: inline-block;
|
||||
}
|
||||
#fc-title {
|
||||
margin: 0;
|
||||
padding-left: 20px;
|
||||
|
||||
}
|
||||
#fc-header-right {
|
||||
margin-top: -4px;
|
||||
}
|
||||
#event-calendar-title {
|
||||
vertical-align: middle;
|
||||
}
|
||||
a#event-calendar-views {
|
||||
padding: 6px 9px;
|
||||
font-size: 14px
|
||||
}
|
||||
.fc .fc-toolbar {
|
||||
display: none;
|
||||
}
|
||||
.fc .fc-month-view td.fc-widget-content,
|
||||
.fc .fc-list-view,
|
||||
.fc .fc-list-view .fc-list-table td,
|
||||
.fc .fc-body td {
|
||||
border-style: none;
|
||||
}
|
||||
.fc td.fc-widget-header,
|
||||
.fc th.fc-widget-header {
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
border-top: none;
|
||||
}
|
||||
.fc .fc-month-view td.fc-day {
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
border-bottom: 1px solid;
|
||||
padding: 0 6px;
|
||||
}
|
||||
.fc .fc-day-grid-container .fc-row {
|
||||
border-bottom: 1px solid;
|
||||
border-color: #ddd;
|
||||
}
|
||||
.fc .fc-day-grid-event .fc-content {
|
||||
/*white-space: normal;*/
|
||||
}
|
||||
.fc tr td.fc-today {
|
||||
border-style: none;
|
||||
}
|
||||
.fc .fc-month-view .fc-content .fc-title .item-desc {
|
||||
font-size: 11px;
|
||||
}
|
||||
.fc .fc-view-container {
|
||||
margin-top: 25px;
|
||||
}
|
||||
.fc .fc-list-view td {
|
||||
padding: 0;
|
||||
}
|
||||
#events-calendar.fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
|
||||
float: left;
|
||||
font-size: 12px;
|
||||
}
|
||||
.fc .fc-event {
|
||||
background-color: transparent;
|
||||
background-color: #E3F2FD;
|
||||
border: 1px solid #BBDEFB;
|
||||
color: #555;
|
||||
}
|
||||
.fc .fc-month-view .fc-time,
|
||||
.fc .fc-listMonth-view .fc-list-item-time,
|
||||
.fc .fc-listMonth-view .fc-list-item-marker,
|
||||
.fc .fc-listMonth-view .fc-widget-header {
|
||||
display: none;
|
||||
}
|
||||
.fc .fc-listMonth-view .fc-list-item:hover td {
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
}
|
||||
.fc .fc-listMonth-view .seperator {
|
||||
margin-left: 30px;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* The event-card
|
||||
*/
|
||||
.event-card {
|
||||
width: auto;
|
||||
}
|
||||
.event-card .event-label,
|
||||
.event-card .location-label {
|
||||
font-weight: bold;
|
||||
}
|
||||
.popover.event-card .event-card-basic-content {
|
||||
margin-top: 0;
|
||||
padding: 9px;
|
||||
padding-left: 0px;
|
||||
}
|
||||
.event-card .event-hover-left-date {
|
||||
width: 60px;
|
||||
}
|
||||
.event-card .event-date-wrapper.medium > span {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.event-card .event-date-wrapper.medium .event-hover-short-month {
|
||||
font-size: 13px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.event-card .event-date-wrapper.medium .event-hover-short-date {
|
||||
font-size: 24px;
|
||||
line-height: 28px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.event-card .event-card-basic-content .event-card-content {
|
||||
width: 100%;
|
||||
padding: 0 5px 0 15px;
|
||||
box-shadow: 1.5px 0 0 0 rgba(0, 0, 0, .1) inset;
|
||||
}
|
||||
.event-card .event-hover-title {
|
||||
font-size: 14px;
|
||||
color: #555;
|
||||
line-height: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.event-card .event-hover-location {
|
||||
margin-top: 10px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.event-card .event-hover-location .location {
|
||||
color: #777;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
|
@ -2081,45 +2081,21 @@ ul li:hover .contact-wrapper a.contact-action-link:hover {
|
|||
}
|
||||
|
||||
/* Events page */
|
||||
#fc-header {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#fc-header-left,
|
||||
#fc-header-right,
|
||||
#event-calendar-title {
|
||||
display: inline-block;
|
||||
}
|
||||
#fc-title {
|
||||
margin: 0;
|
||||
padding-left: 20px;
|
||||
|
||||
|
||||
.fc .fc-month-view .fc-content .fc-title .item-desc:hover {
|
||||
color: $link_hover_color;
|
||||
}
|
||||
#fc-header-right {
|
||||
margin-top: -4px;
|
||||
.fc .fc-list-item-title a {
|
||||
color: $link_color;
|
||||
}
|
||||
#event-calendar-title {
|
||||
vertical-align: middle;
|
||||
}
|
||||
a#event-calendar-views {
|
||||
padding: 6px 9px;
|
||||
font-size: 14px
|
||||
}
|
||||
tr.fc-first,
|
||||
tr.fc-first th {
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
border-top: none;
|
||||
}
|
||||
td.fc-day {
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
padding: 0 6px;
|
||||
}
|
||||
#events-calendar .fc-grid .fc-day-number {
|
||||
float: left;
|
||||
font-size: 0.9em;
|
||||
.fc .fc-list-item-title a[href]:hover {
|
||||
color: $link_hover_color;
|
||||
text-decoration: none;
|
||||
}
|
||||
/*.event-date-wrapper.medium .event-hover-short-month {
|
||||
color: $link_color;
|
||||
}*/
|
||||
.event-wrapper .event-owner {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
$(document).ready(function() {
|
||||
// go to the permissions tab if the checkbox is checked
|
||||
$('body').on("change", "#id_share", function() {
|
||||
|
||||
if ($('#id_share').is(':checked') && !( $('#id_share').attr("disabled"))) {
|
||||
$('#acl-wrapper').show();
|
||||
$("a#event-perms-lnk").parent("li").show();
|
||||
|
|
@ -26,7 +25,7 @@ $(document).ready(function() {
|
|||
selstr = $(this).text();
|
||||
$('#jot-public').hide();
|
||||
});
|
||||
if(selstr == null) {
|
||||
if (selstr == null) {
|
||||
$('#jot-public').show();
|
||||
}
|
||||
|
||||
252
view/theme/frio/js/mod_events.js
Normal file
252
view/theme/frio/js/mod_events.js
Normal file
|
|
@ -0,0 +1,252 @@
|
|||
/**
|
||||
* @file view/theme/frio/js/mod_events.js
|
||||
* @brief Initialization of the fullCalendar and format the output.
|
||||
*/
|
||||
|
||||
$(document).ready(function() {
|
||||
// start the fullCalendar
|
||||
$('#events-calendar').fullCalendar({
|
||||
firstDay: aStr.firstDay,
|
||||
monthNames: aStr['monthNames'],
|
||||
monthNamesShort: aStr['monthNamesShort'],
|
||||
dayNames: aStr['dayNames'],
|
||||
dayNamesShort: aStr['dayNamesShort'],
|
||||
allDayText: aStr.allday,
|
||||
noEventsMessage: aStr.noevent,
|
||||
buttonText: {
|
||||
today: aStr.today,
|
||||
month: aStr.month,
|
||||
week: aStr.week,
|
||||
day: aStr.day
|
||||
},
|
||||
events: baseurl + moduleUrl + '/json/',
|
||||
header: {
|
||||
left: '',
|
||||
// center: 'title',
|
||||
right: ''
|
||||
},
|
||||
timeFormat: 'H:mm',
|
||||
eventClick: function(calEvent, jsEvent, view) {
|
||||
showEvent(calEvent.id);
|
||||
},
|
||||
loading: function(isLoading, view) {
|
||||
if(!isLoading) {
|
||||
$('td.fc-day').dblclick(function() { addToModal('/events/new?start='+$(this).data('date')); });
|
||||
}
|
||||
},
|
||||
defaultView: 'month',
|
||||
aspectRatio: 1,
|
||||
eventRender: function(event, element, view) {
|
||||
//console.log(view.name);
|
||||
if (event.item['author-name'] == null) return;
|
||||
switch(view.name){
|
||||
case "month":
|
||||
element.find(".fc-title").html(
|
||||
"<span class='item-desc'>{2}</span>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
event.title,
|
||||
event.item.desc,
|
||||
event.item.location
|
||||
));
|
||||
break;
|
||||
case "agendaWeek":
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:12px; width:12px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
event.item.desc,
|
||||
formatEventLocationText(event.item.location)
|
||||
));
|
||||
break;
|
||||
case "agendaDay":
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:24px;width:24px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
event.item.desc,
|
||||
formatEventLocationText(event.item.location)
|
||||
));
|
||||
break;
|
||||
case "listMonth":
|
||||
element.find(".fc-list-item-title").html(formatListViewEvent(event));
|
||||
break;
|
||||
}
|
||||
},
|
||||
eventAfterRender: function (event, element) {
|
||||
$(element).popover({
|
||||
content: eventHoverHtmlContent(event),
|
||||
container: "body",
|
||||
html: true,
|
||||
trigger: "hover",
|
||||
placement: "auto",
|
||||
template: '<div class="popover hovercard event-card"><div class="arrow"></div><div class="popover-content hovercard-content"></div></div>',
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
// center on date
|
||||
var args=location.href.replace(baseurl,"").split("/");
|
||||
if (modparams == 2) {
|
||||
if (args.length>=5) {
|
||||
$("#events-calendar").fullCalendar('gotoDate',args[3] , args[4]-1);
|
||||
}
|
||||
} else {
|
||||
if (args.length>=4) {
|
||||
$("#events-calendar").fullCalendar('gotoDate',args[2] , args[3]-1);
|
||||
}
|
||||
}
|
||||
|
||||
// echo the title
|
||||
var view = $('#events-calendar').fullCalendar('getView');
|
||||
$('#fc-title').text(view.title);
|
||||
|
||||
// show event popup
|
||||
var hash = location.hash.split("-")
|
||||
if (hash.length==2 && hash[0]=="#link") showEvent(hash[1]);
|
||||
|
||||
});
|
||||
|
||||
// loads the event into a modal
|
||||
function showEvent(eventid) {
|
||||
addToModal(baseurl + moduleUrl + '/?id=' + eventid);
|
||||
}
|
||||
|
||||
function changeView(action, viewName) {
|
||||
$('#events-calendar').fullCalendar(action, viewName);
|
||||
var view = $('#events-calendar').fullCalendar('getView');
|
||||
$('#fc-title').text(view.title);
|
||||
}
|
||||
|
||||
// The template for the bootstrap popover for displaying the event title and
|
||||
// author (it's the nearly the same template we use in frio for the contact
|
||||
// hover cards. So be careful when changing the css)
|
||||
function eventHoverBodyTemplate() {
|
||||
var template = '\
|
||||
<div class="event-card-basic-content media">\
|
||||
<div class="hover-card-details">\
|
||||
<div class="hover-card-header left-align">\
|
||||
<div class="event-hover-left-date left-align">\
|
||||
<span class="event-date-wrapper medium">\
|
||||
<span class="event-hover-short-month">{6}</span>\
|
||||
<span class="event-hover-short-date">{7}</span>\
|
||||
</span>\
|
||||
</div>\
|
||||
<div class="event-card-content media-body">\
|
||||
<div class="event-hover-title">{3}</div>\
|
||||
<div class="event-property"><span class="event-hover-date">{5}</span>{4}\
|
||||
<div class="event-hover-profile-name profile-entry-name">\
|
||||
<span class="left-align1"><a href="{1}" class="userinfo">{2}</a></span>\
|
||||
</div>\
|
||||
</div>\
|
||||
</div>\
|
||||
<div class="clearfix"></div>\
|
||||
</div>\
|
||||
</div>';
|
||||
|
||||
return template;
|
||||
}
|
||||
|
||||
// The template for presenting the event location in the event hover-card
|
||||
function eventHoverLocationTemplate() {
|
||||
var template = '<span class="event-hover-location"> {0}</span></div>';
|
||||
return template;
|
||||
}
|
||||
|
||||
// transform the event data to html so we can use it in the event hover-card
|
||||
function eventHoverHtmlContent(event) {
|
||||
var eventLocation = '';
|
||||
// Get the Browser language
|
||||
var locale = window.navigator.userLanguage || window.navigator.language;
|
||||
var data = '';
|
||||
|
||||
// Use the browser language for date formatting
|
||||
moment.locale(locale);
|
||||
|
||||
// format dates to different styles
|
||||
var startDate = moment(event.item.start).format('dd HH:mm');
|
||||
var endDate = moment(event.item.finsih).format('dd HH:mm');
|
||||
var monthShort = moment(event.item.start).format('MMM');
|
||||
var dayNumberStart = moment(event.item.start).format('DD');
|
||||
var dayNumberEnd = moment(event.item.finish).format('DD');
|
||||
var startTime = moment(event.item.start).format('HH:mm');
|
||||
var endTime = moment(event.item.finish).format('HH:mm');
|
||||
var monthNumber;
|
||||
|
||||
var formattedDate = startDate
|
||||
|
||||
// We only need the to format the end date if the event does have
|
||||
// a finish date.
|
||||
if (event.item.nofinish == 0) {
|
||||
formattedDate = startDate + ' - ' + endTime;
|
||||
|
||||
// use a different Format (15. Feb - 18. Feb) if the events end date
|
||||
// is not the start date
|
||||
if ( dayNumberStart != dayNumberEnd) {
|
||||
formattedDate = moment(event.item.start).format('Do MMM') +
|
||||
' - ' +
|
||||
moment(event.item.finish).format('Do MMM');
|
||||
}
|
||||
}
|
||||
|
||||
// Get the html template
|
||||
data = eventHoverBodyTemplate();
|
||||
|
||||
// Get only template data if there exist location data
|
||||
if (event.item.location != '') {
|
||||
var eventLocationText = formatEventLocationText(event.item.location);
|
||||
// Get the the html template for formatting the location
|
||||
var eventLocationTemplate = eventHoverLocationTemplate();
|
||||
// Format the event location data according to the the event location
|
||||
// template
|
||||
eventLocation = eventLocationTemplate.format(
|
||||
eventLocationText
|
||||
);
|
||||
}
|
||||
|
||||
// Format the event data according to the event hover template
|
||||
var formatted = data.format(
|
||||
event.item['author-avatar'], // this isn't used at the present time
|
||||
event.item['author-link'],
|
||||
event.item['author-name'],
|
||||
event.title,
|
||||
eventLocation,
|
||||
formattedDate,
|
||||
monthShort.replace('.', ''), // Get rid of possible dots in the string
|
||||
dayNumberStart
|
||||
);
|
||||
|
||||
return formatted;
|
||||
}
|
||||
|
||||
// transform the the list view event element into formatted html
|
||||
function formatListViewEvent(event) {
|
||||
// The basic template for list view
|
||||
var template = '<td class="fc-list-item-title fc-widget-content">\
|
||||
<hr class="seperator"></hr>\
|
||||
<div class="event-card">\
|
||||
<div class="popover-content hovercard-content">{0}</div>\
|
||||
</div>\
|
||||
</td>';
|
||||
// Use the formation of the event hover and insert it in the base list view template
|
||||
var formatted = template.format(eventHoverHtmlContent(event));
|
||||
|
||||
return formatted;
|
||||
}
|
||||
|
||||
// Format event location in pure text
|
||||
function formatEventLocationText(location) {
|
||||
// Friendica can store the event location as text or as html
|
||||
// We need to check if the location is html. In this case we need
|
||||
// to transform it into clean text
|
||||
if (location.startsWith("<div")) {
|
||||
var locationHtml = $.parseHTML( location );
|
||||
var eventLocationText = locationHtml[0]['innerText'];
|
||||
} else {
|
||||
var eventLocationText = location.replace("<br>", " ");
|
||||
};
|
||||
|
||||
return eventLocationText;
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<script language="javascript" type="text/javascript"
|
||||
src="{{$baseurl}}/view/theme/frio/js/event.js"></script>
|
||||
src="{{$baseurl}}/view/theme/frio/js/event_edit.js"></script>
|
||||
|
||||
{{foreach $events as $event}}
|
||||
<div class="event-wrapper">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script language="javascript" type="text/javascript"
|
||||
src="{{$baseurl}}/view/theme/frio/js/event.js"></script>
|
||||
src="{{$baseurl}}/view/theme/frio/js/event_edit.js"></script>
|
||||
<div id="event-form-wrapper">
|
||||
<h3 class="heading">{{$title}}</h3>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,113 +1,38 @@
|
|||
|
||||
<link rel='stylesheet' type='text/css' href='{{$baseurl}}/library/fullcalendar/fullcalendar.css' />
|
||||
<script language="javascript" type="text/javascript"
|
||||
src="{{$baseurl}}/library/fullcalendar/fullcalendar.min.js"></script>
|
||||
<link rel='stylesheet' type='text/css' href='view/theme/frio/css/mod_events.css' />
|
||||
<script type="text/javascript" src="{{$baseurl}}/library/moment/moment.min.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/library/moment/locales.min.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/library/fullcalendar/fullcalendar.min.js"></script>
|
||||
<script type="text/javascript" src="view/theme/frio/js/mod_events.js"></script>
|
||||
|
||||
|
||||
<script language="javascript" type="text/javascript">
|
||||
// loads the event into a modal
|
||||
function showEvent(eventid) {
|
||||
addToModal('{{$baseurl}}{{$module_url}}/?id='+eventid);
|
||||
}
|
||||
// pass php translation strings to js variables/arrays so we can make use of it in js files
|
||||
aStr.monthNames = ['{{$i18n.January}}','{{$i18n.February}}','{{$i18n.March}}','{{$i18n.April}}','{{$i18n.May}}','{{$i18n.June}}','{{$i18n.July}}','{{$i18n.August}}','{{$i18n.September}}','{{$i18n.October}}','{{$i18n.November}}','{{$i18n.December}}'];
|
||||
aStr.monthNamesShort = ['{{$i18n.Jan}}','{{$i18n.Feb}}','{{$i18n.Mar}}','{{$i18n.Apr}}','{{$i18n.May}}','{{$i18n.Jun}}','{{$i18n.Jul}}','{{$i18n.Aug}}','{{$i18n.Sep}}','{{$i18n.Oct}}','{{$i18n.Nov}}','{{$i18n.Dec}}'];
|
||||
aStr.monthNamesShort = ['{{$i18n.Jan}}','{{$i18n.Feb}}','{{$i18n.Mar}}','{{$i18n.Apr}}','{{$i18n.May}}','{{$i18n.Jun}}','{{$i18n.Jul}}','{{$i18n.Aug}}','{{$i18n.Sep}}','{{$i18n.Oct}}','{{$i18n.Nov}}','{{$i18n.Dec}}'];
|
||||
aStr.dayNames = ['{{$i18n.Sunday}}','{{$i18n.Monday}}','{{$i18n.Tuesday}}','{{$i18n.Wednesday}}','{{$i18n.Thursday}}','{{$i18n.Friday}}','{{$i18n.Saturday}}'];
|
||||
aStr.dayNamesShort = ['{{$i18n.Sun}}','{{$i18n.Mon}}','{{$i18n.Tue}}','{{$i18n.Wed}}','{{$i18n.Thu}}','{{$i18n.Fri}}','{{$i18n.Sat}}'];
|
||||
|
||||
function changeView(action, viewName) {
|
||||
$('#events-calendar').fullCalendar(action, viewName);
|
||||
var view = $('#events-calendar').fullCalendar('getView');
|
||||
$('#fc-title').text(view.title);
|
||||
}
|
||||
aStr.firstDay = '{{$i18n.firstDay}}';
|
||||
aStr.today = '{{$i18n.today}}';
|
||||
aStr.month = '{{$i18n.month}}';
|
||||
aStr.week = '{{$i18n.week}}';
|
||||
aStr.day = '{{$i18n.day}}';
|
||||
|
||||
$(document).ready(function() {
|
||||
// start the fullCalendar
|
||||
$('#events-calendar').fullCalendar({
|
||||
firstDay: {{$i18n.firstDay}},
|
||||
monthNames: ['{{$i18n.January}}','{{$i18n.February}}','{{$i18n.March}}','{{$i18n.April}}','{{$i18n.May}}','{{$i18n.June}}','{{$i18n.July}}','{{$i18n.August}}','{{$i18n.September}}','{{$i18n.October}}','{{$i18n.November}}','{{$i18n.December}}'],
|
||||
monthNamesShort: ['{{$i18n.Jan}}','{{$i18n.Feb}}','{{$i18n.Mar}}','{{$i18n.Apr}}','{{$i18n.May}}','{{$i18n.Jun}}','{{$i18n.Jul}}','{{$i18n.Aug}}','{{$i18n.Sep}}','{{$i18n.Oct}}','{{$i18n.Nov}}','{{$i18n.Dec}}'],
|
||||
dayNames: ['{{$i18n.Sunday}}','{{$i18n.Monday}}','{{$i18n.Tuesday}}','{{$i18n.Wednesday}}','{{$i18n.Thursday}}','{{$i18n.Friday}}','{{$i18n.Saturday}}'],
|
||||
dayNamesShort: ['{{$i18n.Sun}}','{{$i18n.Mon}}','{{$i18n.Tue}}','{{$i18n.Wed}}','{{$i18n.Thu}}','{{$i18n.Fri}}','{{$i18n.Sat}}'],
|
||||
buttonText: {
|
||||
prev: "<span class='fc-text-arrow'>‹</span>",
|
||||
next: "<span class='fc-text-arrow'>›</span>",
|
||||
prevYear: "<span class='fc-text-arrow'>«</span>",
|
||||
nextYear: "<span class='fc-text-arrow'>»</span>",
|
||||
today: '{{$i18n.today}}',
|
||||
month: '{{$i18n.month}}',
|
||||
week: '{{$i18n.week}}',
|
||||
day: '{{$i18n.day}}'
|
||||
},
|
||||
events: '{{$baseurl}}{{$module_url}}/json/',
|
||||
header: {
|
||||
left: '',
|
||||
// center: 'title',
|
||||
right: ''
|
||||
},
|
||||
timeFormat: 'H(:mm)',
|
||||
eventClick: function(calEvent, jsEvent, view) {
|
||||
showEvent(calEvent.id);
|
||||
},
|
||||
loading: function(isLoading, view) {
|
||||
if(!isLoading) {
|
||||
$('td.fc-day').dblclick(function() { addToModal('/events/new?start='+$(this).data('date')); });
|
||||
}
|
||||
},
|
||||
|
||||
eventRender: function(event, element, view) {
|
||||
//console.log(view.name);
|
||||
if (event.item['author-name']==null) return;
|
||||
switch(view.name){
|
||||
case "month":
|
||||
element.find(".fc-event-title").html(
|
||||
"<img src='{0}' style='height:10px;width:10px'>{1} : {2}".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
event.title
|
||||
));
|
||||
break;
|
||||
case "agendaWeek":
|
||||
element.find(".fc-event-title").html(
|
||||
"<img src='{0}' style='height:12px; width:12px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
event.item.desc,
|
||||
event.item.location
|
||||
));
|
||||
break;
|
||||
case "agendaDay":
|
||||
element.find(".fc-event-title").html(
|
||||
"<img src='{0}' style='height:24px;width:24px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
event.item.desc,
|
||||
event.item.location
|
||||
));
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
aStr.allday = '{{$i18n.allday}}';
|
||||
aStr.noevent = '{{$i18n.noevent}}';
|
||||
|
||||
// center on date
|
||||
var args=location.href.replace(baseurl,"").split("/");
|
||||
{{if $modparams == 2}}
|
||||
if (args.length>=5) {
|
||||
$("#events-calendar").fullCalendar('gotoDate',args[3] , args[4]-1);
|
||||
}
|
||||
{{else}}
|
||||
if (args.length>=4) {
|
||||
$("#events-calendar").fullCalendar('gotoDate',args[2] , args[3]-1);
|
||||
}
|
||||
{{/if}}
|
||||
aStr.dtstartLabel = '{{$i18n.dtstart_label}}';
|
||||
aStr.dtendLabel = '{{$i18n.dtend_label}}';
|
||||
aStr.locationLabel = '{{$i18n.location_label}}';
|
||||
|
||||
// echo the title
|
||||
var view = $('#events-calendar').fullCalendar('getView');
|
||||
$('#fc-title').text(view.title);
|
||||
var moduleUrl = '{{$module_url}}';
|
||||
var modparams = {{$modparams}}
|
||||
|
||||
// show event popup
|
||||
var hash = location.hash.split("-")
|
||||
if (hash.length==2 && hash[0]=="#link") showEvent(hash[1]);
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
{{if $editselect != 'none'}}
|
||||
<script language="javascript" type="text/javascript"
|
||||
src="{{$baseurl}}/library/tinymce/jscripts/tiny_mce/tiny_mce_src.js"></script>
|
||||
|
|
|
|||
|
|
@ -16,16 +16,16 @@
|
|||
</a>
|
||||
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="event-calendar-views">
|
||||
<li role="menuitem">
|
||||
|
||||
<a onclick="changeView('changeView', 'month')">{{$month}}</a>
|
||||
<a onclick="changeView('changeView', 'month');$('#events-calendar').fullCalendar('option', {contentHeight: '', aspectRatio: 1});">{{$month}}</a>
|
||||
</li>
|
||||
<li role="menuitem">
|
||||
|
||||
<a onclick="changeView('changeView', 'agendaWeek')">{{$week}}</a>
|
||||
<a onclick="changeView('changeView', 'agendaWeek');$('#events-calendar').fullCalendar('option', 'contentHeight', 'auto');">{{$week}}</a>
|
||||
</li>
|
||||
<li role="menuitem">
|
||||
|
||||
<a onclick="changeView('changeView', 'agendaDay')">{{$day}}</a>
|
||||
<a onclick="changeView('changeView', 'agendaDay');$('#events-calendar').fullCalendar('option', 'contentHeight', 'auto');">{{$day}}</a>
|
||||
</li>
|
||||
<li role="menuitem">
|
||||
<a onclick="changeView('changeView', 'listMonth');$('#events-calendar').fullCalendar('option', 'contentHeight', 'auto');">{{$list}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
|
@ -172,7 +172,7 @@ $(document).ready(function() {
|
|||
if (event.item['author-name']==null) return;
|
||||
switch(view.name){
|
||||
case "month":
|
||||
element.find(".fc-event-title").html(
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:10px;width:10px'>{1} : {2}".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
|
|
@ -180,7 +180,7 @@ $(document).ready(function() {
|
|||
));
|
||||
break;
|
||||
case "agendaWeek":
|
||||
element.find(".fc-event-title").html(
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:12px; width:12px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
|
|
@ -189,7 +189,7 @@ $(document).ready(function() {
|
|||
));
|
||||
break;
|
||||
case "agendaDay":
|
||||
element.find(".fc-event-title").html(
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:24px;width:24px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
|
||||
<script language="javascript" type="text/javascript"
|
||||
src="{{$baseurl}}/library/fullcalendar/fullcalendar.min.js"></script>
|
||||
|
||||
|
||||
<script type="text/javascript" src="{{$baseurl}}/library/moment/moment.min.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/library/moment/locales.min.js"></script>
|
||||
<script language="javascript" type="text/javascript" src="{{$baseurl}}/library/fullcalendar/fullcalendar.min.js"></script>
|
||||
|
|
|
|||
|
|
@ -159,7 +159,7 @@ $(document).ready(function() {
|
|||
eventClick: function(calEvent, jsEvent, view) {
|
||||
showEvent(calEvent.id);
|
||||
},
|
||||
loading: function(isLoading, view) {
|
||||
loading: function(isLoading, view) {
|
||||
if(!isLoading) {
|
||||
$('td.fc-day').dblclick(function() { window.location.href='/events/new?start='+$(this).data('date'); });
|
||||
}
|
||||
|
|
@ -170,7 +170,7 @@ $(document).ready(function() {
|
|||
if (event.item['author-name']==null) return;
|
||||
switch(view.name){
|
||||
case "month":
|
||||
element.find(".fc-event-title").html(
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:10px;width:10px'>{1} : {2}".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
|
|
@ -178,7 +178,7 @@ $(document).ready(function() {
|
|||
));
|
||||
break;
|
||||
case "agendaWeek":
|
||||
element.find(".fc-event-title").html(
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:12px; width:12px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
|
|
@ -187,7 +187,7 @@ $(document).ready(function() {
|
|||
));
|
||||
break;
|
||||
case "agendaDay":
|
||||
element.find(".fc-event-title").html(
|
||||
element.find(".fc-title").html(
|
||||
"<img src='{0}' style='height:24px;width:24px'>{1}<p>{2}</p><p>{3}</p>".format(
|
||||
event.item['author-avatar'],
|
||||
event.item['author-name'],
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
<script language="javascript" type="text/javascript"
|
||||
src="{{$baseurl}}/library/fullcalendar/fullcalendar.min.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/library/moment/moment.min.js"></script>
|
||||
<script type="text/javascript" src="{{$baseurl}}/library/moment/locales.min.js"></script>
|
||||
<script language="javascript" type="text/javascript" src="{{$baseurl}}/library/fullcalendar/fullcalendar.min.js"></script>
|
||||
|
||||
<script language="javascript" type="text/javascript">eventInitEditor();</script>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue