Skip to main content

Making a mobile scoreboard with Drupal, Phonegap and Go

Developer
Jan 07, 2013

Recently we used PhoneGap and Drupal to build Scoreshare: an Android and iOS app for sharing game scores with fellow fans. In the process we fell in love with Go and learned that PhoneGap was not as robust as we originally thought.

The App

PhoneGap To create the Android and iOS apps we used PhoneGap 2.0.0, a free and open source framework that lets you create mobile apps using standardized web APIs for different platforms. With custom JavaScript and the PhoneGap APIs we could utilize the mobile devices’ native resources like notifications and network connection. While using PhoneGap, we found that some functions that were working on iOS were not working on Android, and vice versa. Also when we were experimenting with Phonegap 2.0.0 and 2.1.0 the app worked on Android devices below version 4.1, but not on 4.1, despite being the latest version at that time. This caused us a lot of extra work and we had to create several subversions to test out a final version that was working on every device. JQuery and JQuery Mobile For communication, user registration/authentication, game creation and management we used jQuery Mobile with jQuery core, which is a collection of JavaScript functions to send RESTful Ajax calls using JSON format. HTML5 with CSS3 We developed the user interface in HTML5 and CSS3.

The Site

Drupal The site that displays the results is built in Drupal. We created a content type to store the different parameters of the sport events in a database and display it to visitors. Taxonomy terms were used to categorize the different types of sports for easier searching. (Only volleyball is available at the moment). The communication between the mobile applications and the site is handled by the Services module, which solves basic authentication and content handling problems. We configured the module to use REST server to handle requests to this endpoint and JSON for the response format. Go Go is an open source programming language, developed by Google. “Go is expressive, concise, clean, and efficient. Its concurrency mechanisms make it easy to write programs that get the most out of multicore and networked machines, while its novel type system enables flexible and modular program construction. Go compiles quickly to machine code yet has the convenience of garbage collection and the power of run-time reflection. It's a fast, statically typed, compiled language that feels like a dynamically typed, interpreted language.” - http://golang.org/doc The real time push notification system is written in Go, see our previous blog post for more details. When the scorekeeper updates the score on his device, Drupal sends a status update to the push notification service which immediately updates the score on each viewer’s screen. Scoring mechanism The game scores are kept and modified on the mobile device. However the Drupal site backs up the current score and in case the mobile device has to stop running Scoreshare or the user logs in from another device, the site will provide the necessary information to continue. If you would like to learn more about using Drupal and PhoneGap to create mobile applications, we recommend checking out the tutorial our approach was based on, by Tyler Frankenstein. Based on our experience, Drupal proved to be very well suited to be used for mobile applications, but working with PhoneGap caused too much extra development time. Next time we would write each app in its native programming language instead of using a cross-platform solution. Download apps: Scoreshare for Android Scoreshare - Your social scoreboard for iOS

Newsletter

Articles on devportals, DX and API docs, event recaps, webinars, and more. Sign up to be up to date with the latest trends and best practices.

 

Subscribe