Merge branch '6.0/add-modify-calendar-callback' into 6.0-trunk

Author: sunnavy

share/html/Search/Elements/Calendar

@@ -586,21 +586,20 @@ $TempQuery .= RT::Search::Calendar::DatesClauses(\@Dates, $date->strftime("%F"),
 
 $m->callback( CallbackName => 'BeforeFindTickets', ARGSRef => \%ARGS, QueryRef => \$TempQuery, FormatRef => \$TempFormat );
 
-my $DownloadQueryString =
-      $m->comp(
-        '/Elements/QueryString',
-        Query   => $TempQuery,
-        Format  => $Format,
-        Order   => $Order,
-        OrderBy => $OrderBy,
-      );
-
 my $Calendar;
 
 # This is the expensive part of the processing, so only run this when
 # htmx is rendering the main content.
 if ( $m->request_path =~ /^(?:\/SelfService)?\/Views|Calendar.html/ ) {
     $Calendar = RT::Search::Calendar::GetCalendarTickets($session{'CurrentUser'}, $TempQuery, \@Dates, $date->strftime("%F"), $end->strftime("%F"), $starts_field, $ends_field);
+
+    $m->callback(
+        CallbackName   => 'ModifyCalendar',
+        CalendarRef    => \$Calendar,
+        BeginDate      => $date->strftime("%F"),
+        EndDate        => $end->strftime("%F"),
+        SavedSearchObj => $SavedSearchObj,
+    );
 }
 
 my $BaseURL;

share/html/Search/Elements/CalendarEvent

@@ -104,7 +104,7 @@ data-object="<% $Object->Type %>-<% $Object->id %>"
 
 % if ( $first_day_of_the_event || $DayOfWeek eq 1 ) {
    hx-get="<% RT->Config->Get("WebPath") . ( $session{CurrentUser}->Privileged ? '' : '/SelfService' ) %>/Helpers/CalendarEventInfo?<% QueryString( event => $Object->Type . '-' . $Object->id, SavedSearchId => $SavedSearchId, Format => $Format ) %>"
-   hx-trigger="mouseover once"
+   hx-trigger="calendar-hover once"
    hx-target="find .calendar-event-detail"
 % }
 >

share/static/css/elevator/calendar.css

@@ -192,16 +192,21 @@ table.rt-calendar .ticket-entry span.calendar-event-detail {
     overflow-wrap: break-word;
 }
 
-/* Position popup above when in bottom rows */
-table.rt-calendar tbody tr:last-child .ticket-entry span.calendar-event-detail,
-table.rt-calendar tbody tr:nth-last-child(2) .ticket-entry span.calendar-event-detail {
+/* Position popup above when JS determines there is insufficient space below */
+table.rt-calendar .ticket-entry span.calendar-event-detail.popup-above {
     top: auto;
     bottom: calc(100% - 2px);
     margin-top: 0;
     margin-bottom: 2px;
 }
 
-/* Create a hover bridge to prevent popup from disappearing */
+/* Position popup right-aligned when JS determines it would overflow the right edge */
+table.rt-calendar .ticket-entry span.calendar-event-detail.popup-right {
+    left: unset;
+    right: 0;
+}
+
+/* Create a hover bridge to prevent popup from disappearing when moving mouse into it */
 table.rt-calendar .ticket-entry span.calendar-event-detail::before {
     content: '';
     position: absolute;
@@ -213,8 +218,7 @@ table.rt-calendar .ticket-entry span.calendar-event-detail::before {
 }
 
 /* Hover bridge for upward-positioned popups */
-table.rt-calendar tbody tr:last-child .ticket-entry span.calendar-event-detail::before,
-table.rt-calendar tbody tr:nth-last-child(2) .ticket-entry span.calendar-event-detail::before {
+table.rt-calendar .ticket-entry span.calendar-event-detail.popup-above::before {
     top: auto;
     bottom: -6px;
 }
@@ -248,16 +252,6 @@ table.rt-calendar .ticket-entry span.calendar-event-detail:hover {
     display: block !important;
 }
 
-table.rt-calendar td.weekday-7 .ticket-entry:hover span.calendar-event-detail,
-table.rt-calendar td.weekday-7 .ticket-entry span.calendar-event-detail:hover,
-table.rt-calendar td.weekday-6 .ticket-entry:hover span.calendar-event-detail,
-table.rt-calendar td.weekday-6 .ticket-entry span.calendar-event-detail:hover,
-table.rt-calendar td.weekday-5 .ticket-entry:hover span.calendar-event-detail,
-table.rt-calendar td.weekday-5 .ticket-entry span.calendar-event-detail:hover {
-    left: unset;
-    right: 24px;
-}
-
 .event-icon {
     float: left;
     margin-right: 5px;

share/static/js/init.js

@@ -1,3 +1,11 @@
+document.addEventListener('htmx:afterSwap', function(evt) {
+    const popup = evt.detail.elt;
+    if (popup.classList && popup.classList.contains('calendar-event-detail')) {
+        const entry = popup.closest('.ticket-entry');
+        if (entry) positionCalendarPopup(entry);
+    }
+});
+
 document.addEventListener('htmx:configRequest', function(evt) {
     for ( const param in evt.detail.parameters ) {
         if ( evt.detail.parameters[param + 'Type'] === 'text/html' && RT.CKEditor.instances[param] ) {
@@ -873,6 +881,20 @@ document.addEventListener('htmx:load', function(evt) {
     }
 
     expandCalendar(elt);
+
+    // Delay calendar popup requests so that mousing across the calendar
+    // does not fire a request for every ticket the cursor passes over.
+    // Also calculate popup position from viewport bounds rather than
+    // relying on CSS row/column heuristics.
+    elt.querySelectorAll('.ticket-entry[hx-trigger]').forEach(function(el) {
+        el.addEventListener('mouseenter', function() {
+            positionCalendarPopup(el);
+            el._calendarHoverTimer = setTimeout(() => htmx.trigger(el, 'calendar-hover'), 200);
+        });
+        el.addEventListener('mouseleave', function() {
+            clearTimeout(el._calendarHoverTimer);
+        });
+    });
 });
 
 /* Load the owner dropdown when the user clicks the pencil in basics */

share/static/js/util.js

@@ -1761,6 +1761,17 @@ function submitInlineEdit(editor, cell) {
     htmx.trigger(editor.get(0), 'submit');
 };
 
+function positionCalendarPopup(entry) {
+    const popup = entry.querySelector('.calendar-event-detail');
+    if (!popup) return;
+
+    const rect = entry.getBoundingClientRect();
+    const popupWidth = 350; // matches CSS width
+
+    popup.classList.toggle('popup-above', window.innerHeight - rect.bottom < 250);
+    popup.classList.toggle('popup-right', window.innerWidth - rect.left < popupWidth);
+}
+
 // Override toggle so when user clicks the dropdown button, current value won't be cleared.
 (function () {
     var orig_toggle = jQuery.fn.combobox.Constructor.prototype.toggle;