html5 – Kiel the Coder

The Joy? of CH5

In this post, I’m going to build a real touchpanel layout using Crestron’s CH5 template. I’m not going to worry too much about styling and customizing. I still remember the headache of digging through layers of CSS to try and override the default styles.

HTML5 in 2026

I originally started writing this in 2025, so it had a punchier title. Oh well… last year ended up far busier than I expected, so writing has taken a backseat to everything else. I think the topic remains relevant (even more so) with the recent listing of TSW-1080 panels on Crestron’s website.

I haven’t touched HTML5 much since 2022. Once supply-chain issues resolved, I found myself playing catch up on many delayed projects. The workload hasn’t quite subsided, but I know the importance of working with HTML5+CSS+JS has only increased. I worry daily that SmartGraphics will be end-of-life sooner than I’d like.¹ We all need to be ready for that eventuality!

HTML5 Cleanup

The last post took me way too long to write (like an entire month), and I think it’s the format of trying to step through every single change, every single time that’s slowing me down. We’re going to be moving into program sizes where that just isn’t going to work. But before we make that jump, I want to do some clean-up on our last program, the Huddle Room.

HTML5 Huddle Room

For our first room type, we’re going to program a very simple huddle room. It will focus around a PC-based codec that we won’t control directly. These spaces are typically low-cost and plentiful, but only allow 3 or 4 people to use them.

HTML5 + 4-series

We’ve already run into a couple things we need to be mindful of when using HTML5 and 4-series processors (see HTML5 XPanel for details about licensing and authentication). In this post, my goal is to break away from 3-series sandboxes and SIMPL Windows, so that means we’re moving into the realm of C# and Visual Studio 2019.

HTML5 + JS

In this post, we’re going to greatly simplify how we create touchpanel layouts: we’re going to ditch the Contract Editor and most of the CH5 components. I do think these tools have value in the right hands, but I want to explore going my own direction. We might reinvent some of their features, but I think it will pay off from the learning aspect. And we’ll know how our program works, inside and out.

HTML5 XPanel

At long last, Crestron has an updated XPanel that doesn’t rely on Adobe Flash! Unfortunately, there are some issues surrounding it regarding the licensing, but there is a free 60-day trial period that should hopefully get us through this series of posts!

Contract Editor

The Contract Editor is a tool released by Crestron to put an end to arbitrary join numbers. Of course, there’s NO documentation, so figuring it out is left up to us!

Create an HTML5 Layout

Earlier this year I experimented with Crestron’s HTML5 offering (dubbed CH5) and felt several pieces were lacking:

Decent looking components
Documentation
Ability to test using an XPanel

Now that we’re well past Masters 2021, my hopes of a clear understanding of the CH5 framework still unfulfilled, I think it’s time to revisit this topic.