mirror of
https://github.com/friendica/friendica
synced 2025-04-26 22:30:18 +00:00
frio: formating, otherwise untouched
This commit is contained in:
Extarys
parent
cb24e8987c
commit
91d3e72be7
25 changed files with 3300 additions and 2937 deletions
|
|
@ -4,75 +4,86 @@
|
|||
* Initialization of the fullCalendar and format the output.
|
||||
*/
|
||||
|
||||
$(document).ready(function() {
|
||||
$(document).ready(function () {
|
||||
// start the fullCalendar
|
||||
$('#events-calendar').fullCalendar({
|
||||
$("#events-calendar").fullCalendar({
|
||||
firstDay: aStr.firstDay,
|
||||
monthNames: aStr['monthNames'],
|
||||
monthNamesShort: aStr['monthNamesShort'],
|
||||
dayNames: aStr['dayNames'],
|
||||
dayNamesShort: aStr['dayNamesShort'],
|
||||
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
|
||||
day: aStr.day,
|
||||
},
|
||||
events: baseurl + moduleUrl + '/json/',
|
||||
events: baseurl + moduleUrl + "/json/",
|
||||
header: {
|
||||
left: '',
|
||||
// center: 'title',
|
||||
right: ''
|
||||
},
|
||||
timeFormat: 'H:mm',
|
||||
eventClick: function(calEvent, jsEvent, view) {
|
||||
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')); });
|
||||
loading: function (isLoading, view) {
|
||||
if (!isLoading) {
|
||||
$("td.fc-day").dblclick(function () {
|
||||
addToModal("/events/new?start=" + $(this).data("date"));
|
||||
});
|
||||
}
|
||||
},
|
||||
defaultView: 'month',
|
||||
defaultView: "month",
|
||||
aspectRatio: 1,
|
||||
eventRender: function(event, element, view) {
|
||||
eventRender: function (event, element, view) {
|
||||
//console.log(view.name);
|
||||
switch(view.name){
|
||||
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
|
||||
));
|
||||
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":
|
||||
if (event.item['author-name'] == null) return;
|
||||
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,
|
||||
htmlToText(event.item.location)
|
||||
));
|
||||
break;
|
||||
if (event.item["author-name"] == null) return;
|
||||
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,
|
||||
htmlToText(event.item.location),
|
||||
),
|
||||
);
|
||||
break;
|
||||
case "agendaDay":
|
||||
if (event.item['author-name'] == null) return;
|
||||
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,
|
||||
htmlToText(event.item.location)
|
||||
));
|
||||
if (event.item["author-name"] == null) return;
|
||||
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,
|
||||
htmlToText(event.item.location),
|
||||
),
|
||||
);
|
||||
break;
|
||||
case "listMonth":
|
||||
element.find(".fc-list-item-title").html(formatListViewEvent(event));
|
||||
break;
|
||||
break;
|
||||
}
|
||||
},
|
||||
eventAfterRender: function (event, element) {
|
||||
|
|
@ -82,54 +93,53 @@ $(document).ready(function() {
|
|||
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>',
|
||||
template:
|
||||
'<div class="popover hovercard event-card"><div class="arrow"></div><div class="popover-content hovercard-content"></div></div>',
|
||||
sanitizeFn: function (content) {
|
||||
return DOMPurify.sanitize(content)
|
||||
return DOMPurify.sanitize(content);
|
||||
},
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
});
|
||||
|
||||
// center on date
|
||||
var args=location.href.replace(baseurl,"").split("/");
|
||||
var args = location.href.replace(baseurl, "").split("/");
|
||||
if (modparams == 2) {
|
||||
if (args.length>=5) {
|
||||
$("#events-calendar").fullCalendar('gotoDate',args[3] , args[4]-1);
|
||||
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 (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);
|
||||
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]);
|
||||
|
||||
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);
|
||||
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);
|
||||
$("#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 = '\
|
||||
var template =
|
||||
'\
|
||||
<div class="event-card-basic-content media">\
|
||||
<div class="event-card-details">\
|
||||
<div class="event-card-header">\
|
||||
|
|
@ -154,52 +164,53 @@ function eventHoverBodyTemplate() {
|
|||
|
||||
// The template for presenting the event location in the event hover-card
|
||||
function eventHoverLocationTemplate() {
|
||||
var template = '<span role="presentation" aria-hidden="true"> · </span>\
|
||||
var template =
|
||||
'<span role="presentation" aria-hidden="true"> · </span>\
|
||||
<span class="event-card-location"> {0}</span></div>';
|
||||
return template;
|
||||
}
|
||||
|
||||
function eventHoverProfileNameTemplate() {
|
||||
var template = '\
|
||||
var template =
|
||||
'\
|
||||
<div class="event-card-profile-name profile-entry-name">\
|
||||
<a href="{0}" class="userinfo">{1}</a>\
|
||||
</div>';
|
||||
return template;
|
||||
}
|
||||
// transform the event data to html so we can use it in the event hover-card
|
||||
// transform the event data to html so we can use it in the event hover-card
|
||||
function eventHoverHtmlContent(event) {
|
||||
var eventLocation = '';
|
||||
var eventProfileName = '';
|
||||
var eventLocation = "";
|
||||
var eventProfileName = "";
|
||||
// Get the Browser language
|
||||
var locale = window.navigator.userLanguage || window.navigator.language;
|
||||
var data = '';
|
||||
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 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.
|
||||
// a finish date.
|
||||
if (event.item.nofinish == 0) {
|
||||
formattedDate = startDate + ' - ' + endTime;
|
||||
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');
|
||||
if (dayNumberStart != dayNumberEnd) {
|
||||
formattedDate =
|
||||
moment(event.item.start).format("Do MMM") + " - " + moment(event.item.finish).format("Do MMM");
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -213,32 +224,27 @@ function eventHoverHtmlContent(event) {
|
|||
var eventLocationTemplate = eventHoverLocationTemplate();
|
||||
// Format the event location data according to the the event location
|
||||
// template
|
||||
eventLocation = eventLocationTemplate.format(
|
||||
eventLocationText
|
||||
);
|
||||
eventLocation = eventLocationTemplate.format(eventLocationText);
|
||||
}
|
||||
|
||||
// Get only template data if there exists a profile name
|
||||
if (event.item['author-name']) {
|
||||
if (event.item["author-name"]) {
|
||||
// Get the template
|
||||
var eventProfileNameTemplate = eventHoverProfileNameTemplate();
|
||||
// Insert the data into the template
|
||||
eventProfileName = eventProfileNameTemplate.format(
|
||||
event.item['author-link'],
|
||||
event.item['author-name']
|
||||
);
|
||||
eventProfileName = eventProfileNameTemplate.format(event.item["author-link"], event.item["author-name"]);
|
||||
}
|
||||
|
||||
// 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
|
||||
eventProfileName,
|
||||
event.title,
|
||||
eventLocation,
|
||||
formattedDate,
|
||||
monthShort.replace('.', ''), // Get rid of possible dots in the string
|
||||
dayNumberStart
|
||||
);
|
||||
event.item["author-avatar"], // this isn't used at the present time
|
||||
eventProfileName,
|
||||
event.title,
|
||||
eventLocation,
|
||||
formattedDate,
|
||||
monthShort.replace(".", ""), // Get rid of possible dots in the string
|
||||
dayNumberStart,
|
||||
);
|
||||
|
||||
return formatted;
|
||||
}
|
||||
|
|
@ -246,7 +252,8 @@ function eventHoverHtmlContent(event) {
|
|||
// 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">\
|
||||
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>\
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue