I. Front-end layouts
3. Responsive & Smart layout
Some years ago there was a clear differentiation between desktop and mobile.
The introduction of tablets and other new web devices brings the challenge of designing for more resolutions and devices than ever before. Fortunately, responsive web design has emerged as a robust solution. OS Services Booking uses Bootstrap twitter library to make the responsive layouts. This feature
provides the user with best viewing experience of a website across devices of various sizes - See more at:
http://www.w3resource.com/twitter-bootstrap/responsive-design.php#sthash.Zk2yalKi.dpuf
We decided to use Ajax technology for OS Services Booking with the reason the customers won’t waste the time (loading pages) for checking available services and employees on the time they need. The component has the tidy and logical layout that makes the customer feel comfortable when they use your services booking system. This point is very important with your business.
Development Guide
As a developer you are tasked with altering or extending the functionality of OS Services Booking. You will be proficient in a range of programming languages, including PHP, but may be less familiar with such things as JavaScript or CSS. If you are new to Joomla! You will need information about the OS Services Booking and how to use it.
List of source code folders at the front-end of OS Services Booking, you can find the source code of front-end of OS Services Booking at:
Root > components > com_osservicesbooking Important folders:
classes: Contains all the server-side PHP code used for the functionality of OS Services Booking.
helpers: Contains all the server-side PHP code used for the library with all core functions for the functionality of OS Services Booking
plugins: Contains all the server-side PHP code used for payment plugins
js: Contains all Javascript code used for checking, validator, ajax methods v.v.
style: Contains all Stylesheet used for OS Services Booking. OSB uses Bootstrap library so, there is folder called :Bootstrap in this directory. And you can also notice on file style.css. This file is used to define all the css style for the html elements of OS Services Booking
views:Contains all layouts of OS Services Booking
Release News
Version 2.3.8 (July 2015) + New features
1. Add new time slots theme: Simple time slots theme
2. Moving Service information into top part of booking table page when having 1 service
3. Option to change tabs to dropdown select list 4. Add Services layout with Grid and List view 5. Add Grid view for Category layout
6. Add Grid view for Employee layout
7. Add Income Graph at Dashboard of OS Services Booking (Back-end side)
8. Add feature to check Latest OS Services Booking version.
Version 2.3.7 (July 2015)
1. Add configure option to hide Employee name 2. Change JS alert to jQuery dialog
3. Update User Name and Email when adding order 4. Duplicate Services, Employees
Version 2.3.6 (June 2015) + New features
- Flexible Service Price: From this version, you are able to override Service’s price by dates in week or special date periods
- Early Bird Discount: In each Service, you can setup the Early Bird discount (percentages or fixed amount) when customer make booking request early.
- Discount by number Timeslots added: With Custom Time Slots Service, you can setup the discount (percentages or fixed amount) when customer add more than X seat into cart per session.
- Add custom break time for employee on specific Service: In Previous version, administrator only can add the Break Time for one employee on Service by dates in week (Monday to Sunday). But from this version, administrator can add custom break time for specific date too.
- New Order status: From this version, each order will have statuses:
Pending, Completed, Canceled, Attended, Timeout, Refunded, Declined.
Administrator also is able to change Order status in Orders list instead of going to Order details as previous version. Note: The Refunded is just Order status, OS Services Booking doesn’t process refund the money back to customer.
- New Configure options: The Configuration page of OS Services Booking has been re-sorted to make it become more reasonable. We also add new configure options to make OSB become more flexible. Here are some new important configure options added 2.3.6
1. Show Calendar box at Confirmation page
2. Select Joomla user group which can bypass the Payment step (suitable in case administrator make the booking request at front-end)
3. Turn on/off Early Bird Discount
4. Turn on/off Showing “Number time slots request” input box in Booking table page. Set default is 1.
5. Hide Tab Service/ Employee when there is only one item available 6. Layout configure options
- Content plugin: Allow you to add booking table page into one Article.
Version 2.3.5 (May 2015) + New features:
- Ajax loading: In previous version, in the first time loading, OS Services Booking must prepare data for a large amount of dates in several years.
And this work makes the loading time of component become longer. To solve this problem, from version 2.3.5, we decided to change the normal loading method to Ajax method. So that, on one time loading, OS
Services Booking will only process data for dates of one specific month.
And each time customer clicking on Next/ Previous months, Ajax method will be called to process available status of dates in those months. With this improvement, we are confident about the loading speed of OSB - Prevent double mouse-click: In Previous version, in booking table page, if
customer double click on button Add to cart, OS Services Booking will add 2 time slots (with the same Start/end Time) into customer’s cart. So that, this is the bug of component. To solve this problem, we add feature to disable Double Click on Add to cart button to prevent double time slots in the Cart. In Confirmation page, if customer double click on button
Confirm. The system will create 2 orders, one with enough information (time slots) and the other is empty (no time slots). So that, this is another bug of component. To solve the issue, we add the function to disable double click on Confirm button at confirmation page. If you are using older OSB version, please upgrade it to 2.3.5 to get these bugs fixed.
- Integrate with AcyMailing: This feature is used to setup OS Services
Booking with access information for adding customers to your AcyMailing lists. When enabled, OS Services Booking will call AcyMailing and insert a new mailing list user as part of the appointment booking process.
Note:
1. changing the status of a booking has no effect on AcyMailing.
2. Cancelling a booking does not remove a list entry.
3. OS Services Booking never removes list entries from AcyMailing.
4. You must have the AcyMailing component installed to use this option.
See https://www.acyba.com/acymailing.html
- Integrate with Joomla User profile: With this feature, OS Services Booking will retrieve/update data of customers from/into Joomla User profile Version 2.3.4 (2nd February 2015)
+ Added:
- Joomla multiple languages - Access levels for Services - EzTexting SMS API
- Stripe, Authorize SIM payment gateways Version 2.3.3 (15th December 2014)
+ Improved:
- GCalendar Integration with Google API V3 Version 2.3.2 (23th September 2014)
+ Add:
- Step in minutes overwrite + Improve:
- Translation tool
- Add time slots to Order at Back-end Version 2.3.1 (22nd August 2014)
+ Add:
Version 2.2.2 (22nd June 2014) + Add:
- Venues layout - Employees layout
- New feature on Top-left Calendar Version 2.2.1 (23th April 2014)
+ Add: - Categories layout
- Customer's time zone
Version 2.2 (14th April 2014) + Add: - Layout Configuration
Version 2.1 (10th March 2014) + Added: - Sef urls
- Manage "not working time" for services in specific day
# Bugs fixed:
- ClickAtell SMS
Version 2.0 (30th August 2013) + Added: - Coupon feature - SSL
- reCaptcha
- Payment plugins: Eway, Worldpay, Sagepay - Report generation
Version 1.5.1 (22nd June 2013)
#Bugs fixed:
- Employee works list filter (by date from/to) - Time slots table : disable book before/after
- Remove break time of employees at back-end of OSB Version 1.5.0 (12th June 2013)
+ Added: - Responsive layout - Bootstrap twitter - Add booking requests from backend - Additional timezones
- More configuration option, they will help you to optimize the booking table layouts.
# Bug fixed
- Error : Employee can work in multiple services in the same time
Version 1.4.1 (18th April 2013)
# Bugs fixed
- Venue dropdown list in employee modification (Backend) - Modal view of Venue in booking page (Frontend)
- Update Czech language package Version 1.4.0 (14th April 2013)
+ Added : - Venues management - Google Calendar integration - ClickAtell SMS integration
- Ability to prevent customers to cancel order request before X hours
# Bugs fixed
- Date time format in order lists
Troubleshooting
Javascript Errors
Nowadays almost every Joomla extension uses JavaScript to create a more responsive website for a better user exprience. Mostly all JavaScripts rely on a JavaScript library like jQuery, Mootools or others. Using different scripts on a webpage can cause conflicts between them. This tutorial helps you to detect and resolve these script errors.
How to detect errors?
If your website does not work as you expect when you click something or an animation stopped working, this could be the result of a script error. In case of an error the script-execution will be stopped by the browser. While some pages might still work, others don't. Not every script is being loaded on every single page of your website. A way to investigate these errors is to use the browser's debug console on the page where the error occurs. In Firefox you can use the Firebug Addon, other browsers like Chrome, Safari or Opera already have similar tools built-in. These developer tools will show you the script-errors including
information about what went wrong, the file and line number, and the line of source code that caused the error. This will really help you with debugging any script errors.
How to resolve errors?
If you've detected a JavaScript error on a page you need to find its origin.
Usually the errors are caused by an extension or combination of multiple
extensions. The browser's debug console will help you to identify the scripts and their related files on your webserver. Once you have identified the extension you can try disabling it to make sure your page works without any errors again. If the error is gone, you've found the extension causing the conflict. Now you can look for the extensions configuration option and see if it lets you enable/disable loading a JavaScript library like jQuery to resolve the errors.
How to prevent loading jQuery multiple times?
There is an ongoing discussion in the Joomla community on how to prevent loading jQuery multiple times across extensions. We have already taken steps and measures by implementing a widely accepted solution. We register through JApplication whether jQuery is loaded or not. In case a 3rd party extension loads the jQuery library you can use the following code snippet to prevent our OS Property extension, theme from loading it twice:
// load jQuery, if not loaded before
if (!JFactory::getApplication()->get('jquery')) {
JFactory::getApplication()->set('jquery', true);
// add jQuery ...
}
Useful Links
Firebug Guide for Web Designers - http://sixrevisions.com/tools/firebug-guide-web-designers
Chrome Developer Tools - http://code.google.com/chrome/devtools/
HTML5 Rocks - Introduction to Chrome Developer Tools - http://www.html5rocks.com/en/tutorials/developertools/part1/
Paul Irish - A Re-introduction to the Chrome Developer Tools -
http://paulirish.com/2011/a-re-introduction-to-the-chrome-developer-tools/
Safari Developer Tools
-http://developer.apple.com/library/safari/#documentation/appleapplications/
Conceptual/Safari_Developer_Guide/DebuggingYourWebsite/DebuggingYourW ebsite.html
Opera Developer Tools - http://www.opera.com/developer/tools/