Trail - An Innovative Way To Learn About Trees on the HWU Campus

A Progressive Web App (PWA) that allows a user to get information about the trees on the Heriot-Watt using QR, Spatial and Speech Synth technologies.

• Work In Progress Deployed at: https://www.thetrailapp.com/

• This application is created by Ruaridh Mollica, the creative direction of this application idea is owned by Ruaridh Mollica. As per section 2 of Heriot-Watts Intelectual Property Policy which states:

Any Intellectual Property created by a Student during the course of his/her study shall remain the property of the Student except where the provisions of Clause Three herein apply. In particular first ownership of any copyright created rests with the Student in accordance with the Copyright, Designs and Patents Act 1988 except where the provisions of Clause Three herein apply.

Stack

Hosting

Trail is hosted on Heroku and has a full valid SSH certification as well as a custom domain.

• Heroku also hosts the applications database.
• Heroku builds and deploys the web application automatically.

Database

Trail makes use of a PostgreSQL database with the postGIS extension installed for the ability to query and store geospatial data.

Backend

This web application is powered by Golang v1.13.1 and handles the following:

• File serving
• Page routing, made easier by the use of the Gin-Gonic/gin framework
• Database connection and querying (using Go-SQL-driver
• Outlining package details and dependencies to Heroku for hosting

Front-end

To make this web app usable and pretty the following technologies are used:

• HTML
• CSS
• JavaScript (to provide more complex functionality and handle API calls)
• JQuery
• Material Design Bootstrap (to make everything that little bit easier)

APIs

• Google Maps Javascript API is used to generate custom, cross-compatible, interactive maps.

JavaScript Libraries

• html5-qrcode by Minhaz - this library was crucial in development and allowed for a QR code scanner to be embedded into the web application.
• WriteIT.js by khushit-shah - used for the homepage greeting.
• Google Maps' Marker Clusterer Library
• SpeechSynthesis Web Speech API - used for text to speech synthesis
• User Agent Parser by faisalman on GitHub - used to get the users operating system to prevent vibration API functions calling when a user is running web app on an IOS or Mac OS device. (vibration API. is unsupported by IOS)