Capstone Project: CryptoPay IOS App

I conceived, developed, and designed a new IOS mobile app for my capstone project to manage CryptoPay credit card devices--a Genesys, Inc. proprietary transaction system. This app, developed from scratch, connects to a server utilizing a REST API. The Capstone Project is primarily broken down into two separate parts: the front-end IOS application and the back-end server. Before going into the details of those two sections first, here is some background of what CryptoPay is.

Background

CryptoPay is a safe, secure, and simple credit card system that provides credit card processing for Car Washes and Laundromats. Here is the company's website www.getcryptopay.com. Genesys Technologies, my current employer, created the CryptoPay product. I work in Tech Support, assisting merchants in managing, configuring, and troubleshooting their CryptoPay system. I chose to develop a mobile app for this system because I am very familiar with its inner workings, and there is a lot of existing data to manipulate and manage to create an app. Since this project uses pre-existing data, it was a great way to hit the ground running by making a real-life application that uses real data. This project involved a lot of planning, learning, and testing. I learned how to program in Swift and used Apple's new SwiftUI. I also learned how to make a REST API using Python's Flask web framework and access a MySQL database using Python's SQLAlchemy library. This project has been a great way to test and improve the software developing skills that I developed at Colorado Technical University. It is also a project that could prove beneficial to my employer.

BackEnd

Starting this project began with the creation of the back-end. The back-end connects to a MySQL database copied from the live CryptoPay database on Nov 3rd, 2019. I started the project by studying the replicated database to learn the relationships between each table. I found which tables needed to query to create an API. I then made SQL commands implemented with the SQLAlchemy Python library. After having access to the database via Python, the next step was to develop a method of accessing the results of the queries remotely. To perform this function, I implemented the Flask microframework. The API is password protects and hosted on the subdomain cryptopay.jamesjosephburch.com. Below is the link to the CryptoPay API source code used by the IOS CryptoPay app.

Card Reader Profile Configuration Table

A subsection to establishing the back-end was creating an SQL table set up for the CryptoPay point of sale (POS) devices. The SQL table made holds all the CryptoPay POS device's configuration information. Initially, the previous CryptoPay systems did not utilize a MySQL database. Instead, all pertinent CryptoPay data was saved in text files. Implementing an SQL database improved the CryptoPay system's performance dramatically; however, there remained one section of CryptoPay that has not been integrated into the MySQL database, and that contained the configuration information for each POS device. Needing this information for the CryptoPay app, I gained access to the credit card reader's configuration text file. With the text file's necessary data, I created a Python script that used regex and Pythons CSV library to collect the text files data and inserted the data into the CryptoPay database in its table. Below is a link to that Python script. 

Front End

With the back-end completed, and a CryptoPay API ready to use, the next task to tackle was the front-end. The front end is written in Swift and utilizes Apple's new SwiftUI framework. The mobile app imitates the main functionality of the CryptoPay website used to manage the CryptoPay system. This website is operated by CryptoPay users to log in to their CryptoPay account so that they can check the online status of their equipment, view recent credit card transactions, configure their CryptoPay devices, and add a new CryptoPay site. Below is the source code to the CryptoPay app and separate videos demoing the different features of the CryptoPay app running.

CryptoPay IOS Demo

Login

The demonstration tests three separate accounts logging in. At 41 seconds, the login attempt purposely fails to show how the app handles an invalid login. The first text field is for the username, while the second text field is for the password. The second text field uses a secure text field for the user's password resulting in the not recording during the demonstration.

Navigation

After a customer logs in, immediately displayed is a list of their CryptoPay locations. The sites are listed in green boxes by the location name, and a unique identifier called an MPM number. Selecting a location sets the chosen location as active and then displays the site information in the phone's top banner in a blue box. While a site is active, the user can tap the blue box to reopen the site selection screen again, or the user can select one of the four tab views below. From left to right, the first tab view presents the online status of the active site. The second tab view displays the purchases for the active site. The user can select the third tab view to choose one of the POS devices on-site and then configure the desired device. Lastly, the rightmost tab view is to add a new CryptoPay site.

Site Status

The first tab view available for the user to select is the "Site Status" tab. This view first displays to the user the address for the location they currently have active. When the "Site Status" tab is selected, there are three boxes that are displayed. The three textboxes will show either green or red. The first textbox indicates if the site has received purchases. The second textbox shows the alarm contacts status. The third textbox shows the online state of the CryptoPay coordinator. In this view, the last section displays the online status of each credit card reader installed at the selected location. Each text box is displayed either green or red depending on the connection status of each POS device. 

Purchases

The purchases tab of the CryptoPay app is the most feature-rich single view in the CryptoPay app. There are two subsections to this view. The first is the site purchase summary. The purchase summary section displays the total gross income for the selected sites last month, month to date, the previous day, and the current day. The second section of this view displays all the transactions that have taken place within the last six months. There is a drop-down view that can set a filter for the displayed transactions in the second view. The filter can list the transactions by a range of dates, or list transactions containing a specific name, or both. Lastly, with each transaction, the user can long-press the transaction to view that transaction's details. The transaction detail displays the transaction ID and which POS devices were used in the selected transaction.