Introducing Xanadu

I’m thrilled to announce the release of Xanadu: Calendars for NC State. Xanadu is a new WordPress plugin that makes it easy to add event feeds to your website from multiple data sources.

Besides academic classes, lots of other things happen at NC State. These events are often managed using multiple applications.

  • The University Calendar by UComm uses an application called Localist and features public events of interest to a wide audience. (Departments and groups on campus can and should submit their events!)
  • Everyone at NC State has a Google Calendar. Many departments and groups on campus schedule and share events using a Google Calendar belonging to a generic account or a Resource Calendar.
  • Non-credit workshops and trainings are scheduled through REPORTER.
  • Room and space reservations are scheduled through EMS.
  • Some departments use The Events Calendar by Modern Tribe, a plugin that lets you build event content in WordPress.

Each tool is serves a different purpose, and many groups on campus use more than one—or even all of them—to accomplish different goals. But until now, there hasn’t been an easy way to display information from these data sources in a consistent, unified way.

Enter Xanadu, a place where nobody dared to go.

Xanadu is available for anyone on campus to use. Like all of our general-use themes and plugins, it’s 100% free. If you’re a web developer, we would love if you contributed ideas and code in the GitHub repository.

I’m going to tell you all about Xanadu below. But if you’re less into reading and more into doing, you can skip down to the part about installing the plugin to try it out!

About the name

Sometimes a joke just sticks, you know? “Project Xanadu” was OIT Design & Web Services’ inside joke name for “a big generic project we’ll do some day in the future.” When we started talking about building a calendaring plugin, we realized it would require required:

  • Ingesting multiple APIs
  • Normalizing their data structure
  • Using the WordPress REST API in a way we’ve never done before
  • Using the block editor in ways we’ve never done before

That’s a lot of moving parts and a pretty big project. Naming it after the 1980 Olivia Newton-John roller-skating science fiction musical just felt like the perfect fit.

And so, they call it Xanadu-u-u.

Features

Full documentation is coming soon and will live in the recently-launched IT Service Portal. Until then, there are a few features I’d like to highlight. So open your eyes, and see what we have made is real.

Filterable event queries

When adding an event list block to a page, you build a query in which you select:

  • A data source (Localist, Google, REPORTER, EMS, or The Events Calendar)
  • Criteria for selecting or filtering events

Each data source API supports a different set of filter criteria. For example, you can filter the University Calendar to display only events of the type “Lectures and Symposia.”

Events from the University Calendar labeled as "Lectures and Symposia."

Another example: If you’re getting events from the EMS API, you can retrieve them by reservable space—like events happening at Miller Field #1 by Carmichael Gym.

Events from EMS taking place at Miller Field #1 by Carmichael Gym.

One more example, just for fun: If you’re getting workshops from the REPORTER API, you can filter down so you only see workshops taught by a particular instructor—in this case, our colleague Louise Flinn on OIT’s training team.

Workshops from REPORTER taught by Louise Flinn.

These are just a few of the filter options currently available in Xanadu. Filtering your calendars means your neon lights will shine for you, highlighting the collections of events that are most relevant to your users.

Composition of event queries

The event list block supports the composition of multiple queries, meaning you can display events from multiple data sources as a single stream of events. This allows you to build a calendar that displays all of the events your users need to see seamlessly. Your departmental calendar can display your big-audience public events (created in the University Calendar) and your smaller-group seminars and meetings that only matter to your department (created on a Google Calendar).

I’m particularly excited about this, because it solves a problem many of our clients have encountered for as long as I’ve been at NC State. Previously, displaying a single stream of events would require duplicating information in multiple places—and with information duplicated, it’s easy for it to get out of sync when changes happen. You might call this the dream that came through a million years. (Or you might not. I admit it’s getting harder and harder to fit Xanadu lyrics into this blog post.)

Going back to our earlier examples: Suppose you wanted a single event stream showing lectures and symposia, events happening at Miller Field #1, and workshops taught by Louise. It’s sort of an odd collection, but you can do it quickly and easily with Xanadu!

Composition of three event queries.

There’s no limit to the number of queries that can be built, or to the number of queries that can be used in a single instance of the event list block.

Display options and event cards

In addition to the default event display—your classic red date blocks—Xanadu comes with two additional display styles. (And it can support more if you have ideas!) First, we have an option that inverts the red and white to match the recent redesign of the NC State homepage. In this example, we’re displaying events created using The Events Calendar in the Math Department.

Events from the Math Department calendar with inverted colors.

Xanadu also introduces a “card”-style event display. Event cards work best for events that have an image associated with them—for instance, events coming from Localist. The event card display style is available in the event list block, and is also available as a standalone block for highlighting a single promoted event.

Hosting your own “event details”

WordPress administrators have the option to designate an event details page. This gives you a landing page for each event on your website—in other words, a way to view full event descriptions without users having to leave your website.

With this option turned off, your users will go to the original data source (Google, Localist, REPORTER, etc.) when they click an event link. With this option turned on, your events will live in an everlasting world… here with me… eternally on your website. (“Eternally” may be overstating it… Event data refreshes every 12 hours and is removed after the event is over.)

Note for developers: There are theme hooks available in the plugin for developers to add their own custom view of event details. So if you don’t like our design decisions, customize it for your website! We won’t be offended.

An event from the University Calendar displayed in the Xanadu event details page.

Call for testing

Now that I’m here, now that you’re near, in Xanadu, we need your help!

Xanadu works, but isn’t quite polished. And so we’re looking for volunteers to try the plugin and give us feedback. In particular, we’re looking for groups on campus who:

  • Host a lot of events
  • Use more than one event data source
  • Are already using WordPress 5.0 with the block editor (sometimes called “Gutenberg”)

Xanadu is available to install through Cthulhu in the OIT repository. If you’re not sure what that means, talk to your web administrator or contact us for help. Please feel free to stop by our office hours if you need help with initial setup, and please share your questions and feedback with us so we can make the plugin better!

If you haven’t upgraded to the block editor yet, we’re working on an add-on plugin to help you use Xanadu with the classic editor. If you’d like help migrating to the block editor sooner rather than later so that you can use Xanadu, please let us know!

Why we’re excited

Xanadu solves some problems for our clients. But under the hood, it’s also a very sophisticated plugin—maybe one of the most technically interesting projects we’ve completed. We’re extending the new block editor further than we have before, and we’re using the WordPress REST API in what I think is a really clever way.

For our clients, those technical details may not matter much. For us, this gives us some great ideas for future projects. We’re incredibly excited by what this opens up, and we’re eager to work with folks on campus to explore these possibilities.

A big thank you to Miles Elliott

This plugin has been a true team effort and has involved all of our development team in some way or another. But I’d like to highlight Miles Elliott’s contribution in particular.

For those who haven’t heard, our friend and colleague Miles Elliott has left the university for a position in the private sector. We’re thrilled for Miles—it’s a great opportunity that he absolutely deserves—but it’s a loss that we’re definitely going to feel.

I think it’s safe to say Xanadu wouldn’t have happened without Miles’ contributions to the project. I’m glad we got a chance to work on this project together, and I’m really looking forward to seeing how campus uses it.