WordPress Posts

Caching API Requests

I recently helped to complete development work on a pretty unique web application. The organization had an idea to create a place for people find out about the accessibility of many different business locations. Their hope is help people with physical disabilities better plan out any business or errands they have ahead of time, so they can choose the most accessible locations. They also believe this will help push demand for businesses to become more handicap accessible.

The solution our team came up with was to create a site based around Google Maps API, and provide an interface for users to submit reviews for individual locations. Users can search for a location on the site using the same functionality as Google Maps. Once they’ve selected a location, they can see the average ratings for that location’s facilities (parking, access, bathrooms, tables, mobility, and an overall score). They can also see what other people have written about the business in terms of its accessibility.

My role in the project was to make sure the site and server could perform well under a large user load. The original version of the site quickly ran into problems hitting request limits on the Maps API, and general slowness from poor database design. My contribution was to cache the Maps data into the WordPress database, and integrate some other custom tables into WordPress.

I added logic to the site so that whenever a user selects a location that has never been clicked on before, WordPress creates a post in a ‘locations’ custom post type. The location name, map ID string, address, phone number, website, and images are all saved to the post’s meta. So whenever that location is selected in the future, the data can be pulled quickly from the local database rather than called from an external API. Each locations post also includes meta for when its data was last pulled from the API. If it has been two weeks since it was pulled from the API, the next time a user selects it, it will update its data from Google. I also added functionality for the comment ratings meta to be cached into the location post, so it no longer has to be calculated on each view.

This project stood out from my typical development work because of its unique challenges. You can see the current version of the site here.

Easy Digital Downloads

I want to express my appreciation for an open source project that recently made my life a lot easier.

A few years ago, I worked with a client to create a website allowing people to purchase sheet music she composed and download them as PDFs. At the time I wasn’t familiar enough with htaccess processes to create protected directories for the PDF files, so I relied on another online service to host the files and purchase info. That service permanently went offline recently, leaving my client’s site inoperable.

Obviously this became an urgent project, and I needed something I could quickly implement out of the box to process the file purchase downloads until I could write my own solution. I found the Easy Digital Downloads project that integrates with WordPress, and was immediately impressed with the features. I converted the site to WordPress and plugged in Easy Digital Downloads, and had things back up and running within a couple hours.

Now the download files are hosted, maintained, and protected on the client’s server, so we no longer have to worry about a third party service going dark, and I can hook into the plugin and WP Engine to do any customization I need. Plus, the code is minimally invasive to the site. The Easy Digital Download project has saved me a lot of stress and hassle on this project.

AJAX SVG Map WordPress Plugin

I’ve been working on an interactive map WordPress plugin on and off since last September. It’s been an awesome learning experience.

What it is:

  • A world map graphic rendered on the page using HTML5’s SVG element
  • Clickable regions on the map
  • An infographic rendered on the page using HTML5’s canvas element

What it does:

When a visitor clicks on a region of the map graphic, the infographic is populated with the data corresponding to the clicked region. It also loads a post on the page with text content about that region. This all happens through one AJAX call, so no page reload necessary!

I’ve had a few interesting iterations of how the map functions. I’ve had it loading a few of the most recent posts from a category associated with the clicked region. I’ve had it loading a single post’s content up to the Read More tag, and then including a button to the full post. For my current needs, I’m just loading up the full content of a single post corresponding to the clicked region.

There’s still a good chunk of work left before I’d call it finished. I’m working on getting as many options integrated into the Admin as possible. Right now I only have the infographic’s data values and post selection available in an admin screen. Eventually I also hope to give users control over how post content is displayed, and how regions are grouped together, but these options will be more of a challenge.

I’m currently using JQVMaps and NewChart.js for the plugin.

A long term goal would be to include all of JQVMap’s API, so users could control what type of map they want. I also haven’t worked toward including all of NewChart.js’ API options yet. It’s as if the more progress I make on this project, the bigger it becomes. But the bigger it gets, the more enthusiasm I have to work on it.

Here’s a link to the current WIP.