Media Player

The <ch5-media-player> component provides a standard music playback solution (audio only) for CH5 and Crestron Construct™ projects. The CH5 media player is based off of the VT Pro-e® media player function but offers a new look and feel. The CH5 media player also can communicate with DM NAX® hardware and supports various audio streaming services. Refer to the latest CH5 release notes for supported devices and services.

For interactive examples using the <ch5-media-player> component and CSS classes, refer to the Showcase Application.

The CH5 media player is divided into two child views:

  • My Music provides a home page for the media player that includes a grid of categories determined by the active streaming services in a user's profile.

  • Now Playing displays information about the current track playing within the selected zone and user profile.

Refer to the following image for a mapping of VT Pro-e to CH5 media player UI functions.

As of CH5 version 2.17.3, the CH5 media player can establish a direct TCP socket to third‑party media hardware instead of communicating solely via the control system CIP connection. All sessions must still begin through the control system: the device first registers via CIP, obtains direct connection details in the registration response, then attempts to re‑register over the direct TCP socket. Only after a successful direct connection should it deregister from the control system and continue communication directly.

NOTE: Direct connect is not supported by the Crestron ONE® application for iOS® and Android™ OS platforms.

The component must continuously monitor availability of the direct TCP path and handle seamless fallback to the control system when the local network becomes unavailable (for example, a mobile device roaming from the home LAN to cellular) and resume direct connect when the LAN connection returns. This reflects common luxury‑home network setups where port forwarding to third‑party media devices is not configured and direct TCP is only viable on the internal VLAN.

Features

The <ch5-media-player> attributes provide the following features:

  • Sets the background color for the full component and child views

  • Sets the border color, width, and style for the component, pop-up inputs, and menu items

  • Sets sizes and colors for icons, progress bars, and fonts

  • Sets the component height and width

  • Sets various properties for the component

  • Connects to the Media Server Object Router SIMPL module

  • Requests and receives APIs from the control system for media player functions

  • Receives state to refresh the media player and to determine whether the media player device is online

Design Considerations

  • Only one CH5 media player component is allowed per project. This is not validated at the CH5 template project level, so the developer must be mindful of this restriction during project development.

  • VT Pro-e media player modes (Full, Compact, Info, Mini, List, and Remote) are not supported in CH5. If migrating from a VT Pro-e project, the UI design must be mapped to the CH5 media player layouts (portrait and landscape). Additionally, not all VT Pro-e media player styles and properties are available in CH5. Refer to CH5 release notes for more information.

  • The CH5 media player does not support video streaming (audio only).

  • The CH5 media player is not compatible with TSW-60 series touch screens.

  • The CH5 media player cannot be added to Zoom Rooms® Control CH5 projects.

  • NOTE: Although Zoom Rooms Control projects do not support media player functionality, these projects will still contain media player CSS. This is a requirement for Theme Builder.

  • The page using the media player must always have "cache":true. If "cache":false, then the media player will be removed from the DOM during page navigation. The developer is responsible for implementing this correctly in the project.

  • The height and width can only be customized on the full component. The default values at start up are 600 px H x 800 px W. Child component sizes are adjusted automatically based on the full component size.

  • Landscape and portrait layouts are set based on the component size. The end user is not able to change between landscape and portrait layouts manually.

    • Responsive design for landscape and portrait layouts is based on the full component size (and not the viewport size).

    • When the width of the component is less than 640 px, then layout will switch from landscape to portrait automatically.

    • The height and width of the portrait layout is restricted to 360 px maximum.

  • Fonts in media player icons are not Font Awesome or Material. These icons are unique to the media player and cannot be customized.

  • If repeat is turned off, selecting the Next button can show the track progress bar moving even though no audio is playing. This is a known issue and will be addressed in a future release.

  • Users can tap on the track progress bar to progress forward or backward to that location in the track. This behavior differs from VT Pro-e, where users cannot tap on the track progress bar to progress it.

  • When two instances of the Crestron ONE® app connect to the same control system with same IP ID for the CH5 media player project, the app that was already connected may reload the Now Playing and My Music views when the second app connects. There is no workaround other than assigning unique IP IDs per app instance.