I want to know if it is possible to add a sound to a web, this web is a viewer of some sensors, the problem I have is that it is in JSP and I have no idea how this works, this web shows data from some sensors and when they pass the defined ranges an alarm is activated, but on the web only one image is changed by another (a green clock is changed by a red one) but there is no sound or pop-up message and I want to know if it is possible to add a sound, the code that builds the table where all the information of these sensors is as follows.
<div id="hl-content-inner-table" onscroll="onTableDivScroll(this);">
<t:dataTable
id="data"
styleClass="standardTable"
headerClass="standardTable_SortHeader"
footerClass="standardTable_Footer"
rowClasses="standardTable_Row1,standardTable_Row2"
var="element"
value="#{sortableDeviceTable.elements}"
sortColumn="#{sortableDeviceTable.sort}"
sortAscending="#{sortableDeviceTable.ascending}"
preserveDataModel="true"
preserveSort="true">
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="label" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.labelHeader}" />
</t:commandSortHeader>
</f:facet>
<h:outputText value="#{element.label}" />
</t:column>
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="type" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.typeHeader}" />
</t:commandSortHeader>
</f:facet>
<h:graphicImage id="typeImage"
alt="type"
url="#{element.typeLabelUrl}">
</h:graphicImage>
<h:outputText value="#{element.type}" />
</t:column>
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="serialNumber" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.snHeader}" />
</t:commandSortHeader>
</f:facet>
<h:outputText value="#{element.fullSerialNumber}" />
</t:column>
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="status" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.statusHeader}" />
</t:commandSortHeader>
</f:facet>
<h:outputText escape="false" value="#{element.statusString}" />
</t:column>
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="measurementType" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.measTypeHeader}" />
</t:commandSortHeader>
</f:facet>
<h:outputText value="#{element.measurementTypeString}" />
</t:column>
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="reading" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.readingHeader}" />
</t:commandSortHeader>
</f:facet>
<h:outputText value="#{element.readingString}" />
</t:column>
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="time" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.timeHeader}" />
</t:commandSortHeader>
</f:facet>
<h:outputText value="#{element.lastConnectionTimeString}" />
</t:column>
<t:column styleClass="standardTable_ColumnCentered">
<f:facet name="header">
<t:commandSortHeader columnName="alarm" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.alarmHeader}" />
</t:commandSortHeader>
</f:facet>
<h:graphicImage id="alarmImage"
alt="alarm"
url="#{element.alarmStatusUrl}">
</h:graphicImage>
</t:column>
<t:column>
<f:facet name="header">
<t:commandSortHeader columnName="signal" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.signalHeader}" />
</t:commandSortHeader>
</f:facet>
<h:graphicImage id="signalImage"
alt="signal"
url="#{element.signalStrengthUrl}">
</h:graphicImage>
</t:column>
<t:column styleClass="standardTable_ColumnCentered">
<f:facet name="header">
<t:commandSortHeader columnName="battery" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.batteryHeader}" />
</t:commandSortHeader>
</f:facet>
<h:graphicImage id="batteryImage"
alt="battery"
url="#{element.batteryLevelUrl}">
</h:graphicImage>
</t:column>
</t:dataTable>
</div>
What I try is to try to filter the part where the URL of the image is obtained but it did not work, try it with a c: choose. Trying to compare element.alarmStatusUrl and if I return the URL of the red clock image Well you could try but I did not know how to do it, if you can help me with an example or how to do it I would appreciate it.
<t:column styleClass="standardTable_ColumnCentered">
<f:facet name="header">
<t:commandSortHeader columnName="alarm" arrow="true" immediate="false">
<h:outputText value="#{sortableDeviceTable.alarmHeader}" />
</t:commandSortHeader>
</f:facet>
<h:graphicImage id="alarmImage"
alt="alarm"
url="#{element.alarmStatusUrl}">
</h:graphicImage>
</t:column>