update
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -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;
|
||||
|
||||
@@ -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
|
||||
}
|
||||
};
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user