html5

HTML5 Foundations For AV Control

HTML5 Foundations For AV Control teaches you how to create an HTML User Interface purpose-built to control Audiovisual and Smart Home systems.

Course Information

Categories: , ,

When you are done, you’ll know how to create and serve a simple web page that can integrate with any control system. The course goes step-by-step and covers…

  • Writing A Server Application
  • Creating The UI With HTML, CSS & Javascript
  • Connecting To AV Devices & Control Processors

Course Instructor

Patrick Patrick Author

Patrick has been working with audiovisual systems in one form or another since 1995. After moving to Germany in 2005, he founded Controlhaus and began developing automation and control software for mega-yachts, luxury homes, command and control centers and a few conference rooms along the way. He loves to learn, hang out with his family and be creative.

 

HTML5 Foundations For AV Control

357,00 € Sales Tax Included
Enroll
 

HTML5 Foundations For AV Control LTO

SALE 297,50 € Sales Tax Included
Enroll

Start Here

Start Here
Text Editor Setup

Develop A Server Application

Install Node.js
Create A Simple Web Server
Add Token Authentication
Add A Websocket Server

Develop The User Interface

Resources
Development Server Setup
Basic CSS Layout
Add Font & Header Styles
Add Background Image
Add Color Palette
Add Button Styles & Sizes
Create Image Button
Add Javascript Click Event
Create Modal View
Add Progress Bar
Introduction to Javascript Classes
Manage View Visibility With Javascript
Refactoring With Web Components
CSS Grid
Main View Header
Main View Footer
Volume Control Gauge
Right Sidebar Toggle
Right Sidebar Content
AV Icons & Web Component Attributes

Connecting To AV Systems

Overview Of A Control Interface Framework
Add Framework Files
The Framework’s Elements & Attributes
Using The Framework With A Server

2 thoughts on “HTML5 Foundations For AV Control”

  1. Hi Patrick.
    Thank you so much for all these lessons. It was very interesting and usefull.
    For me as for Crestron programmer this is absolutely new. Not all is completly clear. But as we all know its just a matter of practise.
    I have one request. Could you post some good example regarding how to start using HTML5 GUIs with Crestron?
    Thank you in advance!

    • Hi Vadim! Great to hear you got something out of the course.

      I have plans to add a lesson where we add a TCP Client to the server app that you could use to pass messages back and forth to any AV processor. Is that what you are looking for?

      As far as I know, Crestron does not provide a websocket server on their processors, so you cannot connect the websocket directly without using their touchpanels and framework.

Leave a Comment