Over the last couple of months, our lead developer, Mark Martin, has done a heroic job rewriting a large portion of the Ticket and Knowledgebase Admin UI code to make it a better experience for you. The changes in the code have had the following goals:
- Make it easier to make changes to the existing UI
- Simplify the code that controls the interface
- Provide friendlier Hashless URLs in browsers that support PushState
We launched these changes earlier this week. Let’s run through them!
Hashless URLs and Pushstate
So what do I mean by Hashless URLs? Typically in web development the part of the URL following a hash symbol (#) is used to automatically scroll a URL to a particular location on the page. For example, to link to a particular heading on a long web page you might have a URL like:
The part before the hash symbol tells the website which page to locate and the part after the hash symbol tells the web browser to scroll down to a particular point on the page.
In modern web applications, folks have taken to overloading this behavior to load dynamic content into an existing web page. We were using this behavior to link to specific tickets and store ticket searches in the URL, among other things. We did this because older web browsers provided no mechanism to dynamically update content on a page and the URL to reflect it. The only part of the URL you can change is the part after the hash.
HTML5 introduced a new concept called PushState to web developers. What PushState allows the developer to do is update any part of the URL when content on a page changes (such as loading a new ticket).
This means we can now change URLs like this:
Pushstate is a feature that is only available on modern web browsers. Mark has programmed things so that on older browsers they will continue to use the Hash mark.
A huge advantage of dropping the hash symbol is that sharing of admin-only URLs will now work! For example if you share a ticket URL with another Admin who is not logged in, they will be asked to log in…and now they’ll be successfully redirected to the ticket. This was not technically possible with hash-based URLs.
New Ticket Interface
Another thing that we changed along the way was the New Ticket interface. Instead of the old ticket popover dialog:
You will now get something like this:
We’ve also added some nice styles for errors that might occur when creating a ticket: