This commit is contained in:
2026-05-06 00:18:37 +02:00
parent 09e0ce8dc0
commit ea77c8ea35
25 changed files with 1996 additions and 34 deletions

File diff suppressed because one or more lines are too long

View File

@@ -190,9 +190,14 @@
opacity: 1;
.fc-daygrid-day-number {
color: #fff;
color: #6c757d;
}
}
.fc-daygrid-day-number,
a.fc-daygrid-day-number {
color: #021526 !important;
font-weight: 600;
}
.fc-daygrid-day {
&:hover {
background: #f8f9fa;
@@ -233,6 +238,31 @@
.fc-bg-event.yacht-day-blocked {
opacity: 0.92 !important;
}
// Half-day rendering for first / last day of a booking or blockade.
// Skos 45°. Pierwszy dzień: trójkąt bottom-left = wolny, top-right = zajęty (odbiór po południu).
// Ostatni dzień: trójkąt top-left = zajęty, bottom-right = wolny (zwrot rano).
.fc-bg-event.yacht-day-booked-start,
.fc-bg-event.yacht-day-blocked-start {
background: linear-gradient(
135deg,
var(--yacht-available-bg, #f5f9ff) 0%,
var(--yacht-available-bg, #f5f9ff) 50%,
var(--yacht-booked-bg, #bc1834) 50%,
var(--yacht-booked-bg, #bc1834) 100%
) !important;
opacity: 0.92 !important;
}
.fc-bg-event.yacht-day-booked-end,
.fc-bg-event.yacht-day-blocked-end {
background: linear-gradient(
135deg,
var(--yacht-booked-bg, #bc1834) 0%,
var(--yacht-booked-bg, #bc1834) 50%,
var(--yacht-available-bg, #f5f9ff) 50%,
var(--yacht-available-bg, #f5f9ff) 100%
) !important;
opacity: 0.92 !important;
}
}
.yacht-day-available {
cursor: pointer;
@@ -679,10 +709,31 @@ body .fc .fc-day-other .fc-daygrid-day-top {
opacity: 1;
}
// .fc-theme-standard td,
// .fc-theme-standard th {
// border: 1px solid hsla(0, 0%, 100%, 0.2);
// }
.yacht-calendar {
--fc-border-color: #0e2036;
.fc {
--fc-border-color: #0e2036;
}
.fc-theme-standard td,
.fc-theme-standard th,
.fc-theme-standard .fc-scrollgrid,
.fc-scrollgrid,
.fc-scrollgrid-section > *,
.fc-daygrid-day,
.fc-col-header-cell {
border-color: #0e2036 !important;
}
.fc-col-header-cell {
background: #0e2036;
color: #fff;
}
.fc-col-header-cell .fc-col-header-cell-cushion {
color: #fff;
font-weight: 600;
padding: 8px 4px;
}
}
table {
margin-bottom: 0 !important;

View File

@@ -22,8 +22,14 @@
}
return color;
};
const availableBg = normalizeColor($wrapper.data('available-bg'), '#35b56a', '#d4edda');
const bookedBg = normalizeColor($wrapper.data('booked-bg'), '#e53935', '#f8d7da');
const availableBg = normalizeColor($wrapper.data('available-bg'), '#f5f9ff', '#d4edda');
const bookedBg = normalizeColor($wrapper.data('booked-bg'), '#bc1834', '#f8d7da');
// Expose colors as CSS custom properties so half-day gradients can read them.
$wrapper.css({
'--yacht-available-bg': availableBg,
'--yacht-booked-bg': bookedBg
});
const yachtItems = yachtsData ? JSON.parse(yachtsData) : [];
const yachtMap = {};
const state = {
@@ -165,16 +171,58 @@
end: endDate
},
success: function(data) {
// Index by date so we can probe neighbours for edge detection.
const byDate = {};
data.forEach(function(day) {
byDate[day.date] = day;
});
function shiftDate(dateString, deltaDays) {
const d = new Date(dateString + 'T00:00:00');
d.setDate(d.getDate() + deltaDays);
return formatDate(d);
}
function sameSegment(a, b) {
if (!a || !b) return false;
if (a.status !== b.status) return false;
// Different bookings (or booking vs blocked) break the segment.
const aId = a.booking_id || null;
const bId = b.booking_id || null;
return aId === bId;
}
const events = data.map(function(day) {
const status = day.status;
const classes = ['yacht-day-' + status];
if (status !== 'available') {
const prev = byDate[shiftDate(day.date, -1)];
const next = byDate[shiftDate(day.date, +1)];
const isStart = !sameSegment(day, prev);
const isEnd = !sameSegment(day, next);
if (isStart && isEnd) {
// Single-day blockade — render as full booked, no half.
classes.push('yacht-day-' + status + '-single');
} else if (isStart) {
classes.push('yacht-day-' + status + '-start');
} else if (isEnd) {
classes.push('yacht-day-' + status + '-end');
} else {
classes.push('yacht-day-' + status + '-mid');
}
}
return {
id: day.date,
start: day.date,
allDay: true,
display: 'background',
backgroundColor: day.status === 'available' ? availableBg : bookedBg,
classNames: ['yacht-day-' + day.status],
backgroundColor: status === 'available' ? availableBg : bookedBg,
classNames: classes,
extendedProps: {
status: day.status,
status: status,
booking_id: day.booking_id || null
}
};

View File

@@ -219,7 +219,7 @@ class Calendar_Widget extends Widget_Base {
array(
'label' => esc_html__( 'Kolor główny', 'yacht-booking' ),
'type' => Controls_Manager::COLOR,
'default' => '#2271b1',
'default' => '#0e2036',
)
);
@@ -228,7 +228,7 @@ class Calendar_Widget extends Widget_Base {
array(
'label' => esc_html__( 'Kolor dni dostępnych', 'yacht-booking' ),
'type' => Controls_Manager::COLOR,
'default' => '#35b56a',
'default' => '#f5f9ff',
)
);
@@ -237,7 +237,7 @@ class Calendar_Widget extends Widget_Base {
array(
'label' => esc_html__( 'Kolor dni zajętych', 'yacht-booking' ),
'type' => Controls_Manager::COLOR,
'default' => '#e53935',
'default' => '#bc1834',
)
);
@@ -269,9 +269,9 @@ class Calendar_Widget extends Widget_Base {
$calendar_id = 'yacht-calendar-' . $this->get_id();
$raw_height = ! empty( $settings['calendar_height']['size'] ) ? (int) $settings['calendar_height']['size'] : 600;
$height = $raw_height;
$primary_color = ! empty( $settings['primary_color'] ) ? $settings['primary_color'] : '#2271b1';
$available_bg = ! empty( $settings['available_color'] ) ? $settings['available_color'] : '#35b56a';
$booked_bg = ! empty( $settings['booked_color'] ) ? $settings['booked_color'] : '#e53935';
$primary_color = ! empty( $settings['primary_color'] ) ? $settings['primary_color'] : '#0e2036';
$available_bg = ! empty( $settings['available_color'] ) ? $settings['available_color'] : '#f5f9ff';
$booked_bg = ! empty( $settings['booked_color'] ) ? $settings['booked_color'] : '#bc1834';
$terms_url = Settings::get_terms_page_url();
?>
@@ -563,11 +563,15 @@ class Calendar_Widget extends Widget_Base {
</div>
<div class="yacht-calendar-legend">
<span class="yacht-legend-item">
<span class="yacht-legend-swatch" style="background-color: #35b56a;"></span>
<span class="yacht-legend-swatch" style="background-color: <?php echo esc_attr( $available_bg ); ?>;"></span>
<?php esc_html_e( 'Dostępny', 'yacht-booking' ); ?>
</span>
<span class="yacht-legend-item">
<span class="yacht-legend-swatch" style="background-color: #e53935;"></span>
<span class="yacht-legend-swatch" style="background: linear-gradient(135deg, <?php echo esc_attr( $available_bg ); ?> 0%, <?php echo esc_attr( $available_bg ); ?> 50%, <?php echo esc_attr( $booked_bg ); ?> 50%, <?php echo esc_attr( $booked_bg ); ?> 100%);"></span>
<?php esc_html_e( 'Dzień odbioru / zwrotu', 'yacht-booking' ); ?>
</span>
<span class="yacht-legend-item">
<span class="yacht-legend-swatch" style="background-color: <?php echo esc_attr( $booked_bg ); ?>;"></span>
<?php esc_html_e( 'Zajęty / zablokowany', 'yacht-booking' ); ?>
</span>
</div>