Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Use CMB2 to block out dates in DatePicker - Create an options page with checkboxes to disable dates in DatePicker. https://www.damiencarbery.com/2020/04/use-cmb2-to-block-out-dates-in-datepicker/
<?php
/*
Plugin Name: Use CMB2 to block out dates in DatePicker
Plugin URI: https://www.damiencarbery.com/2020/04/use-cmb2-to-block-out-dates-in-datepicker/
Description: Create an options page with checkboxes to disable dates in DatePicker.
Author: Damien Carbery
Version: 0.1
*/
add_action( 'cmb2_admin_init', 'sab_delivery_dates_availability' );
function sab_delivery_dates_availability() {
$cmb_options = new_cmb2_box( array(
'id' => 'delivery_dates',
'title' => 'Delivery Dates Availability',
'object_types' => array( 'options-page' ),
'option_key' => 'delivery_dates', // The option key and admin menu page slug.
'icon_url' => 'dashicons-calendar-alt', // Menu icon. Only applicable if 'parent_slug' is left empty.
'capability' => 'edit_posts', // Capability required to view this options page.
'position' => 2, // Menu position. Only applicable if 'parent_slug' is left empty.
'save_button' => 'Save Dates',
) );
// Create the checkbox list of dates.
// The index is the date (dd-mm-yyyy format) and the checkbox text is a readable date for useability.
$today = time();
$dates_array = array();
$secs_in_a_day = 60 * 60 * 24;
for ( $i = 0; $i < 7; $i++ ) {
$time = $today + ( $i * $secs_in_a_day ); // Add $i days to time.
$date_info = getdate( $time );
// Index is dd-mm-yyyy (for DateTimePicker date exclusion) and then the readable date.
$date_index = sprintf( '%02d-%02d-%d', $date_info['mday'], $date_info['mon'], $date_info['year'] );
$dates_array[ $date_index ] = sprintf( '%s %d %s %d', $date_info['weekday'], $date_info['mday'], $date_info['month'], $date_info['year'] );
}
$cmb_options->add_field( array(
'desc' => 'Check dates that do <strong>NOT</strong> have delivery slots available.',
'type' => 'multicheck',
'id' => 'dates',
'select_all_button' => false, // Exclude the "Select All" button.
'options' => $dates_array,
) );
}
// Adjust DateTimePicker settings - Add the list of booked out delivery dates to the Checkout page.
// This JavaScript array will be read by the datetimepicker to disable choosing those dates.
// DateTimePicker Docs: https://xdsoft.net/jqplugins/datetimepicker/
add_action( 'wp_footer', 'sab_datetimepicker_settings' );
function sab_datetimepicker_settings() {
if ( is_checkout() ) {
$delivery_dates = get_option( 'delivery_dates' );
if ( array_key_exists( 'dates', $delivery_dates ) ) { // Verify that some dates set.
$today = time();
$secs_in_a_day = 60 * 60 * 24;
for ( $i = 0; $i < 7; $i++ ) {
$time = $today + ( $i * $secs_in_a_day ); // Add $i days to time.
$date_info = getdate( $time );
/*
// This is only for my client's site - he doesn't do deliveries on Mondays or Tuesdays so always block them.
// If it is a Monday or Tuesday add that date and the following 6 Mondays and Tuesdays.
if ( ( 1 == $date_info[ 'wday' ] ) || ( 2 == $date_info[ 'wday' ] ) ) {
for ( $j = 0; $j < 6; $j++ ) {
$mon_tues = $time + ( $j * 7 * $secs_in_a_day ); // Add $j weeks to time.
$date_info = getdate( $mon_tues );
$date_index = sprintf( '%02d-%02d-%d', $date_info['mday'], $date_info['mon'], $date_info['year'] );
$delivery_dates[ 'dates' ][] = $date_index;
}
}
*/
}
$booked_out_dates = '["' . implode( '", "', $delivery_dates[ 'dates' ] ) . '" ]';
}
else {
// If no dates excluded then create an empty list so DateTimePicker doesn't bork.
$booked_out_dates = '[]';
}
?>
<script>
jQuery(function( $ ){
if (jQuery('.pcfme-datepicker-disable-past').length) {
var dateToday = new Date();
var booked_out_dates = <?php echo $booked_out_dates; ?>;
var twoDays = new Date( dateToday.getTime() + 2 * 24 * 60 * 60 * 1000 );
//var oneMonth = new Date( dateToday.getTime() + 30 * 24 * 60 * 60 * 1000 );
jQuery( ".pcfme-datepicker-disable-past" ).datetimepicker({disabledDates: booked_out_dates, formatDate: 'd-m-Y'});
// Set first selectable date for two days time; /*optional: max future up to 30 days away.*/
jQuery( ".pcfme-datepicker-disable-past" ).datetimepicker({minDate: twoDays/*, maxDate: oneMonth*/});
}
});
</script>
<?php
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment