nodebb-plugin-onekite-calendar 1.0.9 → 1.0.11

package/lib/api.js

@@ -134,13 +134,21 @@ function formatFR(tsOrIso) {
 }
 
 function buildHelloAssoItemName(baseLabel, itemNames, start, end) {
-  const base = String(baseLabel || 'Réservation matériel Onekite').trim();
+  const base = String(baseLabel || '').trim();
   const items = Array.isArray(itemNames) ? itemNames.map((s) => String(s || '').trim()).filter(Boolean) : [];
-  const range = (start && end) ? `Du ${formatFR(start)} au ${formatFR(end)}` : '';
-  const lines = [base];
-  items.forEach((it) => lines.push(`• ${it}`));
-  if (range) lines.push(range);
-  let out = lines.join('\n').trim();
+  const range = (start && end) ? ('Du ' + formatFR(start) + ' au ' + formatFR(end)) : '';
+
+  // IMPORTANT:
+  // On the public HelloAsso checkout page, line breaks are not always rendered consistently.
+  // Build a single-line label using bullet separators.
+  let out = '';
+  if (base) out += base;
+  if (items.length) out += (out ? ' — ' : '') + items.map((it) => '• ' + it).join(' ');
+  if (range) out += (out ? ' — ' : '') + range;
+
+  out = String(out || '').trim();
+  if (!out) out = 'Réservation matériel';
+
   // HelloAsso constraint: itemName max 250 chars
   if (out.length > 250) {
     out = out.slice(0, 249).trimEnd() + '…';
@@ -812,7 +820,7 @@ api.approveReservation = async function (req, res) {
       // Can be overridden via ACP setting `helloassoCallbackUrl`.
       callbackUrl: normalizeReturnUrl(meta),
       webhookUrl: normalizeCallbackUrl(settings2.helloassoCallbackUrl, meta),
-      itemName: buildHelloAssoItemName('Réservation matériel Onekite', r.itemNames || (r.itemName ? [r.itemName] : []), r.start, r.end),
+      itemName: buildHelloAssoItemName('', r.itemNames || (r.itemName ? [r.itemName] : []), r.start, r.end),
       containsDonation: false,
       metadata: {
         reservationId: String(rid),

package/lib/widgets.js

@@ -137,9 +137,19 @@ widgets.renderTwoWeeksWidget = async function (data) {
       tip.style.display = 'none';
     }
 
-    document.addEventListener('click', (e) => {
+    // Client-side escaping (the server-side helper is not in scope here)
+    function escapeHtml(s) {
+      return String(s || '')
+        .replace(/&/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#39;');
+    }
+
+    document.addEventListener('pointerdown', (e) => {
       // Close when clicking outside an event
-      if (!e.target || !e.target.closest || !e.target.closest('.fc-event')) {
+      if (!e.target || !e.target.closest || (!e.target.closest('.fc-event') && !e.target.closest('.onekite-cal-tooltip'))) {
         hideTip();
       }
     }, { passive: true });
@@ -164,10 +174,51 @@ widgets.renderTwoWeeksWidget = async function (data) {
       },
       navLinks: false,
       eventTimeFormat: { hour: '2-digit', minute: '2-digit', hour12: false },
-      // Render as a colored dot (like FullCalendar list dots)
+      // Force day number to be numeric only (avoid '1 janvier' style labels)
+      dayCellContent: function(arg) {
+        try {
+          const t = String(arg.dayNumberText || '');
+          const m = t.match(/^\d+/);
+          return { html: m ? m[0] : t };
+        } catch (e) {
+          return { html: String(arg.dayNumberText || '') };
+        }
+      },
+      eventClassNames: function(arg) {
+        try {
+          const ev = arg && arg.event;
+          if (!ev) return ['onekite-singleday'];
+          if (ev.extendedProps && (ev.extendedProps.multiDay === true || ev.extendedProps.days > 1)) return ['onekite-multiday'];
+          if (ev.start && ev.end) {
+            const diff = (new Date(ev.end)).getTime() - (new Date(ev.start)).getTime();
+            return [diff > 86400000 ? 'onekite-multiday' : 'onekite-singleday'];
+          }
+        } catch (e) {}
+        return ['onekite-singleday'];
+      },
+      // Render: dot for single-day, pill for multi-day
       eventContent: function(arg) {
-        const bg = (arg.event.backgroundColor || (arg.event.extendedProps && arg.event.extendedProps.backgroundColor) || '').trim();
-        const border = (arg.event.borderColor || '').trim();
+        const ev = arg && arg.event;
+        const isMulti = (function(){
+          try {
+            if (!ev || !ev.start || !ev.end) return false;
+            if (ev.extendedProps && (ev.extendedProps.multiDay === true || ev.extendedProps.days > 1)) return true;
+            const s = new Date(ev.start);
+            const e = new Date(ev.end);
+            const diff = e.getTime() - s.getTime();
+            return diff > 86400000; // strictly more than 1 day
+          } catch (e) { return false; }
+        })();
+
+        if (isMulti) {
+          const spacer = document.createElement('span');
+          spacer.className = 'onekite-pill-spacer';
+          spacer.appendChild(document.createTextNode('\u00A0'));
+          return { domNodes: [spacer] };
+        }
+
+        const bg = (ev.backgroundColor || (ev.extendedProps && ev.extendedProps.backgroundColor) || '').trim();
+        const border = (ev.borderColor || '').trim();
         const color = bg || border || '#3788d8';
         const wrap = document.createElement('span');
         wrap.className = 'onekite-dot-wrap';
@@ -188,6 +239,21 @@ widgets.renderTwoWeeksWidget = async function (data) {
       eventDidMount: function(info) {
         try {
           const ev = info.event;
+          // Improve centering for single-day dots by centering the harness,
+          // same visual behavior as rentals.
+          try {
+            const cls = (info.el && info.el.classList) ? info.el.classList : null;
+            const isSingle = cls && cls.contains('onekite-singleday');
+            const harness = info.el && info.el.closest ? info.el.closest('.fc-daygrid-event-harness') : null;
+            if (harness && harness.classList) {
+              if (isSingle) {
+                harness.classList.add('onekite-harness-dot');
+              } else {
+                harness.classList.remove('onekite-harness-dot');
+              }
+            }
+          } catch (e) {}
+
           const ep = ev.extendedProps || {};
           const title = (ep.itemNameLine || ep.title || ev.title || '').toString();
           const status = (ep.status || ep.type || '').toString();
@@ -202,22 +268,36 @@ widgets.renderTwoWeeksWidget = async function (data) {
             (status ? ('<div style="opacity:.75; margin-top:2px; font-size:.85em;">' + escapeHtml(status) + '</div>') : '');
 
           // Hover (desktop)
-          info.el.addEventListener('mouseenter', (e) => {
+          info.el.addEventListener('pointerenter', () => {
+            // Only show on devices that actually hover
+            if (window.matchMedia && window.matchMedia('(hover: hover)').matches === false) return;
             setTipContent(html);
             const rect = info.el.getBoundingClientRect();
-            showTipAt(rect.left + window.scrollX, rect.top + window.scrollY);
+            showTipAt(rect.left + rect.width / 2 + window.scrollX, rect.top + window.scrollY);
           }, { passive: true });
-          info.el.addEventListener('mouseleave', hideTip, { passive: true });
+          info.el.addEventListener('pointerleave', hideTip, { passive: true });
 
-          // Tap/click (mobile)
-          info.el.addEventListener('click', (e) => {
-            e.preventDefault();
-            e.stopPropagation();
+          // Tap (mobile) / click (fallback)
+          const openTipFromPoint = (pt) => {
             setTipContent(html);
-            const pt = (e.touches && e.touches[0]) ? e.touches[0] : e;
             showTipAt((pt.clientX || 0) + window.scrollX, (pt.clientY || 0) + window.scrollY);
+          };
+
+          info.el.addEventListener('pointerdown', (e) => {
+            // On touch devices, FullCalendar can swallow click events during swipe;
+            // pointerdown is more reliable.
+            if (e && e.preventDefault) e.preventDefault();
+            if (e && e.stopPropagation) e.stopPropagation();
+            openTipFromPoint(e);
           });
-        } catch (e) {}
+
+          info.el.addEventListener('touchstart', (e) => {
+            const t = e.touches && e.touches[0];
+            if (!t) return;
+            if (e && e.stopPropagation) e.stopPropagation();
+            openTipFromPoint(t);
+          }, { passive: true });
+} catch (e) {}
       },
     });
 
@@ -261,11 +341,43 @@ widgets.renderTwoWeeksWidget = async function (data) {
   .onekite-twoweeks .fc .fc-button { padding: .2rem .35rem; font-size: .75rem; }
   .onekite-twoweeks .fc .fc-daygrid-day-number { font-size: .75rem; padding: 2px; }
   .onekite-twoweeks .fc .fc-col-header-cell-cushion { font-size: .75rem; }
-  .onekite-twoweeks .fc .fc-event { background: transparent; border: none; }
+
+  /* Single-day: show only a dot */
+  .onekite-twoweeks .fc .fc-event.onekite-singleday { background: transparent !important; border: none !important; }
+  .onekite-twoweeks .fc .fc-daygrid-event.onekite-singleday,
+  .onekite-twoweeks .fc .fc-daygrid-block-event.onekite-singleday {
+    background: transparent !important;
+    border: none !important;
+    box-shadow: none !important;
+  }
+  .onekite-twoweeks .fc .fc-daygrid-block-event.onekite-singleday .fc-event-main { padding: 0 !important; }
+
+  /* Multi-day: keep FullCalendar bar, but hide text and make it a pill */
+  .onekite-twoweeks .fc .fc-event.onekite-multiday {
+    border-radius: 999px !important;
+    overflow: hidden;
+  }
+  .onekite-twoweeks .fc .fc-daygrid-event.onekite-multiday,
+  .onekite-twoweeks .fc .fc-daygrid-block-event.onekite-multiday {
+    border-radius: 999px !important;
+    box-shadow: none !important;
+  }
+  .onekite-twoweeks .fc .fc-event.onekite-multiday .fc-event-main { padding: 0 !important; }
+  .onekite-twoweeks .fc .fc-event.onekite-multiday .fc-event-title,
+  .onekite-twoweeks .fc .fc-event.onekite-multiday .fc-event-time { display:none !important; }
+
+  .onekite-twoweeks .fc .fc-daygrid-event-harness { margin-top: 2px; }
+  /* Center single-day dots inside the day cell (match rentals) */
+  .onekite-twoweeks .fc .fc-daygrid-event-harness.onekite-harness-dot {
+    display: flex;
+    justify-content: center;
+  }
+  .onekite-twoweeks .fc .fc-daygrid-event { padding: 0 !important; }
   .onekite-twoweeks .fc .fc-event-main { color: inherit; }
   .onekite-twoweeks .fc .fc-event-title { display:none; }
   .onekite-dot-wrap { display:flex; align-items:center; justify-content:center; width: 100%; }
   .onekite-dot { width: 10px; height: 10px; border-radius: 999px; display:inline-block; }
+  .onekite-pill-spacer { display:block; height: 10px; line-height: 10px; }
   .onekite-cal-tooltip {
     position: absolute;
     z-index: 99999;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-onekite-calendar",
-  "version": "1.0.9",
+  "version": "1.0.11",
   "description": "FullCalendar-based equipment reservation workflow with admin approval & HelloAsso payment for NodeBB",
   "main": "library.js",
   "license": "MIT",

package/plugin.json

@@ -39,5 +39,5 @@
   "acpScripts": [
     "public/admin.js"
   ],
-  "version": "1.0.9"
+  "version": "1.0.11"
 }