TPU SOUND PROJECT

1. Introduction
2. HW requirements
3. SW requirements
4. UPnP services used
5. The UPnP control point
6. The UPnP media renderer (smart speaker)
7. The user interface

TPU-Sound Project

The user interface - Dynamic part - The eventing.js file

Volume bar bound events:

• bindEvent("#volume",base_url+script_rc+"?MUTE_UNMUTE=switch");

  The code line bindEvent("#volume",base_url+script_rc+"?MUTE_UNMUTE=switch") is used to switch between the two states mute and unmute of the player just by clicking the loudspeaker icon. A click on that icon involves a call to the rendering control action called MUTE.

• in the section volume bar bound events is written a code portion useful to modify the volume of the loudspeaker if the customer clicks on the volume bar.

  Particularly, by clicking on the volume bar square cursor, the cursor new position is quantified and converted into a volume level.The new volume level is obtained after an ajax get request sent to the SET_VOLUME function of the RenderingControl.

Seek bar bound events:

in this section we can comment the code by dividing it in three different parts:

• the first part acts when the cursor When cursor hovers the bar; in this case the bar stops its increment and starts to follow the cursor. When the hovering ends the bar's square cursor continues to follow normally the track timing;
• the second piece of the code acts when cursor moves inside the seekbar. In this case we have a change in bar positioning, according to cursor one;
• the third and last part of the code is involved when the seek-bar square cursor is clicked. For this situation the square cursor retrieve its relative position, compute the related time (in mm:ss) and call a SEEK AVTransport event via an AJAX GET request. After the call, the function updates the time counter and starts to follow it.

The complete interface sources are available following this link: Interface.tar.gz [interface_md5.html]