I followed some tutorials to make the audio play automatically when certain conditions are met. However, the audio does not play automatically. Here is my code.
Parts_Request_Display_Servlet.java
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
HttpSession session = request.getSession();
User usr = session.getAttribute("currentSessionUser") != null ? (User) session.getAttribute("currentSessionUser") : new User();
if (!(UserBean.is_supervisor(usr) || UserBean.is_schedule(usr))) {
response.sendRedirect("/hdi.jsp?err=AccessDenied");
return;
}
ArrayList<Parts_Request_Display_Data> slist = new ArrayList<Parts_Request_Display_Data>();
NumberFormat nfi = NumberFormat.getInstance();
try {
slist = new Parts_Request_Display_Beans().GetRequestFormDisplayList();
} catch (SQLException e) {
e.printStackTrace();
}
String tbl = "<div class="screen" style="padding:50px;">" +
"<table class="table">" +
"<tr><td colspan=2 class="text-left gray2 em3">Request Status</td><td colspan=4 class="text-right"><div id="clockbox"></div></td></tr>" +
"<tr><td class="text-center white em3 bold">Req#</td>" +
"<td class="text-left pink em4 bold">Req Loc</td>" +
"<td class="text-left pink em4 bold">Requester</td>" +
"<td class="text-center yellow em3 bold">Status</td>" +
"<td class="text-center white em3 bold">Req Elap</td>" +
"<td class="text-center white em3 bold">Ready Elap</td></tr>";
DateFormat dbDateformat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss.S");
long REQ_elapsed = 0;
String REQ_elapsedTime = "";
long READY_elapsed = 0;
String READY_elapsedTime = "";
int beep = 0;
String alamPath = System.getProperty("catalina.base") + File.separator + "webapps" + File.separator + "assets" + File.separator + "PartRoom_alam" + File.separator;
JSONObject json = new JSONObject(); // Create JSONObject instance
for (int i = 0; i < slist.size(); i++) {
Parts_Request_Display_Data dto = slist.get(i);
String REQ_ID = dto.get_REQ_ID();
String REQ_LOC = dto.get_REQ_LOC();
String REQER = dto.get_REQUESTER();
String STATUS = dto.get_STATUS().trim();
String REQ_DATE = dto.get_REQ_DATE();
String READY_DATE = dto.get_READY_DATE();
int octa_include = dto.get_octa_include(); // Get the octa_include field value
String audioPath = ""; // Path to the audio file
String StatusBG = "";
String ReqLocColor = ""; // Initialize ReqLocColor
String ReqerColor = ""; // Initialize ReqerColor
// Check if octa_include is 1
if (octa_include == 1) {
ReqLocColor = "style="color:yellow;""; // Apply yellow color to REQ_LOC
ReqerColor = "style="color:yellow;""; // Apply yellow color to REQER
}
if (STATUS.equalsIgnoreCase("request")) {
beep++;
STATUS = "-----";
READY_elapsedTime = "-----";
try {
REQ_elapsed = DateCalc.getDateDiffMinutes(dbDateformat.parse(REQ_DATE), new Date());
} catch (ParseException e) {
e.printStackTrace();
}
REQ_elapsedTime = String.format("%5dm", REQ_elapsed);
// Check if octa_include is 1
if (octa_include == 1) {
audioPath = alamPath + "octa+Request.mp3";
} else {
audioPath = alamPath + "part+Request.mp3";
}
// Include the audio path in the JSON response
json.put("audioPath", audioPath);
} else if (STATUS.equalsIgnoreCase("ready")) {
StatusBG = "bg-danger";
STATUS = "Ready";
try {
REQ_elapsed = DateCalc.getDateDiffMinutes(dbDateformat.parse(REQ_DATE), new Date());
READY_elapsed = DateCalc.getDateDiffMinutes(dbDateformat.parse(READY_DATE), new Date());
} catch (ParseException e) {
e.printStackTrace();
}
REQ_elapsedTime = String.format("%5dm", REQ_elapsed);
READY_elapsedTime = String.format("%5dm", READY_elapsed);
}
tbl += "<tr>";
tbl += "<td class="text-center white em3 bold">" + REQ_ID + "</td>";
tbl += "<td class="text-left pink em3 bold" " + ReqLocColor + ">" + REQ_LOC + "</td>"; // Apply yellow color to REQ_LOC if needed
tbl += "<td class="text-left pink em4 bold" " + ReqerColor + ">" + REQER + "</td>"; // Apply yellow color to REQER if needed
tbl += "<td class="text-center wheat em4 bold " + StatusBG + " ">" + STATUS + "</td>";
tbl += "<td class="text-center white em4 bold ">" + REQ_elapsedTime + "</td>";
tbl += "<td class="text-center white em4 bold ">" + READY_elapsedTime + "</td>";
tbl += "</tr>";
}
tbl += "</table></div>";
Date curdate = new Date();
String curtime = "<span class='em2 font-italic purple-100'>" + new SimpleDateFormat("E").format(curdate) + ",</span>"
+ " <span class='em2 font-italic light-green-200'>" + new SimpleDateFormat("MM/dd/yyyy").format(curdate) + ",</span>"
+ " <span class='em2 font-italic cyan-100'>" + new SimpleDateFormat("HH:mm:ss a").format(curdate) + "</span>";
response.setContentType("application/json;charset=utf-8");
json.put("textMsg", tbl);
json.put("timespan", 22000);
json.put("beep", beep);
json.put("curtime", curtime);
try (PrintWriter pw = response.getWriter()) {
pw.print(json.toString());
}
Parts_Request_Display_Servlet.jsp
<%@ page language="java" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" %>
<%@page import="java.text.*" %>
<%@page import="java.time.*" %>
<%@page import="java.util.*" %>
<%@page import="javax.servlet.*" %>
<%@page import="hdi.common.*" %>
<jsp:useBean id = "ub" class = "hdi.common.UserBean" scope="page"/>
<jsp:useBean id = "pu" class = "hdi.common.PageUtils" scope="page"/>
<%
response.setHeader("Cache-Control","no-cache"); //HTTP 1.1
response.setHeader("Pragma","no-cache"); //HTTP 1.0
response.setDateHeader ("Expires", 0);
//prevents caching at the proxy server
request.setAttribute("hdiUrl", "/");
String pageHREF = request.getRequestURI();
Set<String> roleSet = ub.GetPageRoleSet(pageHREF);
User usr = session.getAttribute("currentSessionUser")!=null ? (User)session.getAttribute("currentSessionUser"): new User() ;
if ( UserBean.hasAccessPage(usr, roleSet)){
UserBean.accessLogged(usr, pageHREF);
}else{
response.sendRedirect("/hdi.jsp?err=AccessDenied");
return;
}
%>
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Parts Request Display</title>
<% out.println(pu.Header()); %>
<style>
.screen,
#slideshow,
#slideshow:after {
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
z-index: 1;
color:#ffffff;
background-color:#0000ff;
text-align:center;
}
</style>
</head>
<body>
<input type='hidden' name='Serial' id='Serial' value='1'>
<div id="slideshow"></div>
<audio id="audioPlayer" preload="auto"></audio> <!-- Audio element for playing sound -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <!-- jQuery CDN -->
<script>
var timespan = 15000;
var beep = 0;
var audioPlayer = document.getElementById('audioPlayer');
(function worker() {
$.ajax({
url: '/part/Part_Room/Parts_Request_Display/Parts_Request_Display_Servlet',
success: function(data) {
$('#slideshow').html(data.textMsg);
timespan = parseInt(data.timespan);
beep = parseInt(data.beep);
$('#clockbox').html(data.curtime);
// Check if audioPath is available and play the audio
if (data.audioPath) {
audioPlayer.src = data.audioPath;
audioPlayer.play();
}
},
complete: function() {
setTimeout(worker, timespan);
}
});
})();
</script>
</body>
</html>
The audio is supposed to play automatically when a request is received, but the audio is not playing.