4

I have a store and I want to play a sound just after receiving an order. I store my orders in my database so I want to play a sound after running this check order query:

$order_check_query("SELECT * FROM orders WHERE status = 'pending'");

I want to run this query every 5 minutes when I am logged in. If there are any pending orders I want to play a sound for 30 sec to notify me.

Dan Grossman
  • 51,866
  • 10
  • 112
  • 101
hamp13
  • 83
  • 2
  • 8

2 Answers2

6

Create an audio element:

var audio = document.createElement('audio');

Insert it into the body:

document.body.appendChild(audio);

Set the sound you wish to play:

audio.src = 'path/to/filename.ogg';

Whenever a query finishes, play the sound:

audio.play();

Example that plays a sound every five seconds with setInterval: http://jsbin.com/uravuj/4

Delan Azabani
  • 79,602
  • 28
  • 170
  • 210
  • Just a note, this will not work on iOS. iOS does not support programmatically playing audio (last I checked). Playing audio must originate from user interaction. – beatgammit Aug 13 '11 at 03:37
  • That's disappointing (for those who care about iOS, at least). Was this a deliberate choice by Apple? – Delan Azabani Aug 13 '11 at 03:39
  • Looks like Apple has gone out of their way to prevent this. Check out this question: http://stackoverflow.com/questions/3009888/autoplay-audio-files-on-an-ipad-with-html5 – Anthony Aug 13 '11 at 03:42
  • Yup. "And Steve said it, and it was so." This seems to prevent abuse, so iOS users aren't troubled with annoying audio alerts. Stupid, I know. – beatgammit Aug 13 '11 at 03:43
  • Hmm, yes. It should be up to the user to just choose websites that use audio properly, and reject developers that don't, instead of having audio `.play()` disabled across the board. – Delan Azabani Aug 13 '11 at 03:45
  • At the very least, I would think they'd have a special wrapper for ios, so that developers with iphones in mind could get through. Granted, anyone could add it, but it would cut down on pages where the developer had no context in mind. – Anthony Aug 13 '11 at 03:48
2

So for whatever page you're on, you'd add an ajax function that fires the PHP script that does the query. If it returns true, trigger a javascript function that plays the sound. If it returns false, no sound. Here is an example with jquery:

function checkOrders()
{
$.get('checkOrders.php', function(data) {
   if(data.neworders == true) {
        audio.play();
     }
   }
});
t=setTimeout("checkOrders()",(5 * 60 * 1000));
}


$(function() {
 checkOrders();
});

This assumes that you are returning the data from php as json and that you have already built an audio object as suggested earlier by Delan.

My javascript/jquery is a bit rusty, feel free to comment or edit mistakes.

Anthony
  • 36,459
  • 25
  • 97
  • 163
  • jQuery is not JavaScript. It is also unnecessary for something like this. – Delan Azabani Aug 13 '11 at 03:25
  • Jquery is javascript. javascript isn't jquery. And ajax calls and response handling is substantially easier with jquery (or at least some js framework). And if the OP is running an online store, his site should be using some frameworks. Anyway, the example is in jquery because it's easier to write (which is why it's popular) and if the OP wants to use native js, the logic above would still work. – Anthony Aug 13 '11 at 03:31
  • jQuery is a library for JavaScript. It is not the same thing as JavaScript, thus, you can't assume that the OP is using jQuery. And the necessity of a framework is completely subjective; I believe that they are almost always unnecessary. – Delan Azabani Aug 13 '11 at 03:33
  • Perhaps unnecessary, but the same argument could be made for a lot of abstractions. I actually meant to start off with "Here is how I would do it in jquery" as a way to offset the assumption, but dropped it. I've added it back. I'm not under the assumption that everyone uses it, just that it's popular enough that anyone doing ajax calls without it knows how to write out an ajax call without me telling them. In this instance, I would say that it may not be crucial to use jquery for this one task, but my guess is that the OP will be wanting more DB-triggered events, etc. So best to invest now. – Anthony Aug 13 '11 at 03:39
  • Frameworks are necessary to avoid cross-browser incompatibilities. Not using one would result in having to implement this all yourself, so you'd basically end up implementing your own library anyway. I agree that jQuery is too often referenced, but most frameworks have similar capabilities anyway. – beatgammit Aug 13 '11 at 03:41
  • I used to avoid using jquery examples unless it was tagged or mentioned in the question, but just as it makes coding easier, it makes example code easier. Since everyone seems to do it, I figured everyone must be at least savvy enough to know how to transliterate it. Just shows what I get for assuming. – Anthony Aug 13 '11 at 03:46
  • tjameson, the days where cross-browser incompatibilities were anything more than rare are long gone. The proliferation and adoption of web standards, coupled with improved implementations, mitigates most of the historical need for frameworks. – Delan Azabani Aug 13 '11 at 12:54