]> git.mxchange.org Git - friendica.git/blobdiff - view/theme/frio/js/mod_events.js
Merge pull request #4861 from fabrixxm/issue/3395
[friendica.git] / view / theme / frio / js / mod_events.js
index 0b6bb6e7b26716be6eaa99c5c1cb558f8979d1ef..9d10bbb8e7e25d16fb4a059c38c4e9f01f3df7d2 100644 (file)
@@ -38,38 +38,39 @@ $(document).ready(function() {
                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;
+                                       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)
-                               ));
+                                       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":
-                               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;
+                                       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));
+                                       element.find(".fc-list-item-title").html(formatListViewEvent(event));
                                break;
                        }
                },
@@ -126,20 +127,18 @@ function changeView(action, viewName) {
 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">\
+                       <div class="event-card-details">\
+                               <div class="event-card-header">\
+                                       <div class="event-card-left-date">\
                                                <span class="event-date-wrapper medium">\
-                                                       <span class="event-hover-short-month">{6}</span>\
-                                                       <span class="event-hover-short-date">{7}</span>\
+                                                       <span class="event-card-short-month">{5}</span>\
+                                                       <span class="event-card-short-date">{6}</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 class="event-card-title">{2}</div>\
+                                               <div class="event-property"><span class="event-card-date">{4}</span>{3}\
+                                               {1}\
                                        </div>\
                                </div>\
                                <div class="clearfix"></div>\
@@ -151,13 +150,22 @@ function eventHoverBodyTemplate() {
 
 // The template for presenting the event location in the event hover-card
 function eventHoverLocationTemplate() {
-       var template = '<span class="event-hover-location"> {0}</span></div>';
+       var template = '<span role="presentation" aria-hidden="true"> ยท </span>\
+                       <span class="event-card-location"> {0}</span></div>';
        return template;
 }
 
+function eventHoverProfileNameTemplate() {
+       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 
 function eventHoverHtmlContent(event) {
        var eventLocation = '';
+       var eventProfileName = '';
        // Get the Browser language
        var locale = window.navigator.userLanguage || window.navigator.language;
        var data = '';
@@ -175,7 +183,7 @@ function eventHoverHtmlContent(event) {
        var endTime = moment(event.item.finish).format('HH:mm');
        var monthNumber;
 
-       var formattedDate = startDate
+       var formattedDate = startDate;
 
        // We only need the to format the end date if the event does have
        // a finish date. 
@@ -194,9 +202,9 @@ function eventHoverHtmlContent(event) {
        // 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 only template data if there exists location data
+       if (event.item.location) {
+               var eventLocationText = htmlToText(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
@@ -206,11 +214,21 @@ function eventHoverHtmlContent(event) {
                );
        }
 
+       // Get only template data if there exists a profile 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']
+               );
+       }
+
        // 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'],
+                               eventProfileName,
                                event.title,
                                eventLocation,
                                formattedDate,
@@ -235,18 +253,3 @@ function formatListViewEvent(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;
-}
\ No newline at end of file