Front end - The code

Add the plugin to a container (HTML tag, class or id).

Simple Calendar example

To display the booking calendar please use the following example:

$('#frontend').DOPFrontendBookingCalendarPRO();

Custom Calendar example

To display the booking calendar with custom settings please read the JSON section and use the following example:

$('#frontend').DOPFrontendBookingCalendarPRO({
    'ID': 1,
    'loadURL': 'dopbcp/php-database/load.php'
});

JSON

You can add the following options to the front end version of the plugin:

  • loadURL
    Default value: 'dopbcp/php-file/load.php'.
    URL from were JSON data is loaded.

  • sendURL
    Default value: 'dopbcp/php-file/send.php'.
    URL from were JSON reservation data is saved.

  • reinitialize
    Default value: false.
    reinitialize the calendar if already loaded.

  • calendar
    calendar contains 2 attributes: data and text

  • data
    data is used to change calendar configuration

  • bookingStop
    Default value: 0.
    Set the number of minutes before the booking is stopped in advance. For 1 hour you have 60 minutes, for 1 day you have 1440 minutes.

  • dateType
    Default value: 0.
    Select date format: 0 for American (mm dd, yyyy) or 1 for European (dd mm yyyy).

  • language
    Default value: en.
    Set your calendar language.

  • languages
    Default value: [].
    Set your calendar languages.

  • view
    Default value: false.
    Set true to display only booking information in calendar.

  • text
    text is used to change calendar texts

  • addMonth
    Default value: 'Add month view'.
    Add Month View button title (plus icon).

  • available
    Default value: 'available'.
    available text

  • availableMultiple
    Default value: 'available'.
    available multiple text

  • booked
    Default value: 'booked'.
    Booked Day text.

  • nextMonth
    Default value: 'Next month'.
    Next Month button title.

  • previousMonth
    Default value: 'Previous month'.
    Previous Month button title.

  • removeMonth
    Default value: 'Remove month view'.
    Remove Month View button title (minus icon).

  • unavailable
    Default value: 'unavailable'.
    Unavailable Day text.

  • currency
    currency contains 2 attributes: data and text.

  • data
    data is used to change currency configuration

  • code
    Default value: 'USD'.
    Set calendar currency.

  • position
    Default value: 'before'.
    Set your currency position.

  • sign
    Default value: '$'.
    Set your currency sign.

  • days
    days contains 2 attributes: data and text.

  • data
    data is used to change days configuration

  • available
    Default value: [true, true, true, true, true, true, true].
    Set available/unavailable days starting with Monday.

  • first
    Default value: 1.
    Set the first day of the week (1 = Monday, 2 = Tuesday, 3 = Wednesday, 4 = Thursday, 5 = Friday, 6 = Saturday, 7 = Sunday)

  • morningCheckOut
    Default value: false.
    This option enables "Check in" in the afternoon of first day and "Check out" in the morning of the day after last day.

  • multipleSelect
    Default value: true.
    Use Check in/Check out or select only one day.

  • text
    text is used to change days texts

  • names
    Default value: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'].
    Weekdays long names.

  • shortNames
    Default value: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'].
    Weekdays short names.

  • deposit
    deposit contains 2 attributes: data and text.

  • data
    data is used to change deposit configuration

  • deposit
    Default value: 0.
    Deposit amount.

  • type
    Default value: 'percent'.
    Deposit type can be percent or fixed.

  • text
    text is used to change deposit texts

  • discounts
    discounts contains 2 attributes: data and text.

  • data
    data is used to change discounts configuration

  • discount
    A discount item contains the data for a booked time lapse.

  • position
    Default value: '1'.
    Discount position

  • start_time_lapse
    Default value: '1'.
    Enter the number of days for the begining of the time lapse.

  • end_time_lapse
    Default value: '1'.
    Enter the number of days for the ending of the time lapse.

  • operation
    Default value: '-'.
    Set item price operation. You can add or subtract a value.

  • price
    Default value: '0'.
    Enter item price.

  • price_type
    Default value: 'percent'.
    Set item price type. It can be a fixed value or a percent from price.

  • price_by
    Default value: 'once'.
    Set item price by. The price can be calculated once or by day

  • translation
    Default value: 'New item'.
    Item label.

  • rules
    A discount item rule set the discounts for a specific time period.

  • position
    Default value: '1'.
    Rule position

  • start_date
    Default value: ''.
    Enter rule start date, when the discount item rule will start being used. Leave it blank to start today.

  • end_date
    Default value: ''.
    Enter rule end date, when the discount item rule will stop being used. Leave it blank for the rule to never finish.

  • operation
    Default value: '-'.
    Set rule price operation. You can add or subtract a value.

  • price
    Default value: '0'.
    Set rule price.

  • price_type
    Default value: 'percent'.
    Set rule price type. It can be a fixed value or a percent from price.

  • price_by
    Default value: 'once'.
    Sett rule price by. The price can be calculated once or by day.

  • text
    text is used to change discount texts

  • byDay
    Default value: 'day'.
    By day text

  • title
    Default value: 'Discount'.
    Discount title text

  • extras
    extras contains 2 attributes: data and text.

  • data
    data is used to change extras configuration

  • extra
    Add extra group

  • id
    Default value: '1'.
    Extras group id

  • position
    Default value: '1'.
    Extras group position

  • multiple_select
    Default value: false.
    Set true if you want to select multiple options from the Extras group.

  • required
    Default value: true.
    Set true if you want to be mandatory a selection from this Extras group.

  • translation
    Default value: ''.
    Change extras & services name.

  • group_items
    Add an item to your Extras group

  • id
    Default value: '1'.
    Item id.

  • group_id
    Default value: '1'.
    Item group id.

  • position
    Default value: '1'.
    Item position id.

  • operation
    Default value: '-'.
    Set the type of operation you apply.

  • price
    Default value: '0'.
    Set the price for the Item.

  • price_type
    Default value: 'fixed'.
    Set the type of price 'fixed' or 'percent'.

  • price_by
    Default value: 'once'.
    Set how to apply the price: Once or Per day.

  • translation
    Default value: ''.
    Set the label.

  • text
    text is used to change extras texts

  • byDay
    Default value: 'day'.
    By day text.

  • invalid
    Default value: 'Select an option from'.
    Error text.

  • title
    Default value: 'Extras'.
    Extras title text.

  • fees
    Taxes & Fees

  • data
    data is used to change fees configuration

  • fees
    Add taxes & fees

  • id
    Default value: '1'.
    Fee id.

  • name
    Default value: 'New Fee'.
    Fee name.

  • operation
    Default value: '+'.
    Set the type of the Tax/fee operation.

  • price
    Default value: '10'.
    Set the price.

  • price_type
    Default value: 'fixed'.
    Set the type of price, fixed or percent.

  • price_by
    Default value: 'once'.
    Set how the price is applied, Once or Per day.

  • included
    Default value: 'false'.
    Set true if the Tax/fee price is Included in the price.

  • extras
    Default value: 'true'.
    Set true if the Extra's prices be added in the calculations.

  • cart
    Default value: 'false'.
    Set true if the Fees be displayed in the cart's total.

  • translation
    Default value: 'New tax / fee label'.
    Fee label

  • text
    text is used to change fees texts

  • byDay
    Default value: 'day'.
    By day text.

  • included
    Default value: 'Included in price'.
    'Included in price' text.

  • title
    Default value: 'Taxes & fees'.
    'Taxes & fees' title text.

  • form
    Form

  • data
    data is used to change form configuration

  • form
    Form fields

  • id
    Default value: '1'.
    Field id

  • form_id
    Default value: '1'.
    Form id

  • type
    Default value: 'text'.
    Field type

  • position
    Default value: '1'.
    Field position

  • multiple_select
    Default value: 'false'.
    Set true if you want to select multiple options from this field.

  • allowed_characters
    Default value: ''.
    Enter the caracters allowed in this field. Leave it blank if all characters are allowed.

  • size
    Default value: '0'.
    Enter the maximum number of characters allowed. Leave it blank for unlimited.

  • is_email
    Default value: 'false'.
    Set true if you want this field to be verified if an email has been added or not.

  • required
    Default value: 'true'.
    Set true if you want the field to be mandatory.

  • translation
    Default value: 'New Field'.
    Field label

  • text
    text is used to change form texts

  • checked
    Default value: 'Checked'.
    Checked text

  • invalidEmail
    Default value: 'is invalid. Please enter a valid email.'.
    Invalid email text

  • required
    Default value: 'is required.'.
    Is required text

  • title
    Default value: 'Contact information'.
    form title text

  • unchecked
    Default value: 'Unchecked'.
    unchecked text

  • ID
    Default value: 0.
    Calendar ID. Change it if you have more then one calendar.

  • months
    Calendar months.

  • data
    data is used to change months configuration

  • no
    Default value: 1.
    Set the number of months initialy displayed.

  • text
    text is used to change months texts

  • names
    Default value: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'].
    Months long names.

  • shortNames
    Default value: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'].
    Months short names.

  • order
    Order.

  • data
    data is used to change order configuration

  • redirect
    Default value: ''.
    Set the link where want to be redirected after booking is done. Leave it empty if you don't redirect.

  • terms
    Default value: false.
    Set true if you want to enable terms and conditions.

  • termsLink
    Default value: ''.
    Set the terms and condition link. Leave it empty if you don't want terms and condition.

  • text
    text is used to change order texts

  • book
    Default value: 'Book now'.
    book button

  • success
    Default value: 'Reservation has been added!'.
    Reservation success message

  • terms
    Default value: 'I accept to agree to the Terms & Conditions.'.
    Terms and conditions label

  • termsInvalid
    Default value: 'You must agree with our Terms & Conditions to continue.'.
    Terms & condtions - error message

  • title
    Default value: 'Order'.
    Order title

  • unavailable
    Default value: 'The period you selected is not available anymore. The calendar will refresh to update the schedule.'.
    Error message for unavailable selected period

  • reservation
    Reservation.

  • text
    text is used to change reservation texts

  • price
    Default value: 'Price'.
    Reservation price text

  • priceChange
    Default value: 'Price change'.
    Reservation Price change text

  • priceTotal
    Default value: 'Total'.
    Reservation Total text

  • selectDays
    Default value: 'Please select the days from calendar.'.
    Reservation select days text

  • title
    Default value: 'Reservation'.
    Reservation title

  • titleDetails
    Default value: 'Details'.
    Reservation Details title

  • search
    Search.

  • text
    text is used to change search texts

  • noItems
    Default value: 'No. book items'.
    No. book items text

  • noServices
    Default value: 'There are no services available for the period you selected.'.
    No services available text

  • noServicesSplitGroup
    Default value: 'You cannot add divided groups to a reservation.'.
    No split group text

  • title
    Default value: 'Search.'.
    Search title.

  • sidebar
    Sidebar.

  • data
    data is used to change sidebar configuration

  • noItems
    Default value: true.
    Set true to display number of items you want to book in front end.

  • positions
    positions is used to display position for : search, extras, reservation, cart, form, order

  • search
    Search position in sidebar

  • column
    Default value: '1'.
    Set Column position.Can be: 1 or 2

  • row
    Default value: '1'.
    Set Row position.Can be: 1,2,3,4,5,6,7

  • extras
    Extras position in sidebar

  • column
    Default value: '1'.
    Set Column position.Can be: 1 or 2

  • row
    Default value: '2'.
    Set Row position.Can be: 1,2,3,4,5,6,7

  • reservation
    Reservation position in sidebar

  • column
    Default value: '1'.
    Set Column position.Can be: 1 or 2

  • row
    Default value: '4'.
    Set Row position.Can be: 1,2,3,4,5,6,7

  • cart
    Cart position in sidebar

  • column
    Default value: '1'.
    Set Column position.Can be: 1 or 2

  • row
    Default value: '5'.
    Set Row position.Can be: 1,2,3,4,5,6,7

  • form
    Form position in sidebar

  • column
    Default value: '1'.
    Set Column position.Can be: 1 or 2

  • row
    Default value: '5'.
    Set Row position.Can be: 1,2,3,4,5,6,7

  • form
    Form position in sidebar

  • column
    Default value: '1'.
    Set Column position.Can be: 1 or 2

  • row
    Default value: '6'.
    Set Row position.Can be: 1,2,3,4,5,6,7

  • order
    Order position in sidebar

  • column
    Default value: '1'.
    Set Column position.Can be: 1 or 2

  • row
    Default value: '7'.
    Set Row position.Can be: 1,2,3,4,5,6,7