DineSafe is a web application created for the Middlesex-London Health Unit in London, Ontario. This is a large-scale application, responsible for processing and storing over 300,000 data points on a daily basis. I was a core member of the development team, and as such, was responsible for a majority of the back-end data processing, search functionality logic, dynamically-generated front-end presentation logic, and many other features of this application. I was also solely responsible for the maintenance and upgrades to the application since it’s initial release. Any features discussed here were my sole or shared responsibility.
When first accessing the DineSafe system as a public user, you are greeted with a site disclosure. You must agree to this disclosure before you are allowed to use the application. Agreement is stored in the form of a client-side cookie and is valid until the user clears their cookies.
Upon agreement to the terms, users are presented with a list of inspections, displayed in paginated table format, starting with the most recently completed. In addition, users are able to search by keyword, current standing, location, first letter of the premises name, or they may view other types of inspected facilities (pool, spas, tattoo studios). For example, searching “Pita” will only return premises with the word Pita in their name.
Users have the option of displaying the results of the current search in either table view or map view
The map is built using the Google Maps API, which has been heavily altered and customized to include the most recent inspection data and current standing along with each location result.
In table view, results of any search can be sorted by column, allowing a user to quickly find premises with the most (or least) recent inspection, or the most/least infractions of each type. These results can be further filtered by using the options in the top bar.
Premises details are displayed on a dynamically-generated results page, with information collected from the Groundhog data transfer.
The banner of this page is generated using a Google Maps API call to dynamically create the background image. Name of the premises, address, and phone number are also included; the phone number is configured so that clicking will initiate a phone call to the premises (assuming the user has compatible software installed). The sign displayed in the header is obtained from the results of the most recent premises inspection.
Each inspection on a premises includes a date and type (inspection or re-inspection). This information is displayed along with the number of infractions found in the given inspection. Clicking an inspection will dynamically load details about the inspection’s infractions on the right, including the infraction topic and any specific infringements related to the infraction.
Any corrections or observations required are also dynamically loaded at the bottom of the screen.
DineSafe is a large, complex application, responsible for presenting a massive amount of data to the public in a friendly in readable way. For more information about my responsibilities on this project, or any other site features you may encounter, please feel free to contact me.