Development version 4.01.01

Send dates to a separate reservation form on your page:

Front-end features:

• Simple installation - the calendar is loaded by a single line of JavaScript (see below)
• Interactive date range selection to send dates to your reservations form if required.
• Self-contained with no external dependencies.
• No external dependencies or JavaScript libraries.
• Does not use images or sprites.
• Simple CSS - colors can be defined via admin panel.
• Responsive:
  • The code automatically calculates the number of months to show according to the browser window width. (You can override this by defining this manually to show the number of months that you want)
  • On window resize the code will re-calculate the number of months, remembering the first month currently defined.

Back-end features

• Reduced Vanilla JavaScript (no libraries).
• Interactive styling tool to define the calendar design & colors.
• Date range selection to mark dates as unavailable and save basic booking data (optional).
• Unlimited admin users.
• Unlimited number of calendar items.
• Unlimited languages.
• Translations stored in database.
• Password reminder via email.

How to implement the calendar

1. Add JavaScript tag
2. Add parameters to script tag:
   • ac-container [required] : ID of DOM element where calendar is to be loaded.
   • ac-item [required] : ID of calendar item to show availability.
   • ac-lang [optional - default "en"] : language to show calendar.
   • ac-months [optional - default "0"] : fixed number of months to show. Default will be responsive
   • ac-width [optional - default "300"] : minimum width of each month.
   • ac-dateStart [optional] :ID of the start date form field in your reservations form.
   • ac-dateEnd [optional] : ID of the end date form field in your reservations form.

Single line of code to include the calendar:

	<script src="ac-assets/ac-functions.js" id="ac-cal" ac-container="my-calendar" ac-item="1" ac-dateStart="date-from" ac-dateEnd="date-to"></script>