diff --git a/.idea/HorseRaceGame.iml b/.idea/HorseRaceGame.iml index 24643cc..0b872d8 100644 --- a/.idea/HorseRaceGame.iml +++ b/.idea/HorseRaceGame.iml @@ -1,12 +1,12 @@ - - - - - - - - - - - + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/misc.xml b/.idea/misc.xml index 28a804d..ef004d1 100644 --- a/.idea/misc.xml +++ b/.idea/misc.xml @@ -1,6 +1,6 @@ - - - - + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml index ca2c968..b2ba0b3 100644 --- a/.idea/modules.xml +++ b/.idea/modules.xml @@ -1,8 +1,8 @@ - - - - - - - + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml index 94a25f7..9661ac7 100644 --- a/.idea/vcs.xml +++ b/.idea/vcs.xml @@ -1,6 +1,6 @@ - - - - - + + + + + \ No newline at end of file diff --git a/README.md b/README.md index 9ce366f..a772f9e 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ -# CrivitzDerby - -A crappy game. - -https://kindacrappygames.github.io/CrivitzDerby/ +# CrivitzDerby + +A crappy game. + +https://kindacrappygames.github.io/CrivitzDerby/ diff --git a/audio.js b/audio.js index 9a68717..6408321 100644 --- a/audio.js +++ b/audio.js @@ -1,178 +1,178 @@ -// this should load all of the effects into memory. - -// Neighs, random horse noises -const effects = [ - new Howl({ - src:['resources/audio/neighs/418428__soundslikewillem__neighing-horse.wav'] - }), - new Howl({ - src:['resources/audio/neighs/61605__andune__schnauf.wav'] - }), - new Howl({ - src:['resources/audio/neighs/418427__soundslikewillem__snorting-horse.wav'] - }), - new Howl({ - src:['resources/audio/neighs/53261__stomachache__horse.wav'] - }), - new Howl({ - src:['resources/audio/neighs/448090__breviceps__theremin-horse.wav'] - }) -]; - -// starter guns -const gunshots = [ - new Howl({ - src:['resources/audio/starter_guns/145206__lensflare8642__m16-gun-3-round-burst.mp3'] - }), - new Howl({ - src:['resources/audio/starter_guns/170417__eelke__bang-03-clean.mp3'] - }), - new Howl({ - src:['resources/audio/starter_guns/200245__noah-fletcher__homeade-gun-shot1-no-echo.wav'] - }), - new Howl({ - src:['resources/audio/starter_guns/244394__werra__bang-explosion-metallic.wav'] - }), - new Howl({ - src:['resources/audio/starter_guns/244587__timbre__a-synthetic-bang.wav'] - }), - new Howl({ - src:['resources/audio/starter_guns/344142__brokenphono__gunshot-002.wav'] - }), - new Howl({ - src:['resources/audio/starter_guns/347591__nicjonesaudio__assault-rifle-1.wav'] - }), - new Howl({ - src:['resources/audio/starter_guns/362652__trngle__cat-meow(1).wav'] - }), - new Howl({ - src:['resources/audio/starter_guns/382735__schots__gun-shot.aiff'] - }), - new Howl({ - src:['resources/audio/starter_guns/391965__ssierra1202__wood-bang.wav'] - }), - new Howl({ - src:['resources/audio/starter_guns/474094__piotr123__bang.wav'] - }) -]; - -const five = [ - new Howl({ - src:['resources/audio/countdowns/five.wav'] - }), -]; -const four = [ - new Howl({ - src:['resources/audio/countdowns/four.wav'] - }), -]; -const three = [ - new Howl({ - src:['resources/audio/countdowns/three.wav'] - }), -]; -const two = [ - new Howl({ - src:['resources/audio/countdowns/two.wav'] - }), -]; -const one = [ - new Howl({ - src:['resources/audio/countdowns/one.wav'] - }), -]; - - -// gallops - -const gallops = [ - new Howl({ - src:['resources/audio/gallops/322448__deadxcreed__horse-gallop-loop.wav'], - loop: true - }), - new Howl({ - src:['resources/audio/gallops/106896__robinhood76__02234-fake-horse-steps.wav'], - loop: true - }), - -]; - -const fanfare = [ - new Howl({ - src:['resources/audio/fanfare/100422__robinhood76__01851-cartoon-fanfare.wav'], - }), - new Howl({ - src:['resources/audio/fanfare/198874__bone666138__fanfare.wav'], - }), - new Howl({ - src:['resources/audio/fanfare/321937__pel2na__two-kazoo-fanfare.wav'], - }), - new Howl({ - src:['resources/audio/fanfare/413204__joepayne__clean-trumpet-fanfare-with-wobble.mp3'], - }), - new Howl({ - src:['resources/audio/fanfare/418526__audeption__fasching-fanfare-karnevals-tusch-tataa-long.wav'], - }), - new Howl({ - src:['resources/audio/fanfare/470083__sheyvan__music-orchestral-victory-fanfare.wav'], - }), -]; - - -function playRandomNeigh(){ - const index = Math.floor(Math.random() * effects.length); - effects[index].play(); -} - -// function starterGun(){ -// const index = Math.floor(Math.random() * gunshots.length); -// gunshots[index].play(); -// } - -function playCountdownAudio(seconds){ - let index; - switch (seconds) { - case 5: - index = Math.floor(Math.random() * five.length); - five[index].play(); - break; - case 4: - index = Math.floor(Math.random() * four.length); - four[index].play(); - break; - case 3: - index = Math.floor(Math.random() * three.length); - three[index].play(); - break; - case 2: - index = Math.floor(Math.random() * two.length); - two[index].play(); - break; - case 1: - index = Math.floor(Math.random() * one.length); - one[index].play(); - break; - case 0: - index = Math.floor(Math.random() * gunshots.length); - gunshots[index].play(); - startGallop(); - break; - } -} - -function startGallop(){ - gallops[0].play(); - gallops[1].play(); - -} - -function stopGallop(){ - gallops[0].stop(); - gallops[1].stop(); - -} - -function playFanfare(){ - const index = Math.floor(Math.random() * fanfare.length); - fanfare[index].play(); +// this should load all of the effects into memory. + +// Neighs, random horse noises +const effects = [ + new Howl({ + src:['resources/audio/neighs/418428__soundslikewillem__neighing-horse.wav'] + }), + new Howl({ + src:['resources/audio/neighs/61605__andune__schnauf.wav'] + }), + new Howl({ + src:['resources/audio/neighs/418427__soundslikewillem__snorting-horse.wav'] + }), + new Howl({ + src:['resources/audio/neighs/53261__stomachache__horse.wav'] + }), + new Howl({ + src:['resources/audio/neighs/448090__breviceps__theremin-horse.wav'] + }) +]; + +// starter guns +const gunshots = [ + new Howl({ + src:['resources/audio/starter_guns/145206__lensflare8642__m16-gun-3-round-burst.mp3'] + }), + new Howl({ + src:['resources/audio/starter_guns/170417__eelke__bang-03-clean.mp3'] + }), + new Howl({ + src:['resources/audio/starter_guns/200245__noah-fletcher__homeade-gun-shot1-no-echo.wav'] + }), + new Howl({ + src:['resources/audio/starter_guns/244394__werra__bang-explosion-metallic.wav'] + }), + new Howl({ + src:['resources/audio/starter_guns/244587__timbre__a-synthetic-bang.wav'] + }), + new Howl({ + src:['resources/audio/starter_guns/344142__brokenphono__gunshot-002.wav'] + }), + new Howl({ + src:['resources/audio/starter_guns/347591__nicjonesaudio__assault-rifle-1.wav'] + }), + new Howl({ + src:['resources/audio/starter_guns/362652__trngle__cat-meow(1).wav'] + }), + new Howl({ + src:['resources/audio/starter_guns/382735__schots__gun-shot.aiff'] + }), + new Howl({ + src:['resources/audio/starter_guns/391965__ssierra1202__wood-bang.wav'] + }), + new Howl({ + src:['resources/audio/starter_guns/474094__piotr123__bang.wav'] + }) +]; + +const five = [ + new Howl({ + src:['resources/audio/countdowns/five.wav'] + }), +]; +const four = [ + new Howl({ + src:['resources/audio/countdowns/four.wav'] + }), +]; +const three = [ + new Howl({ + src:['resources/audio/countdowns/three.wav'] + }), +]; +const two = [ + new Howl({ + src:['resources/audio/countdowns/two.wav'] + }), +]; +const one = [ + new Howl({ + src:['resources/audio/countdowns/one.wav'] + }), +]; + + +// gallops + +const gallops = [ + new Howl({ + src:['resources/audio/gallops/322448__deadxcreed__horse-gallop-loop.wav'], + loop: true + }), + new Howl({ + src:['resources/audio/gallops/106896__robinhood76__02234-fake-horse-steps.wav'], + loop: true + }), + +]; + +const fanfare = [ + new Howl({ + src:['resources/audio/fanfare/100422__robinhood76__01851-cartoon-fanfare.wav'], + }), + new Howl({ + src:['resources/audio/fanfare/198874__bone666138__fanfare.wav'], + }), + new Howl({ + src:['resources/audio/fanfare/321937__pel2na__two-kazoo-fanfare.wav'], + }), + new Howl({ + src:['resources/audio/fanfare/413204__joepayne__clean-trumpet-fanfare-with-wobble.mp3'], + }), + new Howl({ + src:['resources/audio/fanfare/418526__audeption__fasching-fanfare-karnevals-tusch-tataa-long.wav'], + }), + new Howl({ + src:['resources/audio/fanfare/470083__sheyvan__music-orchestral-victory-fanfare.wav'], + }), +]; + + +function playRandomNeigh(){ + const index = Math.floor(Math.random() * effects.length); + effects[index].play(); +} + +// function starterGun(){ +// const index = Math.floor(Math.random() * gunshots.length); +// gunshots[index].play(); +// } + +function playCountdownAudio(seconds){ + let index; + switch (seconds) { + case 5: + index = Math.floor(Math.random() * five.length); + five[index].play(); + break; + case 4: + index = Math.floor(Math.random() * four.length); + four[index].play(); + break; + case 3: + index = Math.floor(Math.random() * three.length); + three[index].play(); + break; + case 2: + index = Math.floor(Math.random() * two.length); + two[index].play(); + break; + case 1: + index = Math.floor(Math.random() * one.length); + one[index].play(); + break; + case 0: + index = Math.floor(Math.random() * gunshots.length); + gunshots[index].play(); + startGallop(); + break; + } +} + +function startGallop(){ + gallops[0].play(); + gallops[1].play(); + +} + +function stopGallop(){ + gallops[0].stop(); + gallops[1].stop(); + +} + +function playFanfare(){ + const index = Math.floor(Math.random() * fanfare.length); + fanfare[index].play(); } \ No newline at end of file diff --git a/background.js b/background.js index 7ed2c9c..d254045 100644 --- a/background.js +++ b/background.js @@ -1,217 +1,217 @@ - -const fencePostGap = 200; -const finishLineSpeed = 7; -let fenceOffset = fencePostGap; - -let finishLinePosition = -1000; -let finishLineDrawn = false; - -let showWinnerText = true; -let winnerTextCounter = 0; - -function initBackground () { - finishLinePosition = -1000; - finishLineDrawn = false; - showWinnerText = true; - winnerTextCounter = 0; -} - -function drawRaceBackground(ctx, width, height, horseSize, cyclesRemaining, isMoving){ - - // Create gradient - const grd = ctx.createRadialGradient( width /2, height/2, 0.000, width/2, height/2, width/2); - - // Add colors - grd.addColorStop(0.101, 'rgba(255, 255, 255, 1.000)'); - grd.addColorStop(1.000, 'rgba(116, 224, 224, 1.000)'); - - // Fill with gradient - ctx.fillStyle = grd; - ctx.fillRect(0, 0, width, height); - - // Draw Track - ctx.fillStyle = '#CD853F'; - ctx.fillRect(0, height - (2 * horseSize) , width, height); - - // Draw Distance left, or draw finishline - if (isMoving && gameState !== "preRace") { - if (cyclesRemaining > 0) { - drawRemainingDistance(ctx, width, horseSize, cyclesRemaining); - } - else { - if (!finishLineDrawn) { - finishLineDrawn = true; - finishLinePosition = width; - } - drawFinishLine(ctx, horseSize, height); - finishLinePosition -= finishLineSpeed; - } - } - else { - - } - - // Draw grass - ctx.fillStyle = '#32CD32'; - ctx.fillRect(0, height - (2.4 * horseSize) , width, horseSize/2); - - drawGuides(ctx, width, height, horseSize); - drawFence(ctx, width, ( height - (2 * horseSize)) , horseSize, isMoving); -} - -function drawGuides(ctx, width, height, horseSize){ - - ctx.fillStyle = "#000000"; - ctx.beginPath(); - ctx.moveTo(0, height - (horseSize/2)); - ctx.lineTo(width, height - (horseSize/2)); - ctx.stroke(); - - ctx.beginPath(); - ctx.moveTo(0, height - (horseSize)); - ctx.lineTo(width, height - (horseSize)); - ctx.stroke(); - - ctx.beginPath(); - ctx.moveTo(0, height - (horseSize * 1.5)); - ctx.lineTo(width, height - (horseSize * 1.5)); - ctx.stroke(); - -} - -function drawFence(ctx, width, fenceline, horseSize, isMoving) { - - ctx.fillStyle = '#322e1b'; - - const postHeight = (horseSize /2); - const postTop = fenceline - postHeight; - - for (let x = fenceOffset; x < width; x+=fencePostGap) { - const postStart = x; - ctx.fillStyle = '#322e1b'; - ctx.fillRect(postStart, postTop , 7, postHeight); - } - - ctx.fillStyle = "#000000"; - ctx.beginPath(); - ctx.moveTo(0, postTop); - ctx.lineTo(width, postTop); - ctx.stroke(); - - if(isMoving){ - fenceOffset -=5; - } - if (fenceOffset < 0) { fenceOffset = fencePostGap}; -} - - -function drawRemainingDistance(ctx, width, horseSize, cyclesRemaining){ - const remainingString = (cyclesRemaining /10).toFixed(1) + " Yards Remaining"; - ctx.fillStyle = "#000000"; - ctx.font = "30px Arial"; - ctx.fillText(remainingString, (width / 2) - 150, (horseSize / 2)); -} - -function drawCountdown(ctx, width, height, horseSize, seconds, horses){ - - console.log("draw countdown"); - console.log(horses); - drawRaceBackground(ctx,width,height,horseSize, 0, false); - - ctx.fillStyle = "#000000"; - ctx.font = "120px Arial"; - - ctx.fillText(seconds, (width / 2) - 50, (horseSize )); - - for (let i = 0; i < horses.length; i++) { - drawHorseNamesinLane(ctx, horses[i], i, horseSize, height); - } - -} - -function drawFinishLine(ctx, horseSize, height){ - - ctx.fillStyle = '#FFFFFF'; - ctx.fillRect(finishLinePosition, height - (2 * horseSize) , 8 , height); - -} - -function drawHorseNamesinLane(ctx,horse, lane, horseSize, height) { - ctx.fillStyle = "#000000"; - ctx.font = "40px Arial"; - - ctx.fillText(horse.name, horseSize, height - (lane * (horseSize / 2 )) -20); - ctx.fillText( "Created by: " + horse.owner, horseSize * 5, height - (lane * (horseSize / 2 )) -20); - -} - -function drawResults(ctx, width, height, horseSize, finalPlaces){ - drawRaceBackground(ctx,width,height,horseSize, 0, false); - // draw rectangle - ctx.fillStyle = '#dddddd'; - ctx.fillRect(horseSize*2, height - (.5 * horseSize) , (horseSize *4), - (horseSize * 3)); - - ctx.fillStyle = '#9999FF'; - ctx.fillRect(horseSize*2 + 3, height - (.5 * horseSize) -3 , (horseSize *4) -6, - (horseSize * 3) + 6 ); - - - const first = "1ST - " + finalPlaces[0].name; - const second = "2ND - " + finalPlaces[1].name; - const third = "3RD - " + finalPlaces[2].name; - const fourth = "4TH - " + finalPlaces[3].name; - - ctx.fillStyle = "#000000"; - ctx.font = "40px Arial"; - - ctx.fillText("Final Results", horseSize* 3, height - (horseSize * 3)); - ctx.fillText(first, horseSize* 2.5, height - (horseSize * 2.5)); - ctx.fillText(second, horseSize* 2.5, height - (horseSize * 2)); - ctx.fillText(third, horseSize* 2.5, height -(horseSize * 1.5)); - ctx.fillText(fourth,horseSize* 2.5, height - (horseSize)); - -} -function drawWinnerCloseUp(ctx, width, height, horseSize, finalPlaces){ - drawRaceBackground(ctx,width,height,horseSize, 0, false); - // draw rectangle - ctx.fillStyle = '#dddddd'; - ctx.fillRect(horseSize*2, height - (.5 * horseSize) , (horseSize *4), - (horseSize * 3)); - - ctx.fillStyle = '#9999FF'; - ctx.fillRect(horseSize*2 + 3, height - (.5 * horseSize) -3 , (horseSize *4) -6, - (horseSize * 3) + 6 ); - - ctx.drawImage(finalPlaces[0].image, horseSize * 2.5 , height - (.5 * horseSize) -5 , (horseSize *3) + 10 , - (horseSize * 3) + 10 ); - - ctx.font = "40px Arial"; - ctx.fillStyle = '#ffffff'; - ctx.strokeStyle = '#000000'; - ctx.lineWidth =1; - //should hopefully flicker every 60 "frames" - if (showWinnerText){ - - ctx.strokeText("Winner!!!", horseSize* 3, height - (horseSize * 3)); - ctx.fillText("Winner!!!", horseSize* 3, height - (horseSize * 3)); - - winnerTextCounter ++; - if (winnerTextCounter > 50){ - showWinnerText = false; - } - } - else { - ctx.strokeText(finalPlaces[0].name, horseSize* 3, height - (horseSize * 3)+60); - ctx.fillText(finalPlaces[0].name, horseSize* 3, height - (horseSize * 3) + 60); - - - winnerTextCounter --; - if (winnerTextCounter < 1){ - showWinnerText = true; - } - } - // click to continue should always be present - ctx.strokeText("Click to start a new game!", horseSize* 3, height - horseSize ); - ctx.fillText("Click to start a new game!", horseSize* 3, height - horseSize ); - -} -function drawStartScreen (ctx, bgctx, width, height, horseSize){ - drawRaceBackground(ctx, width, height, horseSize, 999999, true); - + +const fencePostGap = 200; +const finishLineSpeed = 7; +let fenceOffset = fencePostGap; + +let finishLinePosition = -1000; +let finishLineDrawn = false; + +let showWinnerText = true; +let winnerTextCounter = 0; + +function initBackground () { + finishLinePosition = -1000; + finishLineDrawn = false; + showWinnerText = true; + winnerTextCounter = 0; +} + +function drawRaceBackground(ctx, width, height, horseSize, cyclesRemaining, isMoving){ + + // Create gradient + const grd = ctx.createRadialGradient( width /2, height/2, 0.000, width/2, height/2, width/2); + + // Add colors + grd.addColorStop(0.101, 'rgba(255, 255, 255, 1.000)'); + grd.addColorStop(1.000, 'rgba(116, 224, 224, 1.000)'); + + // Fill with gradient + ctx.fillStyle = grd; + ctx.fillRect(0, 0, width, height); + + // Draw Track + ctx.fillStyle = '#CD853F'; + ctx.fillRect(0, height - (2 * horseSize) , width, height); + + // Draw Distance left, or draw finishline + if (isMoving && gameState !== "preRace") { + if (cyclesRemaining > 0) { + drawRemainingDistance(ctx, width, horseSize, cyclesRemaining); + } + else { + if (!finishLineDrawn) { + finishLineDrawn = true; + finishLinePosition = width; + } + drawFinishLine(ctx, horseSize, height); + finishLinePosition -= finishLineSpeed; + } + } + else { + + } + + // Draw grass + ctx.fillStyle = '#32CD32'; + ctx.fillRect(0, height - (2.4 * horseSize) , width, horseSize/2); + + drawGuides(ctx, width, height, horseSize); + drawFence(ctx, width, ( height - (2 * horseSize)) , horseSize, isMoving); +} + +function drawGuides(ctx, width, height, horseSize){ + + ctx.fillStyle = "#000000"; + ctx.beginPath(); + ctx.moveTo(0, height - (horseSize/2)); + ctx.lineTo(width, height - (horseSize/2)); + ctx.stroke(); + + ctx.beginPath(); + ctx.moveTo(0, height - (horseSize)); + ctx.lineTo(width, height - (horseSize)); + ctx.stroke(); + + ctx.beginPath(); + ctx.moveTo(0, height - (horseSize * 1.5)); + ctx.lineTo(width, height - (horseSize * 1.5)); + ctx.stroke(); + +} + +function drawFence(ctx, width, fenceline, horseSize, isMoving) { + + ctx.fillStyle = '#322e1b'; + + const postHeight = (horseSize /2); + const postTop = fenceline - postHeight; + + for (let x = fenceOffset; x < width; x+=fencePostGap) { + const postStart = x; + ctx.fillStyle = '#322e1b'; + ctx.fillRect(postStart, postTop , 7, postHeight); + } + + ctx.fillStyle = "#000000"; + ctx.beginPath(); + ctx.moveTo(0, postTop); + ctx.lineTo(width, postTop); + ctx.stroke(); + + if(isMoving){ + fenceOffset -=5; + } + if (fenceOffset < 0) { fenceOffset = fencePostGap}; +} + + +function drawRemainingDistance(ctx, width, horseSize, cyclesRemaining){ + const remainingString = (cyclesRemaining /10).toFixed(1) + " Yards Remaining"; + ctx.fillStyle = "#000000"; + ctx.font = "30px Arial"; + ctx.fillText(remainingString, (width / 2) - 150, (horseSize / 2)); +} + +function drawCountdown(ctx, width, height, horseSize, seconds, horses){ + + console.log("draw countdown"); + console.log(horses); + drawRaceBackground(ctx,width,height,horseSize, 0, false); + + ctx.fillStyle = "#000000"; + ctx.font = "120px Arial"; + + ctx.fillText(seconds, (width / 2) - 50, (horseSize )); + + for (let i = 0; i < horses.length; i++) { + drawHorseNamesinLane(ctx, horses[i], i, horseSize, height); + } + +} + +function drawFinishLine(ctx, horseSize, height){ + + ctx.fillStyle = '#FFFFFF'; + ctx.fillRect(finishLinePosition, height - (2 * horseSize) , 8 , height); + +} + +function drawHorseNamesinLane(ctx,horse, lane, horseSize, height) { + ctx.fillStyle = "#000000"; + ctx.font = "40px Arial"; + + ctx.fillText(horse.name, horseSize, height - (lane * (horseSize / 2 )) -20); + ctx.fillText( "Created by: " + horse.owner, horseSize * 5, height - (lane * (horseSize / 2 )) -20); + +} + +function drawResults(ctx, width, height, horseSize, finalPlaces){ + drawRaceBackground(ctx,width,height,horseSize, 0, false); + // draw rectangle + ctx.fillStyle = '#dddddd'; + ctx.fillRect(horseSize*2, height - (.5 * horseSize) , (horseSize *4), - (horseSize * 3)); + + ctx.fillStyle = '#9999FF'; + ctx.fillRect(horseSize*2 + 3, height - (.5 * horseSize) -3 , (horseSize *4) -6, - (horseSize * 3) + 6 ); + + + const first = "1ST - " + finalPlaces[0].name; + const second = "2ND - " + finalPlaces[1].name; + const third = "3RD - " + finalPlaces[2].name; + const fourth = "4TH - " + finalPlaces[3].name; + + ctx.fillStyle = "#000000"; + ctx.font = "40px Arial"; + + ctx.fillText("Final Results", horseSize* 3, height - (horseSize * 3)); + ctx.fillText(first, horseSize* 2.5, height - (horseSize * 2.5)); + ctx.fillText(second, horseSize* 2.5, height - (horseSize * 2)); + ctx.fillText(third, horseSize* 2.5, height -(horseSize * 1.5)); + ctx.fillText(fourth,horseSize* 2.5, height - (horseSize)); + +} +function drawWinnerCloseUp(ctx, width, height, horseSize, finalPlaces){ + drawRaceBackground(ctx,width,height,horseSize, 0, false); + // draw rectangle + ctx.fillStyle = '#dddddd'; + ctx.fillRect(horseSize*2, height - (.5 * horseSize) , (horseSize *4), - (horseSize * 3)); + + ctx.fillStyle = '#9999FF'; + ctx.fillRect(horseSize*2 + 3, height - (.5 * horseSize) -3 , (horseSize *4) -6, - (horseSize * 3) + 6 ); + + ctx.drawImage(finalPlaces[0].image, horseSize * 2.5 , height - (.5 * horseSize) -5 , (horseSize *3) + 10 , - (horseSize * 3) + 10 ); + + ctx.font = "40px Arial"; + ctx.fillStyle = '#ffffff'; + ctx.strokeStyle = '#000000'; + ctx.lineWidth =1; + //should hopefully flicker every 60 "frames" + if (showWinnerText){ + + ctx.strokeText("Winner!!!", horseSize* 3, height - (horseSize * 3)); + ctx.fillText("Winner!!!", horseSize* 3, height - (horseSize * 3)); + + winnerTextCounter ++; + if (winnerTextCounter > 50){ + showWinnerText = false; + } + } + else { + ctx.strokeText(finalPlaces[0].name, horseSize* 3, height - (horseSize * 3)+60); + ctx.fillText(finalPlaces[0].name, horseSize* 3, height - (horseSize * 3) + 60); + + + winnerTextCounter --; + if (winnerTextCounter < 1){ + showWinnerText = true; + } + } + // click to continue should always be present + ctx.strokeText("Click to start a new game!", horseSize* 3, height - horseSize ); + ctx.fillText("Click to start a new game!", horseSize* 3, height - horseSize ); + +} +function drawStartScreen (ctx, bgctx, width, height, horseSize){ + drawRaceBackground(ctx, width, height, horseSize, 999999, true); + } \ No newline at end of file diff --git a/foreground_drawing.js b/foreground_drawing.js index 8f3537c..797e00c 100644 --- a/foreground_drawing.js +++ b/foreground_drawing.js @@ -1,38 +1,38 @@ -function fg_drawShadows(ctx, horses,horseHeight, horseWidth) { - ctx.fillStyle = "rgba(0,0,0,0.25)"; - ctx.beginPath(); - ctx.ellipse( - horses[3].x + (horseWidth /2) , // center of horses position - HEIGHT - (horseHeight * 1.75),// center of lane - (horseWidth * .75) / 2, - (horseHeight * .25) / 2, - 0, 0, Math.PI *2); - ctx.fill(); - - ctx.beginPath(); - ctx.ellipse( - horses[2].x + (horseWidth /2) , // center of horses position - HEIGHT - (horseHeight * 1.25),// center of lane - (horseWidth * .75) / 2, - (horseHeight * .25) / 2, - 0, 0, Math.PI *2); - ctx.fill(); - - ctx.beginPath(); - ctx.ellipse( - horses[1].x + (horseWidth /2) , // center of horses position - HEIGHT - (horseHeight * .75),// center of lane - (horseWidth * .75) / 2, - (horseHeight * .25) / 2, - 0, 0, Math.PI *2); - ctx.fill(); - - ctx.beginPath(); - ctx.ellipse( - horses[0].x + (horseWidth /2) , // center of horses position - HEIGHT - (horseHeight * .25),// center of lane - (horseWidth * .75) / 2, - (horseHeight * .25) / 2, - 0, 0, Math.PI *2); - ctx.fill(); +function fg_drawShadows(ctx, horses,horseHeight, horseWidth) { + ctx.fillStyle = "rgba(0,0,0,0.25)"; + ctx.beginPath(); + ctx.ellipse( + horses[3].x + (horseWidth /2) , // center of horses position + HEIGHT - (horseHeight * 1.75),// center of lane + (horseWidth * .75) / 2, + (horseHeight * .25) / 2, + 0, 0, Math.PI *2); + ctx.fill(); + + ctx.beginPath(); + ctx.ellipse( + horses[2].x + (horseWidth /2) , // center of horses position + HEIGHT - (horseHeight * 1.25),// center of lane + (horseWidth * .75) / 2, + (horseHeight * .25) / 2, + 0, 0, Math.PI *2); + ctx.fill(); + + ctx.beginPath(); + ctx.ellipse( + horses[1].x + (horseWidth /2) , // center of horses position + HEIGHT - (horseHeight * .75),// center of lane + (horseWidth * .75) / 2, + (horseHeight * .25) / 2, + 0, 0, Math.PI *2); + ctx.fill(); + + ctx.beginPath(); + ctx.ellipse( + horses[0].x + (horseWidth /2) , // center of horses position + HEIGHT - (horseHeight * .25),// center of lane + (horseWidth * .75) / 2, + (horseHeight * .25) / 2, + 0, 0, Math.PI *2); + ctx.fill(); } \ No newline at end of file diff --git a/game.js b/game.js index 192ee66..fdc0679 100644 --- a/game.js +++ b/game.js @@ -1,442 +1,442 @@ -/** - * Created by tomdt on 6/23/2017. - */ - - - -const GAME_CANVAS = document.getElementById("gamecanvas"); -const BG_CANVAS = document.getElementById("bgcanvas"); - -const BG_CTX = BG_CANVAS.getContext("2d"); -const CTX = GAME_CANVAS.getContext("2d"); - -const COUNTDOWN_START_SECS = 25; - -// Size parameters, they will be adjusted to fit the size of the screen -let WIDTH = GAME_CANVAS.width; -let HEIGHT = GAME_CANVAS.height; - -let horseWidth = WIDTH / 8; -let horseHeight = WIDTH / 8; - -// state tracking -let cyclesRemaining = 1000; -let gameState = "preRace"; // this should probably be an enum later -let horses = []; -let finalPlaces = []; -let finishLineScan = 0; -let fanfarePlayedFlag = false; -let placeCount = 1; -let roundScored = false; - -let scoreboard = JSON.parse(window.localStorage.getItem("cd_scoreboard")) || {}; - -//UI event handlers -let clickHandlerLoaded = false; - -// sound effect triggers -const soundEffectTriggers = [Math.floor(Math.random() * (100)) + 700, // should be between 700 and 800 -Math.floor(Math.random() * (100)) + 300, // should be between 300 and 400 -// Math.floor(Math.random() * (100)) + 200, //between 200 - 300 -]; - - -//Start game loop -window.onload = ( ) => { - console.log("-- Scoreboard Check --"); - console.log(scoreboard); - initGame(); - // The game loop should be a setInterval that way the screen size can be adjusted - setInterval(gameLoop, 20); // a touch <60 FPS - -}; - -function initGame(){ - cyclesRemaining = 1000; - gameState = "preRace"; // this should probably be an enum later - horses = []; - finalPlaces = []; - finishLineScan = 0; - - fanfarePlayedFlag = false; - clickHandlerLoaded = false; - roundScored = false; - - initBackground(); - initHorses(); -} - -function gameLoop(){ - - switch(gameState){ - case "preRace": - screenReset(); - drawStartScreen(CTX ,BG_CTX, WIDTH, HEIGHT, horseHeight); - if (horses.length === 4){ - if (!clickHandlerLoaded){ - let handler = function (event) { - gameState = 'countdownStart'; - console.log ("Horses loaded, transitioning to countdown"); - removeEventListener('click', handler, false); - clickHandlerLoaded = false; - } ; - window.addEventListener("click",handler,false); - clickHandlerLoaded = true; - } - } - break; - case "countdownStart": - startCountdown(COUNTDOWN_START_SECS,BG_CTX); - break; - case "running": - screenReset(); - runRace(CTX,BG_CTX); - break; - case "finishing": - screenReset(); - runRace(CTX,BG_CTX); - break; - - case "finished": - //quick and dirty fanfare check - if (!fanfarePlayedFlag){ - playFanfare(); - fanfarePlayedFlag = true; - setTimeout(()=>{ - gameState = "WinnerCloseUp"; - }, 7 * 1000); - } - CTX.clearRect(0, 0, WIDTH, HEIGHT); - drawResults(BG_CTX, WIDTH, HEIGHT, horseHeight, finalPlaces); - break; - case "WinnerCloseUp": - drawWinnerCloseUp(BG_CTX, WIDTH, HEIGHT, horseHeight, finalPlaces); - if (!clickHandlerLoaded){ - let handler = function () { - console.log("Restarting game....") - initGame(); - gameState = "preRace" - removeEventListener('click', handler, false); - clickHandlerLoaded = false; - }; - clickHandlerLoaded = true; - addEventListener('click', handler, false); - } - break; - - default: - break; - } -} - -function runRace(ctx,bg_ctx){ - - cyclesRemaining --; - //handle race background - drawRaceBackground(bg_ctx, WIDTH, HEIGHT, horseHeight, cyclesRemaining, true); - - //todo- change these sway varibles to be "trot" objects, or something, at put it in a horse object, so we can reuse these better - // horse 1 & 2 are hilarious, horse 3&4 are more normal paced - const lane_1_height = HEIGHT - (horseHeight * 1.25); - const horse_1_sway = Math.sin(cyclesRemaining) * 10; - - - const lane_2_height = HEIGHT - (horseHeight * 1.75); - const horse_2_sway = Math.cos(cyclesRemaining) * 10; - - - const lane_3_height = HEIGHT - (horseHeight * 2.25); - const horse_3_sway = Math.sin(cyclesRemaining/2) * 10; - - - const lane_4_height = HEIGHT - (horseHeight * 2.75); - const horse_4_sway = Math.cos(cyclesRemaining/2) * 10; - - horses[0].y = (lane_1_height + horse_1_sway); - horses[1].y = (lane_2_height + horse_2_sway); - horses[2].y = (lane_3_height + horse_3_sway); - horses[3].y = (lane_4_height + horse_4_sway); - - - updateHorsePositions(); - - checkForSoundEffects(cyclesRemaining); - - - //draw shadows under horses - fg_drawShadows(ctx, horses, horseHeight, horseWidth); - - // draw horses - order is important!!! - ctx.drawImage(horses[3].image, horses[3].x , horses[3].y , horseWidth, horseHeight); - ctx.drawImage(horses[2].image, horses[2].x , horses[2].y , horseWidth, horseHeight); - ctx.drawImage(horses[1].image, horses[1].x , horses[1].y , horseWidth, horseHeight); - ctx.drawImage(horses[0].image, horses[0].x , horses[0].y , horseWidth, horseHeight); - - if (cyclesRemaining <= 0 ){ - if (gameState === 'running'){ - console.log("checking for winners now"); - finishLineScan = WIDTH - horseWidth; - gameState = "finishing"; - } - - let foundHorseIndex = null; - - for (let i = 0; i < horses.length; i++) { - //horse has finished - if (horses[i].x >= finishLineScan && horses[i].place === null){ - if (!foundHorseIndex || horses[foundHorseIndex].x < horses[i].x) { - foundHorseIndex = i; - } - } - } - if(foundHorseIndex != null){ - finalPlaces.push(horses[foundHorseIndex]); - horses[foundHorseIndex].place = placeCount ++; - console.log("Horse Finished - " + foundHorseIndex); - } - // horses.splice(foundHorseIndex); - if (finalPlaces.length === 4){ - if (!roundScored){ - addWinnerToScoreboard(finalPlaces); - getAlltimeWinnerFromScoreboard(); - roundScored = true; - } - stopGallop(); - // give it a bit of time before setting gameState to finished - setTimeout(() => { - gameState = "finished"; - }, 2000) - } - finishLineScan -= finishLineSpeed; - } -} - - -function initHorses(prevWinner) { - console.log("initHorses"); - - if (prevWinner){ - - } - - const temp_horse_array = []; - - //grab random horses - while (temp_horse_array.length < 4) { - let validPick = true; - // pick an index - let pick = Math.floor(Math.random() * horse_array.length); - // check if its taken - for (let i =0; i < temp_horse_array.length; i ++){ - if (temp_horse_array[i].name === horse_array[pick].name){ validPick = false;} - } - //push to temp array - if (validPick){ - temp_horse_array.push(horse_array[pick]); - } - console.log(temp_horse_array); - } - - - // build horse game play objects - for (let i =0; i < 4; i ++ ){ - console.log(i); - const horse_image = new Image(); - horse_image.src = temp_horse_array[i].img; - const temphorse = temp_horse_array[i]; - - horse_image.onload = function() { - const horse = { - image: horse_image, - name: temphorse.name, - owner: temphorse.owner, - x:0, - y:0, - currentSpeed: null, - currentDestination:null, - place: null, - changePositionCycles:[ - Math.floor(Math.random() * (100)) + 700, // should be between 700 and 800 - Math.floor(Math.random() * (100)) + 450, // shuld be between 450 and 550 - Math.floor(Math.random() * (100)) + 200, //between 200 - 300 - ] - - }; - horses.push(horse); - } - } - -} - -function screenReset(){ - HEIGHT = GAME_CANVAS.height = BG_CANVAS.height = window.innerHeight; - WIDTH = GAME_CANVAS.width = BG_CANVAS.width = window.innerWidth; - horseWidth = horseHeight = WIDTH / 8; -} - - -function startCountdown(seconds, bg_ctx){ - playCountdownAudio(seconds); - if (gameState === "countdownStart" ) { - gameState = "countdownRunning"; - } - console.log ("Coundown: " + seconds); - - if (seconds > 0) { - screenReset(); - drawCountdown(bg_ctx, WIDTH, HEIGHT, horseHeight, seconds, horses); - setTimeout (()=>{startCountdown( seconds - 1, bg_ctx)}, 1000); - } - else { - gameState = "running"; - } -} - - -function updateHorsePositions(){ - - for (let i = 0; i < horses.length; i++) { - const horse = horses[i]; - - // update to current destination - if (horse.currentDestination === null){ - horse.currentDestination = Math.floor(Math.random() * (WIDTH - horseWidth)); - } - - if (horse.currentSpeed === null){ - horse.currentSpeed= Math.floor(Math.random() * 5) + 3; - } - - if (horse.x > horse.currentDestination + 5 ){ - horse.x -= horse.currentSpeed / 2; - } - else if (horse.x < horse.currentDestination - 5){ - horse.x += horse.currentSpeed; - } - - //add x sway - horse.x += swayPatternFunctions[i].x(cyclesRemaining); - - // blow away destination if horse has hit its reset point - for (let i =0; i < horse.changePositionCycles.length; i ++){ - if (cyclesRemaining === horse.changePositionCycles[i]){ - horse.currentDestination = null; - horse.currentSpeed = null; - } - } - - //last second reset for giggles! - if(cyclesRemaining === 50 ){ - horse.currentDestination = null; - horse.currentSpeed = null; - } - } - -} - -function checkForSoundEffects(cycle){ - for (let i = 0; i < soundEffectTriggers.length; i++) { - if (cycle === soundEffectTriggers[i]){ - playRandomNeigh(); - } - } -} - -swayPatternFunctions = [ - {x:(cycle)=>{ return Math.cos(cycle/3) * 10;}, y:(cycle)=>{return Math.sin(cycle) * 10} }, - {x:(cycle)=>{ return Math.sin(cycle/3) * 10;}, y:(cycle)=>{ return Math.cos(cycle) * 10;}}, - {x:(cycle)=>{ return Math.cos(cycle/4) * 10;}, y:(cycle)=>{ return Math.sin(cycle/2) * 10}}, - {x:(cycle)=>{ return Math.sin(cycle/4) * 10;}, y:(cycle)=>{ return Math.cos(cycle/2) * 10}} - ]; - - -function addWinnerToScoreboard(finalPlaceArray){ - - let makeFirst = true; - let makeSecond = true; - let makeThird = true; - let makeFourth = true; - - // check for existing horses in scoreboard - for( const horseScoreListing in scoreboard){ - if (horseScoreListing === finalPlaceArray[0].name){ - makeFirst = false; - scoreboard[horseScoreListing].totalRaces ++; - scoreboard[horseScoreListing].firstPlaces ++; - } else if (horseScoreListing === finalPlaceArray[1].name){ - makeSecond = false; - scoreboard[horseScoreListing].totalRaces ++; - scoreboard[horseScoreListing].secondPlaces ++; - - } else if (horseScoreListing === finalPlaceArray[2].name){ - makeThird = false; - scoreboard[horseScoreListing].totalRaces ++; - scoreboard[horseScoreListing].thirdPlaces ++; - - } else if (horseScoreListing === finalPlaceArray[3].name){ - makeFourth = false; - scoreboard[horseScoreListing].totalRaces ++; - scoreboard[horseScoreListing].forthPlaces ++; - } - } - // - if (makeFirst){ - scoreboard[finalPlaceArray[0].name] = {totalRaces: 1, firstPlaces: 1, secondPlaces: 0, thirdPlaces: 0, forthPlaces:0} - } - if (makeSecond){ - scoreboard[finalPlaceArray[1].name] = {totalRaces: 1, firstPlaces: 0, secondPlaces: 1, thirdPlaces: 0, forthPlaces:0} - } - if (makeThird){ - scoreboard[finalPlaceArray[2].name] = {totalRaces: 1, firstPlaces: 0, secondPlaces: 0, thirdPlaces: 1, forthPlaces:0} - } - if (makeFourth){ - scoreboard[finalPlaceArray[3].name] = {totalRaces: 1, firstPlaces: 0, secondPlaces: 0, thirdPlaces: 0, forthPlaces:1} - } - - // Save Scoreboard to local variable again. - window.localStorage.setItem("cd_scoreboard", JSON.stringify(scoreboard)); -} - -function getAlltimeWinnerFromScoreboard(){ - console.log(scoreboard); - let mostwins = 0; - let winningHorse = ""; - for( const horseScoreListing in scoreboard){ - if (scoreboard[horseScoreListing].firstPlaces > mostwins) { - mostwins = scoreboard[horseScoreListing].firstPlaces; - winningHorse = horseScoreListing; - } - } - if (mostwins > 0 ){ - console.log("The winningest horse of all time is " +winningHorse+ " with a total of " +mostwins+ " wins"); - } -} - -function deleteScoreboard() { - scoreboard = {}; - window.localStorage.setItem("cd_scoreboard", JSON.stringify(scoreboard)); -} - -let deletecheck = false; -window.addEventListener("keypress", (e)=>{ - if (e.key === 'd'){ - if (deletecheck === false){ - deletecheck = true; - console.log("Press again to delete scoreboard, press any other key to cancel"); - } - else { - console.log("deleting scoreboard"); - deleteScoreboard() - } - - }else { - deletecheck = false - } - if (e.key === "s"){ - console.log(scoreboard); - } - if(e.key ===" "){ - document.body.click(); - } - +/** + * Created by tomdt on 6/23/2017. + */ + + + +const GAME_CANVAS = document.getElementById("gamecanvas"); +const BG_CANVAS = document.getElementById("bgcanvas"); + +const BG_CTX = BG_CANVAS.getContext("2d"); +const CTX = GAME_CANVAS.getContext("2d"); + +const COUNTDOWN_START_SECS = 35; + +// Size parameters, they will be adjusted to fit the size of the screen +let WIDTH = GAME_CANVAS.width; +let HEIGHT = GAME_CANVAS.height; + +let horseWidth = WIDTH / 8; +let horseHeight = WIDTH / 8; + +// state tracking +let cyclesRemaining = 1000; +let gameState = "preRace"; // this should probably be an enum later +let horses = []; +let finalPlaces = []; +let finishLineScan = 0; +let fanfarePlayedFlag = false; +let placeCount = 1; +let roundScored = false; + +let scoreboard = JSON.parse(window.localStorage.getItem("cd_scoreboard")) || {}; + +//UI event handlers +let clickHandlerLoaded = false; + +// sound effect triggers +const soundEffectTriggers = [Math.floor(Math.random() * (100)) + 700, // should be between 700 and 800 +Math.floor(Math.random() * (100)) + 300, // should be between 300 and 400 +// Math.floor(Math.random() * (100)) + 200, //between 200 - 300 +]; + + +//Start game loop +window.onload = ( ) => { + console.log("-- Scoreboard Check --"); + console.log(scoreboard); + initGame(); + // The game loop should be a setInterval that way the screen size can be adjusted + setInterval(gameLoop, 20); // a touch <60 FPS + +}; + +function initGame(){ + cyclesRemaining = 1000; + gameState = "preRace"; // this should probably be an enum later + horses = []; + finalPlaces = []; + finishLineScan = 0; + + fanfarePlayedFlag = false; + clickHandlerLoaded = false; + roundScored = false; + + initBackground(); + initHorses(); +} + +function gameLoop(){ + + switch(gameState){ + case "preRace": + screenReset(); + drawStartScreen(CTX ,BG_CTX, WIDTH, HEIGHT, horseHeight); + if (horses.length === 4){ + if (!clickHandlerLoaded){ + let handler = function (event) { + gameState = 'countdownStart'; + console.log ("Horses loaded, transitioning to countdown"); + removeEventListener('click', handler, false); + clickHandlerLoaded = false; + } ; + window.addEventListener("click",handler,false); + clickHandlerLoaded = true; + } + } + break; + case "countdownStart": + startCountdown(COUNTDOWN_START_SECS,BG_CTX); + break; + case "running": + screenReset(); + runRace(CTX,BG_CTX); + break; + case "finishing": + screenReset(); + runRace(CTX,BG_CTX); + break; + + case "finished": + //quick and dirty fanfare check + if (!fanfarePlayedFlag){ + playFanfare(); + fanfarePlayedFlag = true; + setTimeout(()=>{ + gameState = "WinnerCloseUp"; + }, 7 * 1000); + } + CTX.clearRect(0, 0, WIDTH, HEIGHT); + drawResults(BG_CTX, WIDTH, HEIGHT, horseHeight, finalPlaces); + break; + case "WinnerCloseUp": + drawWinnerCloseUp(BG_CTX, WIDTH, HEIGHT, horseHeight, finalPlaces); + if (!clickHandlerLoaded){ + let handler = function () { + console.log("Restarting game....") + initGame(); + gameState = "preRace" + removeEventListener('click', handler, false); + clickHandlerLoaded = false; + }; + clickHandlerLoaded = true; + addEventListener('click', handler, false); + } + break; + + default: + break; + } +} + +function runRace(ctx,bg_ctx){ + + cyclesRemaining --; + //handle race background + drawRaceBackground(bg_ctx, WIDTH, HEIGHT, horseHeight, cyclesRemaining, true); + + //todo- change these sway varibles to be "trot" objects, or something, at put it in a horse object, so we can reuse these better + // horse 1 & 2 are hilarious, horse 3&4 are more normal paced + const lane_1_height = HEIGHT - (horseHeight * 1.25); + const horse_1_sway = Math.sin(cyclesRemaining) * 10; + + + const lane_2_height = HEIGHT - (horseHeight * 1.75); + const horse_2_sway = Math.cos(cyclesRemaining) * 10; + + + const lane_3_height = HEIGHT - (horseHeight * 2.25); + const horse_3_sway = Math.sin(cyclesRemaining/2) * 10; + + + const lane_4_height = HEIGHT - (horseHeight * 2.75); + const horse_4_sway = Math.cos(cyclesRemaining/2) * 10; + + horses[0].y = (lane_1_height + horse_1_sway); + horses[1].y = (lane_2_height + horse_2_sway); + horses[2].y = (lane_3_height + horse_3_sway); + horses[3].y = (lane_4_height + horse_4_sway); + + + updateHorsePositions(); + + checkForSoundEffects(cyclesRemaining); + + + //draw shadows under horses + fg_drawShadows(ctx, horses, horseHeight, horseWidth); + + // draw horses - order is important!!! + ctx.drawImage(horses[3].image, horses[3].x , horses[3].y , horseWidth, horseHeight); + ctx.drawImage(horses[2].image, horses[2].x , horses[2].y , horseWidth, horseHeight); + ctx.drawImage(horses[1].image, horses[1].x , horses[1].y , horseWidth, horseHeight); + ctx.drawImage(horses[0].image, horses[0].x , horses[0].y , horseWidth, horseHeight); + + if (cyclesRemaining <= 0 ){ + if (gameState === 'running'){ + console.log("checking for winners now"); + finishLineScan = WIDTH - horseWidth; + gameState = "finishing"; + } + + let foundHorseIndex = null; + + for (let i = 0; i < horses.length; i++) { + //horse has finished + if (horses[i].x >= finishLineScan && horses[i].place === null){ + if (!foundHorseIndex || horses[foundHorseIndex].x < horses[i].x) { + foundHorseIndex = i; + } + } + } + if(foundHorseIndex != null){ + finalPlaces.push(horses[foundHorseIndex]); + horses[foundHorseIndex].place = placeCount ++; + console.log("Horse Finished - " + foundHorseIndex); + } + // horses.splice(foundHorseIndex); + if (finalPlaces.length === 4){ + if (!roundScored){ + addWinnerToScoreboard(finalPlaces); + getAlltimeWinnerFromScoreboard(); + roundScored = true; + } + stopGallop(); + // give it a bit of time before setting gameState to finished + setTimeout(() => { + gameState = "finished"; + }, 2000) + } + finishLineScan -= finishLineSpeed; + } +} + + +function initHorses(prevWinner) { + console.log("initHorses"); + + if (prevWinner){ + + } + + const temp_horse_array = []; + + //grab random horses + while (temp_horse_array.length < 4) { + let validPick = true; + // pick an index + let pick = Math.floor(Math.random() * horse_array.length); + // check if its taken + for (let i =0; i < temp_horse_array.length; i ++){ + if (temp_horse_array[i].name === horse_array[pick].name){ validPick = false;} + } + //push to temp array + if (validPick){ + temp_horse_array.push(horse_array[pick]); + } + console.log(temp_horse_array); + } + + + // build horse game play objects + for (let i =0; i < 4; i ++ ){ + console.log(i); + const horse_image = new Image(); + horse_image.src = temp_horse_array[i].img; + const temphorse = temp_horse_array[i]; + + horse_image.onload = function() { + const horse = { + image: horse_image, + name: temphorse.name, + owner: temphorse.owner, + x:0, + y:0, + currentSpeed: null, + currentDestination:null, + place: null, + changePositionCycles:[ + Math.floor(Math.random() * (100)) + 700, // should be between 700 and 800 + Math.floor(Math.random() * (100)) + 450, // shuld be between 450 and 550 + Math.floor(Math.random() * (100)) + 200, //between 200 - 300 + ] + + }; + horses.push(horse); + } + } + +} + +function screenReset(){ + HEIGHT = GAME_CANVAS.height = BG_CANVAS.height = window.innerHeight; + WIDTH = GAME_CANVAS.width = BG_CANVAS.width = window.innerWidth; + horseWidth = horseHeight = WIDTH / 8; +} + + +function startCountdown(seconds, bg_ctx){ + playCountdownAudio(seconds); + if (gameState === "countdownStart" ) { + gameState = "countdownRunning"; + } + console.log ("Coundown: " + seconds); + + if (seconds > 0) { + screenReset(); + drawCountdown(bg_ctx, WIDTH, HEIGHT, horseHeight, seconds, horses); + setTimeout (()=>{startCountdown( seconds - 1, bg_ctx)}, 1000); + } + else { + gameState = "running"; + } +} + + +function updateHorsePositions(){ + + for (let i = 0; i < horses.length; i++) { + const horse = horses[i]; + + // update to current destination + if (horse.currentDestination === null){ + horse.currentDestination = Math.floor(Math.random() * (WIDTH - horseWidth)); + } + + if (horse.currentSpeed === null){ + horse.currentSpeed= Math.floor(Math.random() * 5) + 3; + } + + if (horse.x > horse.currentDestination + 5 ){ + horse.x -= horse.currentSpeed / 2; + } + else if (horse.x < horse.currentDestination - 5){ + horse.x += horse.currentSpeed; + } + + //add x sway + horse.x += swayPatternFunctions[i].x(cyclesRemaining); + + // blow away destination if horse has hit its reset point + for (let i =0; i < horse.changePositionCycles.length; i ++){ + if (cyclesRemaining === horse.changePositionCycles[i]){ + horse.currentDestination = null; + horse.currentSpeed = null; + } + } + + //last second reset for giggles! + if(cyclesRemaining === 50 ){ + horse.currentDestination = null; + horse.currentSpeed = null; + } + } + +} + +function checkForSoundEffects(cycle){ + for (let i = 0; i < soundEffectTriggers.length; i++) { + if (cycle === soundEffectTriggers[i]){ + playRandomNeigh(); + } + } +} + +swayPatternFunctions = [ + {x:(cycle)=>{ return Math.cos(cycle/3) * 10;}, y:(cycle)=>{return Math.sin(cycle) * 10} }, + {x:(cycle)=>{ return Math.sin(cycle/3) * 10;}, y:(cycle)=>{ return Math.cos(cycle) * 10;}}, + {x:(cycle)=>{ return Math.cos(cycle/4) * 10;}, y:(cycle)=>{ return Math.sin(cycle/2) * 10}}, + {x:(cycle)=>{ return Math.sin(cycle/4) * 10;}, y:(cycle)=>{ return Math.cos(cycle/2) * 10}} + ]; + + +function addWinnerToScoreboard(finalPlaceArray){ + + let makeFirst = true; + let makeSecond = true; + let makeThird = true; + let makeFourth = true; + + // check for existing horses in scoreboard + for( const horseScoreListing in scoreboard){ + if (horseScoreListing === finalPlaceArray[0].name){ + makeFirst = false; + scoreboard[horseScoreListing].totalRaces ++; + scoreboard[horseScoreListing].firstPlaces ++; + } else if (horseScoreListing === finalPlaceArray[1].name){ + makeSecond = false; + scoreboard[horseScoreListing].totalRaces ++; + scoreboard[horseScoreListing].secondPlaces ++; + + } else if (horseScoreListing === finalPlaceArray[2].name){ + makeThird = false; + scoreboard[horseScoreListing].totalRaces ++; + scoreboard[horseScoreListing].thirdPlaces ++; + + } else if (horseScoreListing === finalPlaceArray[3].name){ + makeFourth = false; + scoreboard[horseScoreListing].totalRaces ++; + scoreboard[horseScoreListing].forthPlaces ++; + } + } + // + if (makeFirst){ + scoreboard[finalPlaceArray[0].name] = {totalRaces: 1, firstPlaces: 1, secondPlaces: 0, thirdPlaces: 0, forthPlaces:0} + } + if (makeSecond){ + scoreboard[finalPlaceArray[1].name] = {totalRaces: 1, firstPlaces: 0, secondPlaces: 1, thirdPlaces: 0, forthPlaces:0} + } + if (makeThird){ + scoreboard[finalPlaceArray[2].name] = {totalRaces: 1, firstPlaces: 0, secondPlaces: 0, thirdPlaces: 1, forthPlaces:0} + } + if (makeFourth){ + scoreboard[finalPlaceArray[3].name] = {totalRaces: 1, firstPlaces: 0, secondPlaces: 0, thirdPlaces: 0, forthPlaces:1} + } + + // Save Scoreboard to local variable again. + window.localStorage.setItem("cd_scoreboard", JSON.stringify(scoreboard)); +} + +function getAlltimeWinnerFromScoreboard(){ + console.log(scoreboard); + let mostwins = 0; + let winningHorse = ""; + for( const horseScoreListing in scoreboard){ + if (scoreboard[horseScoreListing].firstPlaces > mostwins) { + mostwins = scoreboard[horseScoreListing].firstPlaces; + winningHorse = horseScoreListing; + } + } + if (mostwins > 0 ){ + console.log("The winningest horse of all time is " +winningHorse+ " with a total of " +mostwins+ " wins"); + } +} + +function deleteScoreboard() { + scoreboard = {}; + window.localStorage.setItem("cd_scoreboard", JSON.stringify(scoreboard)); +} + +let deletecheck = false; +window.addEventListener("keypress", (e)=>{ + if (e.key === 'd'){ + if (deletecheck === false){ + deletecheck = true; + console.log("Press again to delete scoreboard, press any other key to cancel"); + } + else { + console.log("deleting scoreboard"); + deleteScoreboard() + } + + }else { + deletecheck = false + } + if (e.key === "s"){ + console.log(scoreboard); + } + if(e.key ===" "){ + document.body.click(); + } + },false); \ No newline at end of file diff --git a/index.html b/index.html index 0a65c01..f91c251 100644 --- a/index.html +++ b/index.html @@ -1,23 +1,23 @@ - - - - - - Crivitz Derby - - - - - - - - - - - - - - - - + + + + + + Crivitz Derby + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/main.css b/main.css index 210ad64..351a41d 100644 --- a/main.css +++ b/main.css @@ -1,30 +1,30 @@ - -html, body{ - height: 100%; - width: 100%; - overflow: hidden; -} - -#gamecanvas{ - z-index: 200; - position: absolute; - top: 0px; - left: 0px; - /*display: block;*/ - /*margin: auto;*/ - /*border: 5px solid black;*/ - height: 100%; - width: 100%; -} - -#bgcanvas{ - z-index: 10; - position: absolute; - top: 0px; - left: 0px; - /*display: block;*/ - /*margin: auto;*/ - /*border: 5px solid black;*/ - height: 100%; - width: 100%; + +html, body{ + height: 100%; + width: 100%; + overflow: hidden; +} + +#gamecanvas{ + z-index: 200; + position: absolute; + top: 0px; + left: 0px; + /*display: block;*/ + /*margin: auto;*/ + /*border: 5px solid black;*/ + height: 100%; + width: 100%; +} + +#bgcanvas{ + z-index: 10; + position: absolute; + top: 0px; + left: 0px; + /*display: block;*/ + /*margin: auto;*/ + /*border: 5px solid black;*/ + height: 100%; + width: 100%; } \ No newline at end of file diff --git a/resources/horse_array.js b/resources/horse_array.js index d95252a..9e70e5d 100644 --- a/resources/horse_array.js +++ b/resources/horse_array.js @@ -1,19 +1,28 @@ - -const horse_array = [ - {img: "./resources/horse_images/final/a_horse.png", name: "A Horse" , owner: "Ola"}, - {img: "./resources/horse_images/final/BlackJack_10.png", name: "BlackJack", owner: "Jenn"}, - {img: "resources/horse_images/final/char_azNEIGHHble.png", name: "Char AzNIEGHHble" , owner: "Riley"}, - {img: "./resources/horse_images/final/CrotchRocket_93_raw.png", name: "CROTCH ROCKET", owner: "Ben"}, - {img: "./resources/horse_images/final/DEMON_HORZE_666.png", name: "DEMON HORZE" , owner: "Ski"}, - {img: "./resources/horse_images/final/dickzilla.png", name: "DickZilla" , owner: "Alex"}, - {img: "./resources/horse_images/final/f-TheHaters.png", name: "Fuck the Haters" , owner: "Carlos"}, - {img: "./resources/horse_images/final/GH.png", name: "GH" , owner: "Skoo"}, - {img: "./resources/horse_images/final/Horse_cock.png", name: "Horse Cock" , owner: "Ben"}, - {img: "./resources/horse_images/final/horse_san_69.png", name: "Horse-San" , owner: "Riley"}, - {img: "./resources/horse_images/final/killme112.png", name: "Kill Me" , owner: "Quinn"}, - {img: "./resources/horse_images/final/lil_sebastian.png", name: "Lil' Sebastian" , owner: "Horsey Heaven"}, - {img: "./resources/horse_images/final/stonewall_000.png", name: "Stonewall", owner: "Davie"}, - {img: "./resources/horse_images/final/nobody_cares.png", name: "Nobody Cares", owner: "Brendan"}, - {img: "./resources/horse_images/final/Raibow_sparkle.png", name: "Rainbow Sparkle", owner: "Cyndi"}, - + +const horse_array = [ + {img: "./resources/horse_images/final/a_horse.png", name: "A Horse" , owner: "Ola"}, + {img: "./resources/horse_images/final/BlackJack_10.png", name: "BlackJack", owner: "Jenn"}, + {img: "resources/horse_images/final/char_azNEIGHHble.png", name: "Char AzNIEGHHble" , owner: "Riley"}, + {img: "./resources/horse_images/final/CrotchRocket_93_raw.png", name: "CROTCH ROCKET", owner: "Ben"}, + {img: "./resources/horse_images/final/DEMON_HORZE_666.png", name: "DEMON HORZE" , owner: "Ski"}, + {img: "./resources/horse_images/final/dickzilla.png", name: "DickZilla" , owner: "Alex"}, + {img: "./resources/horse_images/final/f-TheHaters.png", name: "Fuck the Haters" , owner: "Carlos"}, + {img: "./resources/horse_images/final/GH.png", name: "GH" , owner: "Skoo"}, + {img: "./resources/horse_images/final/Horse_cock.png", name: "Horse Cock" , owner: "Ben"}, + {img: "./resources/horse_images/final/horse_san_69.png", name: "Horse-San" , owner: "Riley"}, + {img: "./resources/horse_images/final/killme112.png", name: "Kill Me" , owner: "Quinn"}, + {img: "./resources/horse_images/final/lil_sebastian.png", name: "Lil' Sebastian" , owner: "Horsey Heaven"}, + {img: "./resources/horse_images/final/stonewall_000.png", name: "Stonewall", owner: "Davie"}, + {img: "./resources/horse_images/final/nobody_cares.png", name: "Nobody Cares", owner: "Brendan"}, + {img: "./resources/horse_images/final/Raibow_sparkle.png", name: "Rainbow Sparkle", owner: "Cyndi"}, + {img: "./resources/horse_images/final/arthur_horsegan.png", name: "Arthur Horsegan", owner: "Zucchini"}, + {img: "./resources/horse_images/final/arthur_morgan.png", name: "Arthur Morgan", owner: "Carlos"}, + {img: "./resources/horse_images/final/bob.png", name: "Bob", owner: "Ski"}, + {img: "./resources/horse_images/final/elmers.png", name: "Elmers", owner: "Quinn"}, + {img: "./resources/horse_images/final/hugsy.png", name: "Hugsy", owner: "Jenn"}, + {img: "./resources/horse_images/final/ikea.png", name: "Ikea", owner: "Quinn"}, + {img: "./resources/horse_images/final/platty.png", name: "Platty", owner: "Ski"}, + {img: "./resources/horse_images/final/saweetie.png", name: "Saweetie", owner: "Ola"}, + {img: "./resources/horse_images/final/Shitty_ponyta.png", name: "Shitty Ponyta", owner: "Zucchini"}, + {img: "./resources/horse_images/final/Hand_Banana.png", name: "Hand Banana", owner: "Carl"}, ]; \ No newline at end of file diff --git a/resources/horse_images/final/Hand_Banana.png b/resources/horse_images/final/Hand_Banana.png new file mode 100644 index 0000000..87f157a Binary files /dev/null and b/resources/horse_images/final/Hand_Banana.png differ diff --git a/resources/horse_images/final/Shitty_ponyta.png b/resources/horse_images/final/Shitty_ponyta.png new file mode 100644 index 0000000..1095b66 Binary files /dev/null and b/resources/horse_images/final/Shitty_ponyta.png differ diff --git a/resources/horse_images/final/arthur_horsegan.png b/resources/horse_images/final/arthur_horsegan.png new file mode 100644 index 0000000..b42cbf8 Binary files /dev/null and b/resources/horse_images/final/arthur_horsegan.png differ diff --git a/resources/horse_images/final/arthur_morgan.png b/resources/horse_images/final/arthur_morgan.png new file mode 100644 index 0000000..7230813 Binary files /dev/null and b/resources/horse_images/final/arthur_morgan.png differ diff --git a/resources/horse_images/final/bob.png b/resources/horse_images/final/bob.png new file mode 100644 index 0000000..e63f223 Binary files /dev/null and b/resources/horse_images/final/bob.png differ diff --git a/resources/horse_images/final/elmers.png b/resources/horse_images/final/elmers.png new file mode 100644 index 0000000..f99c993 Binary files /dev/null and b/resources/horse_images/final/elmers.png differ diff --git a/resources/horse_images/final/hugsy.png b/resources/horse_images/final/hugsy.png new file mode 100644 index 0000000..154c643 Binary files /dev/null and b/resources/horse_images/final/hugsy.png differ diff --git a/resources/horse_images/final/ikea.png b/resources/horse_images/final/ikea.png new file mode 100644 index 0000000..0d48ced Binary files /dev/null and b/resources/horse_images/final/ikea.png differ diff --git a/resources/horse_images/final/platty.png b/resources/horse_images/final/platty.png new file mode 100644 index 0000000..9eae181 Binary files /dev/null and b/resources/horse_images/final/platty.png differ diff --git a/resources/horse_images/final/saweetie.png b/resources/horse_images/final/saweetie.png new file mode 100644 index 0000000..b03c643 Binary files /dev/null and b/resources/horse_images/final/saweetie.png differ diff --git a/resources/libs/howler.core.min.js b/resources/libs/howler.core.min.js index 0efa24c..ec24545 100644 --- a/resources/libs/howler.core.min.js +++ b/resources/libs/howler.core.min.js @@ -1,2 +1,2 @@ -/*! howler.js v2.1.2 | (c) 2013-2019, James Simpson of GoldFire Studios | MIT License | howlerjs.com */ +/*! howler.js v2.1.2 | (c) 2013-2019, James Simpson of GoldFire Studios | MIT License | howlerjs.com */ !function(){"use strict";var e=function(){this.init()};e.prototype={init:function(){var e=this||n;return e._counter=1e3,e._html5AudioPool=[],e.html5PoolSize=10,e._codecs={},e._howls=[],e._muted=!1,e._volume=1,e._canPlayEvent="canplaythrough",e._navigator="undefined"!=typeof window&&window.navigator?window.navigator:null,e.masterGain=null,e.noAudio=!1,e.usingWebAudio=!0,e.autoSuspend=!0,e.ctx=null,e.autoUnlock=!0,e._setup(),e},volume:function(e){var o=this||n;if(e=parseFloat(e),o.ctx||_(),void 0!==e&&e>=0&&e<=1){if(o._volume=e,o._muted)return o;o.usingWebAudio&&o.masterGain.gain.setValueAtTime(e,n.ctx.currentTime);for(var t=0;t=0;o--)e._howls[o].unload();return e.usingWebAudio&&e.ctx&&void 0!==e.ctx.close&&(e.ctx.close(),e.ctx=null,_()),e},codecs:function(e){return(this||n)._codecs[e.replace(/^x-/,"")]},_setup:function(){var e=this||n;if(e.state=e.ctx?e.ctx.state||"suspended":"suspended",e._autoSuspend(),!e.usingWebAudio)if("undefined"!=typeof Audio)try{var o=new Audio;void 0===o.oncanplaythrough&&(e._canPlayEvent="canplay")}catch(n){e.noAudio=!0}else e.noAudio=!0;try{var o=new Audio;o.muted&&(e.noAudio=!0)}catch(e){}return e.noAudio||e._setupCodecs(),e},_setupCodecs:function(){var e=this||n,o=null;try{o="undefined"!=typeof Audio?new Audio:null}catch(n){return e}if(!o||"function"!=typeof o.canPlayType)return e;var t=o.canPlayType("audio/mpeg;").replace(/^no$/,""),r=e._navigator&&e._navigator.userAgent.match(/OPR\/([0-6].)/g),a=r&&parseInt(r[0].split("/")[1],10)<33;return e._codecs={mp3:!(a||!t&&!o.canPlayType("audio/mp3;").replace(/^no$/,"")),mpeg:!!t,opus:!!o.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/,""),ogg:!!o.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),oga:!!o.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),wav:!!o.canPlayType('audio/wav; codecs="1"').replace(/^no$/,""),aac:!!o.canPlayType("audio/aac;").replace(/^no$/,""),caf:!!o.canPlayType("audio/x-caf;").replace(/^no$/,""),m4a:!!(o.canPlayType("audio/x-m4a;")||o.canPlayType("audio/m4a;")||o.canPlayType("audio/aac;")).replace(/^no$/,""),mp4:!!(o.canPlayType("audio/x-mp4;")||o.canPlayType("audio/mp4;")||o.canPlayType("audio/aac;")).replace(/^no$/,""),weba:!!o.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/,""),webm:!!o.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/,""),dolby:!!o.canPlayType('audio/mp4; codecs="ec-3"').replace(/^no$/,""),flac:!!(o.canPlayType("audio/x-flac;")||o.canPlayType("audio/flac;")).replace(/^no$/,"")},e},_unlockAudio:function(){var e=this||n;if(!e._audioUnlocked&&e.ctx){e._audioUnlocked=!1,e.autoUnlock=!1,e._mobileUnloaded||44100===e.ctx.sampleRate||(e._mobileUnloaded=!0,e.unload()),e._scratchBuffer=e.ctx.createBuffer(1,1,22050);var o=function(n){for(var t=0;t0?i._seek:t._sprite[e][0]/1e3),s=Math.max(0,(t._sprite[e][0]+t._sprite[e][1])/1e3-_),l=1e3*s/Math.abs(i._rate),c=t._sprite[e][0]/1e3,f=(t._sprite[e][0]+t._sprite[e][1])/1e3,p=!(!i._loop&&!t._sprite[e][2]);i._sprite=e,i._ended=!1;var m=function(){i._paused=!1,i._seek=_,i._start=c,i._stop=f,i._loop=p};if(_>=f)return void t._ended(i);var v=i._node;if(t._webAudio){var h=function(){t._playLock=!1,m(),t._refreshBuffer(i);var e=i._muted||t._muted?0:i._volume;v.gain.setValueAtTime(e,n.ctx.currentTime),i._playStart=n.ctx.currentTime,void 0===v.bufferSource.start?i._loop?v.bufferSource.noteGrainOn(0,_,86400):v.bufferSource.noteGrainOn(0,_,s):i._loop?v.bufferSource.start(0,_,86400):v.bufferSource.start(0,_,s),l!==1/0&&(t._endTimers[i._id]=setTimeout(t._ended.bind(t,i),l)),o||setTimeout(function(){t._emit("play",i._id),t._loadQueue()},0)};"running"===n.state?h():(t._playLock=!0,t.once("resume",h),t._clearTimer(i._id))}else{var y=function(){v.currentTime=_,v.muted=i._muted||t._muted||n._muted||v.muted,v.volume=i._volume*n.volume(),v.playbackRate=i._rate;try{var r=v.play();if(r&&"undefined"!=typeof Promise&&(r instanceof Promise||"function"==typeof r.then)?(t._playLock=!0,m(),r.then(function(){t._playLock=!1,v._unlocked=!0,o||(t._emit("play",i._id),t._loadQueue())}).catch(function(){t._playLock=!1,t._emit("playerror",i._id,"Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction."),i._ended=!0,i._paused=!0})):o||(t._playLock=!1,m(),t._emit("play",i._id),t._loadQueue()),v.playbackRate=i._rate,v.paused)return void t._emit("playerror",i._id,"Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction.");"__default"!==e||i._loop?t._endTimers[i._id]=setTimeout(t._ended.bind(t,i),l):(t._endTimers[i._id]=function(){t._ended(i),v.removeEventListener("ended",t._endTimers[i._id],!1)},v.addEventListener("ended",t._endTimers[i._id],!1))}catch(e){t._emit("playerror",i._id,e)}};"data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA"===v.src&&(v.src=t._src,v.load());var g=window&&window.ejecta||!v.readyState&&n._navigator.isCocoonJS;if(v.readyState>=3||g)y();else{t._playLock=!0;var A=function(){y(),v.removeEventListener(n._canPlayEvent,A,!1)};v.addEventListener(n._canPlayEvent,A,!1),t._clearTimer(i._id)}}return i._id},pause:function(e){var n=this;if("loaded"!==n._state||n._playLock)return n._queue.push({event:"pause",action:function(){n.pause(e)}}),n;for(var o=n._getSoundIds(e),t=0;t=0?o=parseInt(r[0],10):e=parseFloat(r[0])}else r.length>=2&&(e=parseFloat(r[0]),o=parseInt(r[1],10));var a;if(!(void 0!==e&&e>=0&&e<=1))return a=o?t._soundById(o):t._sounds[0],a?a._volume:0;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"volume",action:function(){t.volume.apply(t,r)}}),t;void 0===o&&(t._volume=e),o=t._getSoundIds(o);for(var u=0;u0?t/_:t),l=Date.now();e._fadeTo=o,e._interval=setInterval(function(){var r=(Date.now()-l)/t;l=Date.now(),i+=d*r,i=Math.max(0,i),i=Math.min(1,i),i=Math.round(100*i)/100,u._webAudio?e._volume=i:u.volume(i,e._id,!0),a&&(u._volume=i),(on&&i>=o)&&(clearInterval(e._interval),e._interval=null,e._fadeTo=null,u.volume(o,e._id),u._emit("fade",e._id))},s)},_stopFade:function(e){var o=this,t=o._soundById(e);return t&&t._interval&&(o._webAudio&&t._node.gain.cancelScheduledValues(n.ctx.currentTime),clearInterval(t._interval),t._interval=null,o.volume(t._fadeTo,e),t._fadeTo=null,o._emit("fade",e)),o},loop:function(){var e,n,o,t=this,r=arguments;if(0===r.length)return t._loop;if(1===r.length){if("boolean"!=typeof r[0])return!!(o=t._soundById(parseInt(r[0],10)))&&o._loop;e=r[0],t._loop=e}else 2===r.length&&(e=r[0],n=parseInt(r[1],10));for(var a=t._getSoundIds(n),u=0;u=0?o=parseInt(r[0],10):e=parseFloat(r[0])}else 2===r.length&&(e=parseFloat(r[0]),o=parseInt(r[1],10));var i;if("number"!=typeof e)return i=t._soundById(o),i?i._rate:t._rate;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"rate",action:function(){t.rate.apply(t,r)}}),t;void 0===o&&(t._rate=e),o=t._getSoundIds(o);for(var d=0;d=0?o=parseInt(r[0],10):t._sounds.length&&(o=t._sounds[0]._id,e=parseFloat(r[0]))}else 2===r.length&&(e=parseFloat(r[0]),o=parseInt(r[1],10));if(void 0===o)return t;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"seek",action:function(){t.seek.apply(t,r)}}),t;var i=t._soundById(o);if(i){if(!("number"==typeof e&&e>=0)){if(t._webAudio){var d=t.playing(o)?n.ctx.currentTime-i._playStart:0,_=i._rateSeek?i._rateSeek-i._seek:0;return i._seek+(_+d*Math.abs(i._rate))}return i._node.currentTime}var s=t.playing(o);s&&t.pause(o,!0),i._seek=e,i._ended=!1,t._clearTimer(o),t._webAudio||!i._node||isNaN(i._node.duration)||(i._node.currentTime=e);var l=function(){t._emit("seek",o),s&&t.play(o,!0)};if(s&&!t._webAudio){var c=function(){t._playLock?setTimeout(c,0):l()};setTimeout(c,0)}else l()}return t},playing:function(e){var n=this;if("number"==typeof e){var o=n._soundById(e);return!!o&&!o._paused}for(var t=0;t=0&&n._howls.splice(a,1);var u=!0;for(t=0;t=0){u=!1;break}return r&&u&&delete r[e._src],n.noAudio=!1,e._state="unloaded",e._sounds=[],e=null,null},on:function(e,n,o,t){var r=this,a=r["_on"+e];return"function"==typeof n&&a.push(t?{id:o,fn:n,once:t}:{id:o,fn:n}),r},off:function(e,n,o){var t=this,r=t["_on"+e],a=0;if("number"==typeof n&&(o=n,n=null),n||o)for(a=0;a=0;a--)r[a].id&&r[a].id!==n&&"load"!==e||(setTimeout(function(e){e.call(this,n,o)}.bind(t,r[a].fn),0),r[a].once&&t.off(e,r[a].fn,r[a].id));return t._loadQueue(e),t},_loadQueue:function(e){var n=this;if(n._queue.length>0){var o=n._queue[0];o.event===e&&(n._queue.shift(),n._loadQueue()),e||o.action()}return n},_ended:function(e){var o=this,t=e._sprite;if(!o._webAudio&&e._node&&!e._node.paused&&!e._node.ended&&e._node.currentTime=0;t--){if(o<=n)return;e._sounds[t]._ended&&(e._webAudio&&e._sounds[t]._node&&e._sounds[t]._node.disconnect(0),e._sounds.splice(t,1),o--)}}},_getSoundIds:function(e){var n=this;if(void 0===e){for(var o=[],t=0;t=0;if(n._scratchBuffer&&e.bufferSource&&(e.bufferSource.onended=null,e.bufferSource.disconnect(0),t))try{e.bufferSource.buffer=n._scratchBuffer}catch(e){}return e.bufferSource=null,o},_clearSound:function(e){/MSIE |Trident\//.test(n._navigator&&n._navigator.userAgent)||(e.src="data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA")}};var t=function(e){this._parent=e,this.init()};t.prototype={init:function(){var e=this,o=e._parent;return e._muted=o._muted,e._loop=o._loop,e._volume=o._volume,e._rate=o._rate,e._seek=0,e._paused=!0,e._ended=!0,e._sprite="__default",e._id=++n._counter,o._sounds.push(e),e.create(),e},create:function(){var e=this,o=e._parent,t=n._muted||e._muted||e._parent._muted?0:e._volume;return o._webAudio?(e._node=void 0===n.ctx.createGain?n.ctx.createGainNode():n.ctx.createGain(),e._node.gain.setValueAtTime(t,n.ctx.currentTime),e._node.paused=!0,e._node.connect(n.masterGain)):(e._node=n._obtainHtml5Audio(),e._errorFn=e._errorListener.bind(e),e._node.addEventListener("error",e._errorFn,!1),e._loadFn=e._loadListener.bind(e),e._node.addEventListener(n._canPlayEvent,e._loadFn,!1),e._node.src=o._src,e._node.preload="auto",e._node.volume=t*n.volume(),e._node.load()),e},reset:function(){var e=this,o=e._parent;return e._muted=o._muted,e._loop=o._loop,e._volume=o._volume,e._rate=o._rate,e._seek=0,e._rateSeek=0,e._paused=!0,e._ended=!0,e._sprite="__default",e._id=++n._counter,e},_errorListener:function(){var e=this;e._parent._emit("loaderror",e._id,e._node.error?e._node.error.code:0),e._node.removeEventListener("error",e._errorFn,!1)},_loadListener:function(){var e=this,o=e._parent;o._duration=Math.ceil(10*e._node.duration)/10,0===Object.keys(o._sprite).length&&(o._sprite={__default:[0,1e3*o._duration]}),"loaded"!==o._state&&(o._state="loaded",o._emit("load"),o._loadQueue()),e._node.removeEventListener(n._canPlayEvent,e._loadFn,!1)}};var r={},a=function(e){var n=e._src;if(r[n])return e._duration=r[n].duration,void d(e);if(/^data:[^;]+;base64,/.test(n)){for(var o=atob(n.split(",")[1]),t=new Uint8Array(o.length),a=0;a0?(r[o._src]=e,d(o,e)):t()};"undefined"!=typeof Promise&&1===n.ctx.decodeAudioData.length?n.ctx.decodeAudioData(e).then(a).catch(t):n.ctx.decodeAudioData(e,a,t)},d=function(e,n){n&&!e._duration&&(e._duration=n.duration),0===Object.keys(e._sprite).length&&(e._sprite={__default:[0,1e3*e._duration]}),"loaded"!==e._state&&(e._state="loaded",e._emit("load"),e._loadQueue())},_=function(){if(n.usingWebAudio){try{"undefined"!=typeof AudioContext?n.ctx=new AudioContext:"undefined"!=typeof webkitAudioContext?n.ctx=new webkitAudioContext:n.usingWebAudio=!1}catch(e){n.usingWebAudio=!1}n.ctx||(n.usingWebAudio=!1);var e=/iP(hone|od|ad)/.test(n._navigator&&n._navigator.platform),o=n._navigator&&n._navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/),t=o?parseInt(o[1],10):null;if(e&&t&&t<9){var r=/safari/.test(n._navigator&&n._navigator.userAgent.toLowerCase());(n._navigator&&n._navigator.standalone&&!r||n._navigator&&!n._navigator.standalone&&!r)&&(n.usingWebAudio=!1)}n.usingWebAudio&&(n.masterGain=void 0===n.ctx.createGain?n.ctx.createGainNode():n.ctx.createGain(),n.masterGain.gain.setValueAtTime(n._muted?0:1,n.ctx.currentTime),n.masterGain.connect(n.ctx.destination)),n._setup()}};"function"==typeof define&&define.amd&&define([],function(){return{Howler:n,Howl:o}}),"undefined"!=typeof exports&&(exports.Howler=n,exports.Howl=o),"undefined"!=typeof window?(window.HowlerGlobal=e,window.Howler=n,window.Howl=o,window.Sound=t):"undefined"!=typeof global&&(global.HowlerGlobal=e,global.Howler=n,global.Howl=o,global.Sound=t)}(); \ No newline at end of file diff --git a/resources/libs/howler.js b/resources/libs/howler.js index d0022fc..7142eb8 100644 --- a/resources/libs/howler.js +++ b/resources/libs/howler.js @@ -1,3157 +1,3157 @@ -/*! - * howler.js v2.1.2 - * howlerjs.com - * - * (c) 2013-2019, James Simpson of GoldFire Studios - * goldfirestudios.com - * - * MIT License - */ - -(function() { - - 'use strict'; - - /** Global Methods **/ - /***************************************************************************/ - - /** - * Create the global controller. All contained methods and properties apply - * to all sounds that are currently playing or will be in the future. - */ - var HowlerGlobal = function() { - this.init(); - }; - HowlerGlobal.prototype = { - /** - * Initialize the global Howler object. - * @return {Howler} - */ - init: function() { - var self = this || Howler; - - // Create a global ID counter. - self._counter = 1000; - - // Pool of unlocked HTML5 Audio objects. - self._html5AudioPool = []; - self.html5PoolSize = 10; - - // Internal properties. - self._codecs = {}; - self._howls = []; - self._muted = false; - self._volume = 1; - self._canPlayEvent = 'canplaythrough'; - self._navigator = (typeof window !== 'undefined' && window.navigator) ? window.navigator : null; - - // Public properties. - self.masterGain = null; - self.noAudio = false; - self.usingWebAudio = true; - self.autoSuspend = true; - self.ctx = null; - - // Set to false to disable the auto audio unlocker. - self.autoUnlock = true; - - // Setup the various state values for global tracking. - self._setup(); - - return self; - }, - - /** - * Get/set the global volume for all sounds. - * @param {Float} vol Volume from 0.0 to 1.0. - * @return {Howler/Float} Returns self or current volume. - */ - volume: function(vol) { - var self = this || Howler; - vol = parseFloat(vol); - - // If we don't have an AudioContext created yet, run the setup. - if (!self.ctx) { - setupAudioContext(); - } - - if (typeof vol !== 'undefined' && vol >= 0 && vol <= 1) { - self._volume = vol; - - // Don't update any of the nodes if we are muted. - if (self._muted) { - return self; - } - - // When using Web Audio, we just need to adjust the master gain. - if (self.usingWebAudio) { - self.masterGain.gain.setValueAtTime(vol, Howler.ctx.currentTime); - } - - // Loop through and change volume for all HTML5 audio nodes. - for (var i=0; i=0; i--) { - self._howls[i].unload(); - } - - // Create a new AudioContext to make sure it is fully reset. - if (self.usingWebAudio && self.ctx && typeof self.ctx.close !== 'undefined') { - self.ctx.close(); - self.ctx = null; - setupAudioContext(); - } - - return self; - }, - - /** - * Check for codec support of specific extension. - * @param {String} ext Audio file extention. - * @return {Boolean} - */ - codecs: function(ext) { - return (this || Howler)._codecs[ext.replace(/^x-/, '')]; - }, - - /** - * Setup various state values for global tracking. - * @return {Howler} - */ - _setup: function() { - var self = this || Howler; - - // Keeps track of the suspend/resume state of the AudioContext. - self.state = self.ctx ? self.ctx.state || 'suspended' : 'suspended'; - - // Automatically begin the 30-second suspend process - self._autoSuspend(); - - // Check if audio is available. - if (!self.usingWebAudio) { - // No audio is available on this system if noAudio is set to true. - if (typeof Audio !== 'undefined') { - try { - var test = new Audio(); - - // Check if the canplaythrough event is available. - if (typeof test.oncanplaythrough === 'undefined') { - self._canPlayEvent = 'canplay'; - } - } catch(e) { - self.noAudio = true; - } - } else { - self.noAudio = true; - } - } - - // Test to make sure audio isn't disabled in Internet Explorer. - try { - var test = new Audio(); - if (test.muted) { - self.noAudio = true; - } - } catch (e) {} - - // Check for supported codecs. - if (!self.noAudio) { - self._setupCodecs(); - } - - return self; - }, - - /** - * Check for browser support for various codecs and cache the results. - * @return {Howler} - */ - _setupCodecs: function() { - var self = this || Howler; - var audioTest = null; - - // Must wrap in a try/catch because IE11 in server mode throws an error. - try { - audioTest = (typeof Audio !== 'undefined') ? new Audio() : null; - } catch (err) { - return self; - } - - if (!audioTest || typeof audioTest.canPlayType !== 'function') { - return self; - } - - var mpegTest = audioTest.canPlayType('audio/mpeg;').replace(/^no$/, ''); - - // Opera version <33 has mixed MP3 support, so we need to check for and block it. - var checkOpera = self._navigator && self._navigator.userAgent.match(/OPR\/([0-6].)/g); - var isOldOpera = (checkOpera && parseInt(checkOpera[0].split('/')[1], 10) < 33); - - self._codecs = { - mp3: !!(!isOldOpera && (mpegTest || audioTest.canPlayType('audio/mp3;').replace(/^no$/, ''))), - mpeg: !!mpegTest, - opus: !!audioTest.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/, ''), - ogg: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ''), - oga: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ''), - wav: !!audioTest.canPlayType('audio/wav; codecs="1"').replace(/^no$/, ''), - aac: !!audioTest.canPlayType('audio/aac;').replace(/^no$/, ''), - caf: !!audioTest.canPlayType('audio/x-caf;').replace(/^no$/, ''), - m4a: !!(audioTest.canPlayType('audio/x-m4a;') || audioTest.canPlayType('audio/m4a;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''), - mp4: !!(audioTest.canPlayType('audio/x-mp4;') || audioTest.canPlayType('audio/mp4;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''), - weba: !!audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, ''), - webm: !!audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, ''), - dolby: !!audioTest.canPlayType('audio/mp4; codecs="ec-3"').replace(/^no$/, ''), - flac: !!(audioTest.canPlayType('audio/x-flac;') || audioTest.canPlayType('audio/flac;')).replace(/^no$/, '') - }; - - return self; - }, - - /** - * Some browsers/devices will only allow audio to be played after a user interaction. - * Attempt to automatically unlock audio on the first user interaction. - * Concept from: http://paulbakaus.com/tutorials/html5/web-audio-on-ios/ - * @return {Howler} - */ - _unlockAudio: function() { - var self = this || Howler; - - // Only run this if Web Audio is supported and it hasn't already been unlocked. - if (self._audioUnlocked || !self.ctx) { - return; - } - - self._audioUnlocked = false; - self.autoUnlock = false; - - // Some mobile devices/platforms have distortion issues when opening/closing tabs and/or web views. - // Bugs in the browser (especially Mobile Safari) can cause the sampleRate to change from 44100 to 48000. - // By calling Howler.unload(), we create a new AudioContext with the correct sampleRate. - if (!self._mobileUnloaded && self.ctx.sampleRate !== 44100) { - self._mobileUnloaded = true; - self.unload(); - } - - // Scratch buffer for enabling iOS to dispose of web audio buffers correctly, as per: - // http://stackoverflow.com/questions/24119684 - self._scratchBuffer = self.ctx.createBuffer(1, 1, 22050); - - // Call this method on touch start to create and play a buffer, - // then check if the audio actually played to determine if - // audio has now been unlocked on iOS, Android, etc. - var unlock = function(e) { - // Create a pool of unlocked HTML5 Audio objects that can - // be used for playing sounds without user interaction. HTML5 - // Audio objects must be individually unlocked, as opposed - // to the WebAudio API which only needs a single activation. - // This must occur before WebAudio setup or the source.onended - // event will not fire. - for (var i=0; i= 55. - if (typeof self.ctx.resume === 'function') { - self.ctx.resume(); - } - - // Setup a timeout to check that we are unlocked on the next event loop. - source.onended = function() { - source.disconnect(0); - - // Update the unlocked state and prevent this check from happening again. - self._audioUnlocked = true; - - // Remove the touch start listener. - document.removeEventListener('touchstart', unlock, true); - document.removeEventListener('touchend', unlock, true); - document.removeEventListener('click', unlock, true); - - // Let all sounds know that audio has been unlocked. - for (var i=0; i 0 ? sound._seek : self._sprite[sprite][0] / 1000); - var duration = Math.max(0, ((self._sprite[sprite][0] + self._sprite[sprite][1]) / 1000) - seek); - var timeout = (duration * 1000) / Math.abs(sound._rate); - var start = self._sprite[sprite][0] / 1000; - var stop = (self._sprite[sprite][0] + self._sprite[sprite][1]) / 1000; - var loop = !!(sound._loop || self._sprite[sprite][2]); - sound._sprite = sprite; - - // Mark the sound as ended instantly so that this async playback - // doesn't get grabbed by another call to play while this one waits to start. - sound._ended = false; - - // Update the parameters of the sound. - var setParams = function() { - sound._paused = false; - sound._seek = seek; - sound._start = start; - sound._stop = stop; - sound._loop = loop; - }; - - // End the sound instantly if seek is at the end. - if (seek >= stop) { - self._ended(sound); - return; - } - - // Begin the actual playback. - var node = sound._node; - if (self._webAudio) { - // Fire this when the sound is ready to play to begin Web Audio playback. - var playWebAudio = function() { - self._playLock = false; - setParams(); - self._refreshBuffer(sound); - - // Setup the playback params. - var vol = (sound._muted || self._muted) ? 0 : sound._volume; - node.gain.setValueAtTime(vol, Howler.ctx.currentTime); - sound._playStart = Howler.ctx.currentTime; - - // Play the sound using the supported method. - if (typeof node.bufferSource.start === 'undefined') { - sound._loop ? node.bufferSource.noteGrainOn(0, seek, 86400) : node.bufferSource.noteGrainOn(0, seek, duration); - } else { - sound._loop ? node.bufferSource.start(0, seek, 86400) : node.bufferSource.start(0, seek, duration); - } - - // Start a new timer if none is present. - if (timeout !== Infinity) { - self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout); - } - - if (!internal) { - setTimeout(function() { - self._emit('play', sound._id); - self._loadQueue(); - }, 0); - } - }; - - if (Howler.state === 'running') { - playWebAudio(); - } else { - self._playLock = true; - - // Wait for the audio context to resume before playing. - self.once('resume', playWebAudio); - - // Cancel the end timer. - self._clearTimer(sound._id); - } - } else { - // Fire this when the sound is ready to play to begin HTML5 Audio playback. - var playHtml5 = function() { - node.currentTime = seek; - node.muted = sound._muted || self._muted || Howler._muted || node.muted; - node.volume = sound._volume * Howler.volume(); - node.playbackRate = sound._rate; - - // Some browsers will throw an error if this is called without user interaction. - try { - var play = node.play(); - - // Support older browsers that don't support promises, and thus don't have this issue. - if (play && typeof Promise !== 'undefined' && (play instanceof Promise || typeof play.then === 'function')) { - // Implements a lock to prevent DOMException: The play() request was interrupted by a call to pause(). - self._playLock = true; - - // Set param values immediately. - setParams(); - - // Releases the lock and executes queued actions. - play - .then(function() { - self._playLock = false; - node._unlocked = true; - if (!internal) { - self._emit('play', sound._id); - self._loadQueue(); - } - }) - .catch(function() { - self._playLock = false; - self._emit('playerror', sound._id, 'Playback was unable to start. This is most commonly an issue ' + - 'on mobile devices and Chrome where playback was not within a user interaction.'); - - // Reset the ended and paused values. - sound._ended = true; - sound._paused = true; - }); - } else if (!internal) { - self._playLock = false; - setParams(); - self._emit('play', sound._id); - self._loadQueue(); - } - - // Setting rate before playing won't work in IE, so we set it again here. - node.playbackRate = sound._rate; - - // If the node is still paused, then we can assume there was a playback issue. - if (node.paused) { - self._emit('playerror', sound._id, 'Playback was unable to start. This is most commonly an issue ' + - 'on mobile devices and Chrome where playback was not within a user interaction.'); - return; - } - - // Setup the end timer on sprites or listen for the ended event. - if (sprite !== '__default' || sound._loop) { - self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout); - } else { - self._endTimers[sound._id] = function() { - // Fire ended on this audio node. - self._ended(sound); - - // Clear this listener. - node.removeEventListener('ended', self._endTimers[sound._id], false); - }; - node.addEventListener('ended', self._endTimers[sound._id], false); - } - } catch (err) { - self._emit('playerror', sound._id, err); - } - }; - - // If this is streaming audio, make sure the src is set and load again. - if (node.src === 'data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA') { - node.src = self._src; - node.load(); - } - - // Play immediately if ready, or wait for the 'canplaythrough'e vent. - var loadedNoReadyState = (window && window.ejecta) || (!node.readyState && Howler._navigator.isCocoonJS); - if (node.readyState >= 3 || loadedNoReadyState) { - playHtml5(); - } else { - self._playLock = true; - - var listener = function() { - // Begin playback. - playHtml5(); - - // Clear this listener. - node.removeEventListener(Howler._canPlayEvent, listener, false); - }; - node.addEventListener(Howler._canPlayEvent, listener, false); - - // Cancel the end timer. - self._clearTimer(sound._id); - } - } - - return sound._id; - }, - - /** - * Pause playback and save current position. - * @param {Number} id The sound ID (empty to pause all in group). - * @return {Howl} - */ - pause: function(id) { - var self = this; - - // If the sound hasn't loaded or a play() promise is pending, add it to the load queue to pause when capable. - if (self._state !== 'loaded' || self._playLock) { - self._queue.push({ - event: 'pause', - action: function() { - self.pause(id); - } - }); - - return self; - } - - // If no id is passed, get all ID's to be paused. - var ids = self._getSoundIds(id); - - for (var i=0; i Returns the group's volume value. - * volume(id) -> Returns the sound id's current volume. - * volume(vol) -> Sets the volume of all sounds in this Howl group. - * volume(vol, id) -> Sets the volume of passed sound id. - * @return {Howl/Number} Returns self or current volume. - */ - volume: function() { - var self = this; - var args = arguments; - var vol, id; - - // Determine the values based on arguments. - if (args.length === 0) { - // Return the value of the groups' volume. - return self._volume; - } else if (args.length === 1 || args.length === 2 && typeof args[1] === 'undefined') { - // First check if this is an ID, and if not, assume it is a new volume. - var ids = self._getSoundIds(); - var index = ids.indexOf(args[0]); - if (index >= 0) { - id = parseInt(args[0], 10); - } else { - vol = parseFloat(args[0]); - } - } else if (args.length >= 2) { - vol = parseFloat(args[0]); - id = parseInt(args[1], 10); - } - - // Update the volume or return the current volume. - var sound; - if (typeof vol !== 'undefined' && vol >= 0 && vol <= 1) { - // If the sound hasn't loaded, add it to the load queue to change volume when capable. - if (self._state !== 'loaded'|| self._playLock) { - self._queue.push({ - event: 'volume', - action: function() { - self.volume.apply(self, args); - } - }); - - return self; - } - - // Set the group volume. - if (typeof id === 'undefined') { - self._volume = vol; - } - - // Update one or all volumes. - id = self._getSoundIds(id); - for (var i=0; i 0) ? len / steps : len); - var lastTick = Date.now(); - - // Store the value being faded to. - sound._fadeTo = to; - - // Update the volume value on each interval tick. - sound._interval = setInterval(function() { - // Update the volume based on the time since the last tick. - var tick = (Date.now() - lastTick) / len; - lastTick = Date.now(); - vol += diff * tick; - - // Make sure the volume is in the right bounds. - vol = Math.max(0, vol); - vol = Math.min(1, vol); - - // Round to within 2 decimal points. - vol = Math.round(vol * 100) / 100; - - // Change the volume. - if (self._webAudio) { - sound._volume = vol; - } else { - self.volume(vol, sound._id, true); - } - - // Set the group's volume. - if (isGroup) { - self._volume = vol; - } - - // When the fade is complete, stop it and fire event. - if ((to < from && vol <= to) || (to > from && vol >= to)) { - clearInterval(sound._interval); - sound._interval = null; - sound._fadeTo = null; - self.volume(to, sound._id); - self._emit('fade', sound._id); - } - }, stepLen); - }, - - /** - * Internal method that stops the currently playing fade when - * a new fade starts, volume is changed or the sound is stopped. - * @param {Number} id The sound id. - * @return {Howl} - */ - _stopFade: function(id) { - var self = this; - var sound = self._soundById(id); - - if (sound && sound._interval) { - if (self._webAudio) { - sound._node.gain.cancelScheduledValues(Howler.ctx.currentTime); - } - - clearInterval(sound._interval); - sound._interval = null; - self.volume(sound._fadeTo, id); - sound._fadeTo = null; - self._emit('fade', id); - } - - return self; - }, - - /** - * Get/set the loop parameter on a sound. This method can optionally take 0, 1 or 2 arguments. - * loop() -> Returns the group's loop value. - * loop(id) -> Returns the sound id's loop value. - * loop(loop) -> Sets the loop value for all sounds in this Howl group. - * loop(loop, id) -> Sets the loop value of passed sound id. - * @return {Howl/Boolean} Returns self or current loop value. - */ - loop: function() { - var self = this; - var args = arguments; - var loop, id, sound; - - // Determine the values for loop and id. - if (args.length === 0) { - // Return the grou's loop value. - return self._loop; - } else if (args.length === 1) { - if (typeof args[0] === 'boolean') { - loop = args[0]; - self._loop = loop; - } else { - // Return this sound's loop value. - sound = self._soundById(parseInt(args[0], 10)); - return sound ? sound._loop : false; - } - } else if (args.length === 2) { - loop = args[0]; - id = parseInt(args[1], 10); - } - - // If no id is passed, get all ID's to be looped. - var ids = self._getSoundIds(id); - for (var i=0; i Returns the first sound node's current playback rate. - * rate(id) -> Returns the sound id's current playback rate. - * rate(rate) -> Sets the playback rate of all sounds in this Howl group. - * rate(rate, id) -> Sets the playback rate of passed sound id. - * @return {Howl/Number} Returns self or the current playback rate. - */ - rate: function() { - var self = this; - var args = arguments; - var rate, id; - - // Determine the values based on arguments. - if (args.length === 0) { - // We will simply return the current rate of the first node. - id = self._sounds[0]._id; - } else if (args.length === 1) { - // First check if this is an ID, and if not, assume it is a new rate value. - var ids = self._getSoundIds(); - var index = ids.indexOf(args[0]); - if (index >= 0) { - id = parseInt(args[0], 10); - } else { - rate = parseFloat(args[0]); - } - } else if (args.length === 2) { - rate = parseFloat(args[0]); - id = parseInt(args[1], 10); - } - - // Update the playback rate or return the current value. - var sound; - if (typeof rate === 'number') { - // If the sound hasn't loaded, add it to the load queue to change playback rate when capable. - if (self._state !== 'loaded' || self._playLock) { - self._queue.push({ - event: 'rate', - action: function() { - self.rate.apply(self, args); - } - }); - - return self; - } - - // Set the group rate. - if (typeof id === 'undefined') { - self._rate = rate; - } - - // Update one or all volumes. - id = self._getSoundIds(id); - for (var i=0; i Returns the first sound node's current seek position. - * seek(id) -> Returns the sound id's current seek position. - * seek(seek) -> Sets the seek position of the first sound node. - * seek(seek, id) -> Sets the seek position of passed sound id. - * @return {Howl/Number} Returns self or the current seek position. - */ - seek: function() { - var self = this; - var args = arguments; - var seek, id; - - // Determine the values based on arguments. - if (args.length === 0) { - // We will simply return the current position of the first node. - id = self._sounds[0]._id; - } else if (args.length === 1) { - // First check if this is an ID, and if not, assume it is a new seek position. - var ids = self._getSoundIds(); - var index = ids.indexOf(args[0]); - if (index >= 0) { - id = parseInt(args[0], 10); - } else if (self._sounds.length) { - id = self._sounds[0]._id; - seek = parseFloat(args[0]); - } - } else if (args.length === 2) { - seek = parseFloat(args[0]); - id = parseInt(args[1], 10); - } - - // If there is no ID, bail out. - if (typeof id === 'undefined') { - return self; - } - - // If the sound hasn't loaded, add it to the load queue to seek when capable. - if (self._state !== 'loaded' || self._playLock) { - self._queue.push({ - event: 'seek', - action: function() { - self.seek.apply(self, args); - } - }); - - return self; - } - - // Get the sound. - var sound = self._soundById(id); - - if (sound) { - if (typeof seek === 'number' && seek >= 0) { - // Pause the sound and update position for restarting playback. - var playing = self.playing(id); - if (playing) { - self.pause(id, true); - } - - // Move the position of the track and cancel timer. - sound._seek = seek; - sound._ended = false; - self._clearTimer(id); - - // Update the seek position for HTML5 Audio. - if (!self._webAudio && sound._node && !isNaN(sound._node.duration)) { - sound._node.currentTime = seek; - } - - // Seek and emit when ready. - var seekAndEmit = function() { - self._emit('seek', id); - - // Restart the playback if the sound was playing. - if (playing) { - self.play(id, true); - } - }; - - // Wait for the play lock to be unset before emitting (HTML5 Audio). - if (playing && !self._webAudio) { - var emitSeek = function() { - if (!self._playLock) { - seekAndEmit(); - } else { - setTimeout(emitSeek, 0); - } - }; - setTimeout(emitSeek, 0); - } else { - seekAndEmit(); - } - } else { - if (self._webAudio) { - var realTime = self.playing(id) ? Howler.ctx.currentTime - sound._playStart : 0; - var rateSeek = sound._rateSeek ? sound._rateSeek - sound._seek : 0; - return sound._seek + (rateSeek + realTime * Math.abs(sound._rate)); - } else { - return sound._node.currentTime; - } - } - } - - return self; - }, - - /** - * Check if a specific sound is currently playing or not (if id is provided), or check if at least one of the sounds in the group is playing or not. - * @param {Number} id The sound id to check. If none is passed, the whole sound group is checked. - * @return {Boolean} True if playing and false if not. - */ - playing: function(id) { - var self = this; - - // Check the passed sound ID (if any). - if (typeof id === 'number') { - var sound = self._soundById(id); - return sound ? !sound._paused : false; - } - - // Otherwise, loop through all sounds and check if any are playing. - for (var i=0; i= 0) { - Howler._howls.splice(index, 1); - } - - // Delete this sound from the cache (if no other Howl is using it). - var remCache = true; - for (i=0; i= 0) { - remCache = false; - break; - } - } - - if (cache && remCache) { - delete cache[self._src]; - } - - // Clear global errors. - Howler.noAudio = false; - - // Clear out `self`. - self._state = 'unloaded'; - self._sounds = []; - self = null; - - return null; - }, - - /** - * Listen to a custom event. - * @param {String} event Event name. - * @param {Function} fn Listener to call. - * @param {Number} id (optional) Only listen to events for this sound. - * @param {Number} once (INTERNAL) Marks event to fire only once. - * @return {Howl} - */ - on: function(event, fn, id, once) { - var self = this; - var events = self['_on' + event]; - - if (typeof fn === 'function') { - events.push(once ? {id: id, fn: fn, once: once} : {id: id, fn: fn}); - } - - return self; - }, - - /** - * Remove a custom event. Call without parameters to remove all events. - * @param {String} event Event name. - * @param {Function} fn Listener to remove. Leave empty to remove all. - * @param {Number} id (optional) Only remove events for this sound. - * @return {Howl} - */ - off: function(event, fn, id) { - var self = this; - var events = self['_on' + event]; - var i = 0; - - // Allow passing just an event and ID. - if (typeof fn === 'number') { - id = fn; - fn = null; - } - - if (fn || id) { - // Loop through event store and remove the passed function. - for (i=0; i=0; i--) { - // Only fire the listener if the correct ID is used. - if (!events[i].id || events[i].id === id || event === 'load') { - setTimeout(function(fn) { - fn.call(this, id, msg); - }.bind(self, events[i].fn), 0); - - // If this event was setup with `once`, remove it. - if (events[i].once) { - self.off(event, events[i].fn, events[i].id); - } - } - } - - // Pass the event type into load queue so that it can continue stepping. - self._loadQueue(event); - - return self; - }, - - /** - * Queue of actions initiated before the sound has loaded. - * These will be called in sequence, with the next only firing - * after the previous has finished executing (even if async like play). - * @return {Howl} - */ - _loadQueue: function(event) { - var self = this; - - if (self._queue.length > 0) { - var task = self._queue[0]; - - // Remove this task if a matching event was passed. - if (task.event === event) { - self._queue.shift(); - self._loadQueue(); - } - - // Run the task if no event type is passed. - if (!event) { - task.action(); - } - } - - return self; - }, - - /** - * Fired when playback ends at the end of the duration. - * @param {Sound} sound The sound object to work with. - * @return {Howl} - */ - _ended: function(sound) { - var self = this; - var sprite = sound._sprite; - - // If we are using IE and there was network latency we may be clipping - // audio before it completes playing. Lets check the node to make sure it - // believes it has completed, before ending the playback. - if (!self._webAudio && sound._node && !sound._node.paused && !sound._node.ended && sound._node.currentTime < sound._stop) { - setTimeout(self._ended.bind(self, sound), 100); - return self; - } - - // Should this sound loop? - var loop = !!(sound._loop || self._sprite[sprite][2]); - - // Fire the ended event. - self._emit('end', sound._id); - - // Restart the playback for HTML5 Audio loop. - if (!self._webAudio && loop) { - self.stop(sound._id, true).play(sound._id); - } - - // Restart this timer if on a Web Audio loop. - if (self._webAudio && loop) { - self._emit('play', sound._id); - sound._seek = sound._start || 0; - sound._rateSeek = 0; - sound._playStart = Howler.ctx.currentTime; - - var timeout = ((sound._stop - sound._start) * 1000) / Math.abs(sound._rate); - self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout); - } - - // Mark the node as paused. - if (self._webAudio && !loop) { - sound._paused = true; - sound._ended = true; - sound._seek = sound._start || 0; - sound._rateSeek = 0; - self._clearTimer(sound._id); - - // Clean up the buffer source. - self._cleanBuffer(sound._node); - - // Attempt to auto-suspend AudioContext if no sounds are still playing. - Howler._autoSuspend(); - } - - // When using a sprite, end the track. - if (!self._webAudio && !loop) { - self.stop(sound._id, true); - } - - return self; - }, - - /** - * Clear the end timer for a sound playback. - * @param {Number} id The sound ID. - * @return {Howl} - */ - _clearTimer: function(id) { - var self = this; - - if (self._endTimers[id]) { - // Clear the timeout or remove the ended listener. - if (typeof self._endTimers[id] !== 'function') { - clearTimeout(self._endTimers[id]); - } else { - var sound = self._soundById(id); - if (sound && sound._node) { - sound._node.removeEventListener('ended', self._endTimers[id], false); - } - } - - delete self._endTimers[id]; - } - - return self; - }, - - /** - * Return the sound identified by this ID, or return null. - * @param {Number} id Sound ID - * @return {Object} Sound object or null. - */ - _soundById: function(id) { - var self = this; - - // Loop through all sounds and find the one with this ID. - for (var i=0; i=0; i--) { - if (cnt <= limit) { - return; - } - - if (self._sounds[i]._ended) { - // Disconnect the audio source when using Web Audio. - if (self._webAudio && self._sounds[i]._node) { - self._sounds[i]._node.disconnect(0); - } - - // Remove sounds until we have the pool size. - self._sounds.splice(i, 1); - cnt--; - } - } - }, - - /** - * Get all ID's from the sounds pool. - * @param {Number} id Only return one ID if one is passed. - * @return {Array} Array of IDs. - */ - _getSoundIds: function(id) { - var self = this; - - if (typeof id === 'undefined') { - var ids = []; - for (var i=0; i= 0; - - if (Howler._scratchBuffer && node.bufferSource) { - node.bufferSource.onended = null; - node.bufferSource.disconnect(0); - if (isIOS) { - try { node.bufferSource.buffer = Howler._scratchBuffer; } catch(e) {} - } - } - node.bufferSource = null; - - return self; - }, - - /** - * Set the source to a 0-second silence to stop any downloading (except in IE). - * @param {Object} node Audio node to clear. - */ - _clearSound: function(node) { - var checkIE = /MSIE |Trident\//.test(Howler._navigator && Howler._navigator.userAgent); - if (!checkIE) { - node.src = 'data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA'; - } - } - }; - - /** Single Sound Methods **/ - /***************************************************************************/ - - /** - * Setup the sound object, which each node attached to a Howl group is contained in. - * @param {Object} howl The Howl parent group. - */ - var Sound = function(howl) { - this._parent = howl; - this.init(); - }; - Sound.prototype = { - /** - * Initialize a new Sound object. - * @return {Sound} - */ - init: function() { - var self = this; - var parent = self._parent; - - // Setup the default parameters. - self._muted = parent._muted; - self._loop = parent._loop; - self._volume = parent._volume; - self._rate = parent._rate; - self._seek = 0; - self._paused = true; - self._ended = true; - self._sprite = '__default'; - - // Generate a unique ID for this sound. - self._id = ++Howler._counter; - - // Add itself to the parent's pool. - parent._sounds.push(self); - - // Create the new node. - self.create(); - - return self; - }, - - /** - * Create and setup a new sound object, whether HTML5 Audio or Web Audio. - * @return {Sound} - */ - create: function() { - var self = this; - var parent = self._parent; - var volume = (Howler._muted || self._muted || self._parent._muted) ? 0 : self._volume; - - if (parent._webAudio) { - // Create the gain node for controlling volume (the source will connect to this). - self._node = (typeof Howler.ctx.createGain === 'undefined') ? Howler.ctx.createGainNode() : Howler.ctx.createGain(); - self._node.gain.setValueAtTime(volume, Howler.ctx.currentTime); - self._node.paused = true; - self._node.connect(Howler.masterGain); - } else { - // Get an unlocked Audio object from the pool. - self._node = Howler._obtainHtml5Audio(); - - // Listen for errors (http://dev.w3.org/html5/spec-author-view/spec.html#mediaerror). - self._errorFn = self._errorListener.bind(self); - self._node.addEventListener('error', self._errorFn, false); - - // Listen for 'canplaythrough' event to let us know the sound is ready. - self._loadFn = self._loadListener.bind(self); - self._node.addEventListener(Howler._canPlayEvent, self._loadFn, false); - - // Setup the new audio node. - self._node.src = parent._src; - self._node.preload = 'auto'; - self._node.volume = volume * Howler.volume(); - - // Begin loading the source. - self._node.load(); - } - - return self; - }, - - /** - * Reset the parameters of this sound to the original state (for recycle). - * @return {Sound} - */ - reset: function() { - var self = this; - var parent = self._parent; - - // Reset all of the parameters of this sound. - self._muted = parent._muted; - self._loop = parent._loop; - self._volume = parent._volume; - self._rate = parent._rate; - self._seek = 0; - self._rateSeek = 0; - self._paused = true; - self._ended = true; - self._sprite = '__default'; - - // Generate a new ID so that it isn't confused with the previous sound. - self._id = ++Howler._counter; - - return self; - }, - - /** - * HTML5 Audio error listener callback. - */ - _errorListener: function() { - var self = this; - - // Fire an error event and pass back the code. - self._parent._emit('loaderror', self._id, self._node.error ? self._node.error.code : 0); - - // Clear the event listener. - self._node.removeEventListener('error', self._errorFn, false); - }, - - /** - * HTML5 Audio canplaythrough listener callback. - */ - _loadListener: function() { - var self = this; - var parent = self._parent; - - // Round up the duration to account for the lower precision in HTML5 Audio. - parent._duration = Math.ceil(self._node.duration * 10) / 10; - - // Setup a sprite if none is defined. - if (Object.keys(parent._sprite).length === 0) { - parent._sprite = {__default: [0, parent._duration * 1000]}; - } - - if (parent._state !== 'loaded') { - parent._state = 'loaded'; - parent._emit('load'); - parent._loadQueue(); - } - - // Clear the event listener. - self._node.removeEventListener(Howler._canPlayEvent, self._loadFn, false); - } - }; - - /** Helper Methods **/ - /***************************************************************************/ - - var cache = {}; - - /** - * Buffer a sound from URL, Data URI or cache and decode to audio source (Web Audio API). - * @param {Howl} self - */ - var loadBuffer = function(self) { - var url = self._src; - - // Check if the buffer has already been cached and use it instead. - if (cache[url]) { - // Set the duration from the cache. - self._duration = cache[url].duration; - - // Load the sound into this Howl. - loadSound(self); - - return; - } - - if (/^data:[^;]+;base64,/.test(url)) { - // Decode the base64 data URI without XHR, since some browsers don't support it. - var data = atob(url.split(',')[1]); - var dataView = new Uint8Array(data.length); - for (var i=0; i 0) { - cache[self._src] = buffer; - loadSound(self, buffer); - } else { - error(); - } - }; - - // Decode the buffer into an audio source. - if (typeof Promise !== 'undefined' && Howler.ctx.decodeAudioData.length === 1) { - Howler.ctx.decodeAudioData(arraybuffer).then(success).catch(error); - } else { - Howler.ctx.decodeAudioData(arraybuffer, success, error); - } - } - - /** - * Sound is now loaded, so finish setting everything up and fire the loaded event. - * @param {Howl} self - * @param {Object} buffer The decoded buffer sound source. - */ - var loadSound = function(self, buffer) { - // Set the duration. - if (buffer && !self._duration) { - self._duration = buffer.duration; - } - - // Setup a sprite if none is defined. - if (Object.keys(self._sprite).length === 0) { - self._sprite = {__default: [0, self._duration * 1000]}; - } - - // Fire the loaded event. - if (self._state !== 'loaded') { - self._state = 'loaded'; - self._emit('load'); - self._loadQueue(); - } - }; - - /** - * Setup the audio context when available, or switch to HTML5 Audio mode. - */ - var setupAudioContext = function() { - // If we have already detected that Web Audio isn't supported, don't run this step again. - if (!Howler.usingWebAudio) { - return; - } - - // Check if we are using Web Audio and setup the AudioContext if we are. - try { - if (typeof AudioContext !== 'undefined') { - Howler.ctx = new AudioContext(); - } else if (typeof webkitAudioContext !== 'undefined') { - Howler.ctx = new webkitAudioContext(); - } else { - Howler.usingWebAudio = false; - } - } catch(e) { - Howler.usingWebAudio = false; - } - - // If the audio context creation still failed, set using web audio to false. - if (!Howler.ctx) { - Howler.usingWebAudio = false; - } - - // Check if a webview is being used on iOS8 or earlier (rather than the browser). - // If it is, disable Web Audio as it causes crashing. - var iOS = (/iP(hone|od|ad)/.test(Howler._navigator && Howler._navigator.platform)); - var appVersion = Howler._navigator && Howler._navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/); - var version = appVersion ? parseInt(appVersion[1], 10) : null; - if (iOS && version && version < 9) { - var safari = /safari/.test(Howler._navigator && Howler._navigator.userAgent.toLowerCase()); - if (Howler._navigator && Howler._navigator.standalone && !safari || Howler._navigator && !Howler._navigator.standalone && !safari) { - Howler.usingWebAudio = false; - } - } - - // Create and expose the master GainNode when using Web Audio (useful for plugins or advanced usage). - if (Howler.usingWebAudio) { - Howler.masterGain = (typeof Howler.ctx.createGain === 'undefined') ? Howler.ctx.createGainNode() : Howler.ctx.createGain(); - Howler.masterGain.gain.setValueAtTime(Howler._muted ? 0 : 1, Howler.ctx.currentTime); - Howler.masterGain.connect(Howler.ctx.destination); - } - - // Re-run the setup on Howler. - Howler._setup(); - }; - - // Add support for AMD (Asynchronous Module Definition) libraries such as require.js. - if (typeof define === 'function' && define.amd) { - define([], function() { - return { - Howler: Howler, - Howl: Howl - }; - }); - } - - // Add support for CommonJS libraries such as browserify. - if (typeof exports !== 'undefined') { - exports.Howler = Howler; - exports.Howl = Howl; - } - - // Define globally in case AMD is not available or unused. - if (typeof window !== 'undefined') { - window.HowlerGlobal = HowlerGlobal; - window.Howler = Howler; - window.Howl = Howl; - window.Sound = Sound; - } else if (typeof global !== 'undefined') { // Add to global in Node.js (for testing, etc). - global.HowlerGlobal = HowlerGlobal; - global.Howler = Howler; - global.Howl = Howl; - global.Sound = Sound; - } -})(); - - -/*! - * Spatial Plugin - Adds support for stereo and 3D audio where Web Audio is supported. - * - * howler.js v2.1.2 - * howlerjs.com - * - * (c) 2013-2019, James Simpson of GoldFire Studios - * goldfirestudios.com - * - * MIT License - */ - -(function() { - - 'use strict'; - - // Setup default properties. - HowlerGlobal.prototype._pos = [0, 0, 0]; - HowlerGlobal.prototype._orientation = [0, 0, -1, 0, 1, 0]; - - /** Global Methods **/ - /***************************************************************************/ - - /** - * Helper method to update the stereo panning position of all current Howls. - * Future Howls will not use this value unless explicitly set. - * @param {Number} pan A value of -1.0 is all the way left and 1.0 is all the way right. - * @return {Howler/Number} Self or current stereo panning value. - */ - HowlerGlobal.prototype.stereo = function(pan) { - var self = this; - - // Stop right here if not using Web Audio. - if (!self.ctx || !self.ctx.listener) { - return self; - } - - // Loop through all Howls and update their stereo panning. - for (var i=self._howls.length-1; i>=0; i--) { - self._howls[i].stereo(pan); - } - - return self; - }; - - /** - * Get/set the position of the listener in 3D cartesian space. Sounds using - * 3D position will be relative to the listener's position. - * @param {Number} x The x-position of the listener. - * @param {Number} y The y-position of the listener. - * @param {Number} z The z-position of the listener. - * @return {Howler/Array} Self or current listener position. - */ - HowlerGlobal.prototype.pos = function(x, y, z) { - var self = this; - - // Stop right here if not using Web Audio. - if (!self.ctx || !self.ctx.listener) { - return self; - } - - // Set the defaults for optional 'y' & 'z'. - y = (typeof y !== 'number') ? self._pos[1] : y; - z = (typeof z !== 'number') ? self._pos[2] : z; - - if (typeof x === 'number') { - self._pos = [x, y, z]; - - if (typeof self.ctx.listener.positionX !== 'undefined') { - self.ctx.listener.positionX.setTargetAtTime(self._pos[0], Howler.ctx.currentTime, 0.1); - self.ctx.listener.positionY.setTargetAtTime(self._pos[1], Howler.ctx.currentTime, 0.1); - self.ctx.listener.positionZ.setTargetAtTime(self._pos[2], Howler.ctx.currentTime, 0.1); - } else { - self.ctx.listener.setPosition(self._pos[0], self._pos[1], self._pos[2]); - } - } else { - return self._pos; - } - - return self; - }; - - /** - * Get/set the direction the listener is pointing in the 3D cartesian space. - * A front and up vector must be provided. The front is the direction the - * face of the listener is pointing, and up is the direction the top of the - * listener is pointing. Thus, these values are expected to be at right angles - * from each other. - * @param {Number} x The x-orientation of the listener. - * @param {Number} y The y-orientation of the listener. - * @param {Number} z The z-orientation of the listener. - * @param {Number} xUp The x-orientation of the top of the listener. - * @param {Number} yUp The y-orientation of the top of the listener. - * @param {Number} zUp The z-orientation of the top of the listener. - * @return {Howler/Array} Returns self or the current orientation vectors. - */ - HowlerGlobal.prototype.orientation = function(x, y, z, xUp, yUp, zUp) { - var self = this; - - // Stop right here if not using Web Audio. - if (!self.ctx || !self.ctx.listener) { - return self; - } - - // Set the defaults for optional 'y' & 'z'. - var or = self._orientation; - y = (typeof y !== 'number') ? or[1] : y; - z = (typeof z !== 'number') ? or[2] : z; - xUp = (typeof xUp !== 'number') ? or[3] : xUp; - yUp = (typeof yUp !== 'number') ? or[4] : yUp; - zUp = (typeof zUp !== 'number') ? or[5] : zUp; - - if (typeof x === 'number') { - self._orientation = [x, y, z, xUp, yUp, zUp]; - - if (typeof self.ctx.listener.forwardX !== 'undefined') { - self.ctx.listener.forwardX.setTargetAtTime(x, Howler.ctx.currentTime, 0.1); - self.ctx.listener.forwardY.setTargetAtTime(y, Howler.ctx.currentTime, 0.1); - self.ctx.listener.forwardZ.setTargetAtTime(z, Howler.ctx.currentTime, 0.1); - self.ctx.listener.upX.setTargetAtTime(x, Howler.ctx.currentTime, 0.1); - self.ctx.listener.upY.setTargetAtTime(y, Howler.ctx.currentTime, 0.1); - self.ctx.listener.upZ.setTargetAtTime(z, Howler.ctx.currentTime, 0.1); - } else { - self.ctx.listener.setOrientation(x, y, z, xUp, yUp, zUp); - } - } else { - return or; - } - - return self; - }; - - /** Group Methods **/ - /***************************************************************************/ - - /** - * Add new properties to the core init. - * @param {Function} _super Core init method. - * @return {Howl} - */ - Howl.prototype.init = (function(_super) { - return function(o) { - var self = this; - - // Setup user-defined default properties. - self._orientation = o.orientation || [1, 0, 0]; - self._stereo = o.stereo || null; - self._pos = o.pos || null; - self._pannerAttr = { - coneInnerAngle: typeof o.coneInnerAngle !== 'undefined' ? o.coneInnerAngle : 360, - coneOuterAngle: typeof o.coneOuterAngle !== 'undefined' ? o.coneOuterAngle : 360, - coneOuterGain: typeof o.coneOuterGain !== 'undefined' ? o.coneOuterGain : 0, - distanceModel: typeof o.distanceModel !== 'undefined' ? o.distanceModel : 'inverse', - maxDistance: typeof o.maxDistance !== 'undefined' ? o.maxDistance : 10000, - panningModel: typeof o.panningModel !== 'undefined' ? o.panningModel : 'HRTF', - refDistance: typeof o.refDistance !== 'undefined' ? o.refDistance : 1, - rolloffFactor: typeof o.rolloffFactor !== 'undefined' ? o.rolloffFactor : 1 - }; - - // Setup event listeners. - self._onstereo = o.onstereo ? [{fn: o.onstereo}] : []; - self._onpos = o.onpos ? [{fn: o.onpos}] : []; - self._onorientation = o.onorientation ? [{fn: o.onorientation}] : []; - - // Complete initilization with howler.js core's init function. - return _super.call(this, o); - }; - })(Howl.prototype.init); - - /** - * Get/set the stereo panning of the audio source for this sound or all in the group. - * @param {Number} pan A value of -1.0 is all the way left and 1.0 is all the way right. - * @param {Number} id (optional) The sound ID. If none is passed, all in group will be updated. - * @return {Howl/Number} Returns self or the current stereo panning value. - */ - Howl.prototype.stereo = function(pan, id) { - var self = this; - - // Stop right here if not using Web Audio. - if (!self._webAudio) { - return self; - } - - // If the sound hasn't loaded, add it to the load queue to change stereo pan when capable. - if (self._state !== 'loaded') { - self._queue.push({ - event: 'stereo', - action: function() { - self.stereo(pan, id); - } - }); - - return self; - } - - // Check for PannerStereoNode support and fallback to PannerNode if it doesn't exist. - var pannerType = (typeof Howler.ctx.createStereoPanner === 'undefined') ? 'spatial' : 'stereo'; - - // Setup the group's stereo panning if no ID is passed. - if (typeof id === 'undefined') { - // Return the group's stereo panning if no parameters are passed. - if (typeof pan === 'number') { - self._stereo = pan; - self._pos = [pan, 0, 0]; - } else { - return self._stereo; - } - } - - // Change the streo panning of one or all sounds in group. - var ids = self._getSoundIds(id); - for (var i=0; i Returns the group's values. - * pannerAttr(id) -> Returns the sound id's values. - * pannerAttr(o) -> Set's the values of all sounds in this Howl group. - * pannerAttr(o, id) -> Set's the values of passed sound id. - * - * Attributes: - * coneInnerAngle - (360 by default) A parameter for directional audio sources, this is an angle, in degrees, - * inside of which there will be no volume reduction. - * coneOuterAngle - (360 by default) A parameter for directional audio sources, this is an angle, in degrees, - * outside of which the volume will be reduced to a constant value of `coneOuterGain`. - * coneOuterGain - (0 by default) A parameter for directional audio sources, this is the gain outside of the - * `coneOuterAngle`. It is a linear value in the range `[0, 1]`. - * distanceModel - ('inverse' by default) Determines algorithm used to reduce volume as audio moves away from - * listener. Can be `linear`, `inverse` or `exponential. - * maxDistance - (10000 by default) The maximum distance between source and listener, after which the volume - * will not be reduced any further. - * refDistance - (1 by default) A reference distance for reducing volume as source moves further from the listener. - * This is simply a variable of the distance model and has a different effect depending on which model - * is used and the scale of your coordinates. Generally, volume will be equal to 1 at this distance. - * rolloffFactor - (1 by default) How quickly the volume reduces as source moves from listener. This is simply a - * variable of the distance model and can be in the range of `[0, 1]` with `linear` and `[0, ∞]` - * with `inverse` and `exponential`. - * panningModel - ('HRTF' by default) Determines which spatialization algorithm is used to position audio. - * Can be `HRTF` or `equalpower`. - * - * @return {Howl/Object} Returns self or current panner attributes. - */ - Howl.prototype.pannerAttr = function() { - var self = this; - var args = arguments; - var o, id, sound; - - // Stop right here if not using Web Audio. - if (!self._webAudio) { - return self; - } - - // Determine the values based on arguments. - if (args.length === 0) { - // Return the group's panner attribute values. - return self._pannerAttr; - } else if (args.length === 1) { - if (typeof args[0] === 'object') { - o = args[0]; - - // Set the grou's panner attribute values. - if (typeof id === 'undefined') { - if (!o.pannerAttr) { - o.pannerAttr = { - coneInnerAngle: o.coneInnerAngle, - coneOuterAngle: o.coneOuterAngle, - coneOuterGain: o.coneOuterGain, - distanceModel: o.distanceModel, - maxDistance: o.maxDistance, - refDistance: o.refDistance, - rolloffFactor: o.rolloffFactor, - panningModel: o.panningModel - }; - } - - self._pannerAttr = { - coneInnerAngle: typeof o.pannerAttr.coneInnerAngle !== 'undefined' ? o.pannerAttr.coneInnerAngle : self._coneInnerAngle, - coneOuterAngle: typeof o.pannerAttr.coneOuterAngle !== 'undefined' ? o.pannerAttr.coneOuterAngle : self._coneOuterAngle, - coneOuterGain: typeof o.pannerAttr.coneOuterGain !== 'undefined' ? o.pannerAttr.coneOuterGain : self._coneOuterGain, - distanceModel: typeof o.pannerAttr.distanceModel !== 'undefined' ? o.pannerAttr.distanceModel : self._distanceModel, - maxDistance: typeof o.pannerAttr.maxDistance !== 'undefined' ? o.pannerAttr.maxDistance : self._maxDistance, - refDistance: typeof o.pannerAttr.refDistance !== 'undefined' ? o.pannerAttr.refDistance : self._refDistance, - rolloffFactor: typeof o.pannerAttr.rolloffFactor !== 'undefined' ? o.pannerAttr.rolloffFactor : self._rolloffFactor, - panningModel: typeof o.pannerAttr.panningModel !== 'undefined' ? o.pannerAttr.panningModel : self._panningModel - }; - } - } else { - // Return this sound's panner attribute values. - sound = self._soundById(parseInt(args[0], 10)); - return sound ? sound._pannerAttr : self._pannerAttr; - } - } else if (args.length === 2) { - o = args[0]; - id = parseInt(args[1], 10); - } - - // Update the values of the specified sounds. - var ids = self._getSoundIds(id); - for (var i=0; i= 0 && vol <= 1) { + self._volume = vol; + + // Don't update any of the nodes if we are muted. + if (self._muted) { + return self; + } + + // When using Web Audio, we just need to adjust the master gain. + if (self.usingWebAudio) { + self.masterGain.gain.setValueAtTime(vol, Howler.ctx.currentTime); + } + + // Loop through and change volume for all HTML5 audio nodes. + for (var i=0; i=0; i--) { + self._howls[i].unload(); + } + + // Create a new AudioContext to make sure it is fully reset. + if (self.usingWebAudio && self.ctx && typeof self.ctx.close !== 'undefined') { + self.ctx.close(); + self.ctx = null; + setupAudioContext(); + } + + return self; + }, + + /** + * Check for codec support of specific extension. + * @param {String} ext Audio file extention. + * @return {Boolean} + */ + codecs: function(ext) { + return (this || Howler)._codecs[ext.replace(/^x-/, '')]; + }, + + /** + * Setup various state values for global tracking. + * @return {Howler} + */ + _setup: function() { + var self = this || Howler; + + // Keeps track of the suspend/resume state of the AudioContext. + self.state = self.ctx ? self.ctx.state || 'suspended' : 'suspended'; + + // Automatically begin the 30-second suspend process + self._autoSuspend(); + + // Check if audio is available. + if (!self.usingWebAudio) { + // No audio is available on this system if noAudio is set to true. + if (typeof Audio !== 'undefined') { + try { + var test = new Audio(); + + // Check if the canplaythrough event is available. + if (typeof test.oncanplaythrough === 'undefined') { + self._canPlayEvent = 'canplay'; + } + } catch(e) { + self.noAudio = true; + } + } else { + self.noAudio = true; + } + } + + // Test to make sure audio isn't disabled in Internet Explorer. + try { + var test = new Audio(); + if (test.muted) { + self.noAudio = true; + } + } catch (e) {} + + // Check for supported codecs. + if (!self.noAudio) { + self._setupCodecs(); + } + + return self; + }, + + /** + * Check for browser support for various codecs and cache the results. + * @return {Howler} + */ + _setupCodecs: function() { + var self = this || Howler; + var audioTest = null; + + // Must wrap in a try/catch because IE11 in server mode throws an error. + try { + audioTest = (typeof Audio !== 'undefined') ? new Audio() : null; + } catch (err) { + return self; + } + + if (!audioTest || typeof audioTest.canPlayType !== 'function') { + return self; + } + + var mpegTest = audioTest.canPlayType('audio/mpeg;').replace(/^no$/, ''); + + // Opera version <33 has mixed MP3 support, so we need to check for and block it. + var checkOpera = self._navigator && self._navigator.userAgent.match(/OPR\/([0-6].)/g); + var isOldOpera = (checkOpera && parseInt(checkOpera[0].split('/')[1], 10) < 33); + + self._codecs = { + mp3: !!(!isOldOpera && (mpegTest || audioTest.canPlayType('audio/mp3;').replace(/^no$/, ''))), + mpeg: !!mpegTest, + opus: !!audioTest.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/, ''), + ogg: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ''), + oga: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ''), + wav: !!audioTest.canPlayType('audio/wav; codecs="1"').replace(/^no$/, ''), + aac: !!audioTest.canPlayType('audio/aac;').replace(/^no$/, ''), + caf: !!audioTest.canPlayType('audio/x-caf;').replace(/^no$/, ''), + m4a: !!(audioTest.canPlayType('audio/x-m4a;') || audioTest.canPlayType('audio/m4a;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''), + mp4: !!(audioTest.canPlayType('audio/x-mp4;') || audioTest.canPlayType('audio/mp4;') || audioTest.canPlayType('audio/aac;')).replace(/^no$/, ''), + weba: !!audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, ''), + webm: !!audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, ''), + dolby: !!audioTest.canPlayType('audio/mp4; codecs="ec-3"').replace(/^no$/, ''), + flac: !!(audioTest.canPlayType('audio/x-flac;') || audioTest.canPlayType('audio/flac;')).replace(/^no$/, '') + }; + + return self; + }, + + /** + * Some browsers/devices will only allow audio to be played after a user interaction. + * Attempt to automatically unlock audio on the first user interaction. + * Concept from: http://paulbakaus.com/tutorials/html5/web-audio-on-ios/ + * @return {Howler} + */ + _unlockAudio: function() { + var self = this || Howler; + + // Only run this if Web Audio is supported and it hasn't already been unlocked. + if (self._audioUnlocked || !self.ctx) { + return; + } + + self._audioUnlocked = false; + self.autoUnlock = false; + + // Some mobile devices/platforms have distortion issues when opening/closing tabs and/or web views. + // Bugs in the browser (especially Mobile Safari) can cause the sampleRate to change from 44100 to 48000. + // By calling Howler.unload(), we create a new AudioContext with the correct sampleRate. + if (!self._mobileUnloaded && self.ctx.sampleRate !== 44100) { + self._mobileUnloaded = true; + self.unload(); + } + + // Scratch buffer for enabling iOS to dispose of web audio buffers correctly, as per: + // http://stackoverflow.com/questions/24119684 + self._scratchBuffer = self.ctx.createBuffer(1, 1, 22050); + + // Call this method on touch start to create and play a buffer, + // then check if the audio actually played to determine if + // audio has now been unlocked on iOS, Android, etc. + var unlock = function(e) { + // Create a pool of unlocked HTML5 Audio objects that can + // be used for playing sounds without user interaction. HTML5 + // Audio objects must be individually unlocked, as opposed + // to the WebAudio API which only needs a single activation. + // This must occur before WebAudio setup or the source.onended + // event will not fire. + for (var i=0; i= 55. + if (typeof self.ctx.resume === 'function') { + self.ctx.resume(); + } + + // Setup a timeout to check that we are unlocked on the next event loop. + source.onended = function() { + source.disconnect(0); + + // Update the unlocked state and prevent this check from happening again. + self._audioUnlocked = true; + + // Remove the touch start listener. + document.removeEventListener('touchstart', unlock, true); + document.removeEventListener('touchend', unlock, true); + document.removeEventListener('click', unlock, true); + + // Let all sounds know that audio has been unlocked. + for (var i=0; i 0 ? sound._seek : self._sprite[sprite][0] / 1000); + var duration = Math.max(0, ((self._sprite[sprite][0] + self._sprite[sprite][1]) / 1000) - seek); + var timeout = (duration * 1000) / Math.abs(sound._rate); + var start = self._sprite[sprite][0] / 1000; + var stop = (self._sprite[sprite][0] + self._sprite[sprite][1]) / 1000; + var loop = !!(sound._loop || self._sprite[sprite][2]); + sound._sprite = sprite; + + // Mark the sound as ended instantly so that this async playback + // doesn't get grabbed by another call to play while this one waits to start. + sound._ended = false; + + // Update the parameters of the sound. + var setParams = function() { + sound._paused = false; + sound._seek = seek; + sound._start = start; + sound._stop = stop; + sound._loop = loop; + }; + + // End the sound instantly if seek is at the end. + if (seek >= stop) { + self._ended(sound); + return; + } + + // Begin the actual playback. + var node = sound._node; + if (self._webAudio) { + // Fire this when the sound is ready to play to begin Web Audio playback. + var playWebAudio = function() { + self._playLock = false; + setParams(); + self._refreshBuffer(sound); + + // Setup the playback params. + var vol = (sound._muted || self._muted) ? 0 : sound._volume; + node.gain.setValueAtTime(vol, Howler.ctx.currentTime); + sound._playStart = Howler.ctx.currentTime; + + // Play the sound using the supported method. + if (typeof node.bufferSource.start === 'undefined') { + sound._loop ? node.bufferSource.noteGrainOn(0, seek, 86400) : node.bufferSource.noteGrainOn(0, seek, duration); + } else { + sound._loop ? node.bufferSource.start(0, seek, 86400) : node.bufferSource.start(0, seek, duration); + } + + // Start a new timer if none is present. + if (timeout !== Infinity) { + self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout); + } + + if (!internal) { + setTimeout(function() { + self._emit('play', sound._id); + self._loadQueue(); + }, 0); + } + }; + + if (Howler.state === 'running') { + playWebAudio(); + } else { + self._playLock = true; + + // Wait for the audio context to resume before playing. + self.once('resume', playWebAudio); + + // Cancel the end timer. + self._clearTimer(sound._id); + } + } else { + // Fire this when the sound is ready to play to begin HTML5 Audio playback. + var playHtml5 = function() { + node.currentTime = seek; + node.muted = sound._muted || self._muted || Howler._muted || node.muted; + node.volume = sound._volume * Howler.volume(); + node.playbackRate = sound._rate; + + // Some browsers will throw an error if this is called without user interaction. + try { + var play = node.play(); + + // Support older browsers that don't support promises, and thus don't have this issue. + if (play && typeof Promise !== 'undefined' && (play instanceof Promise || typeof play.then === 'function')) { + // Implements a lock to prevent DOMException: The play() request was interrupted by a call to pause(). + self._playLock = true; + + // Set param values immediately. + setParams(); + + // Releases the lock and executes queued actions. + play + .then(function() { + self._playLock = false; + node._unlocked = true; + if (!internal) { + self._emit('play', sound._id); + self._loadQueue(); + } + }) + .catch(function() { + self._playLock = false; + self._emit('playerror', sound._id, 'Playback was unable to start. This is most commonly an issue ' + + 'on mobile devices and Chrome where playback was not within a user interaction.'); + + // Reset the ended and paused values. + sound._ended = true; + sound._paused = true; + }); + } else if (!internal) { + self._playLock = false; + setParams(); + self._emit('play', sound._id); + self._loadQueue(); + } + + // Setting rate before playing won't work in IE, so we set it again here. + node.playbackRate = sound._rate; + + // If the node is still paused, then we can assume there was a playback issue. + if (node.paused) { + self._emit('playerror', sound._id, 'Playback was unable to start. This is most commonly an issue ' + + 'on mobile devices and Chrome where playback was not within a user interaction.'); + return; + } + + // Setup the end timer on sprites or listen for the ended event. + if (sprite !== '__default' || sound._loop) { + self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout); + } else { + self._endTimers[sound._id] = function() { + // Fire ended on this audio node. + self._ended(sound); + + // Clear this listener. + node.removeEventListener('ended', self._endTimers[sound._id], false); + }; + node.addEventListener('ended', self._endTimers[sound._id], false); + } + } catch (err) { + self._emit('playerror', sound._id, err); + } + }; + + // If this is streaming audio, make sure the src is set and load again. + if (node.src === 'data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA') { + node.src = self._src; + node.load(); + } + + // Play immediately if ready, or wait for the 'canplaythrough'e vent. + var loadedNoReadyState = (window && window.ejecta) || (!node.readyState && Howler._navigator.isCocoonJS); + if (node.readyState >= 3 || loadedNoReadyState) { + playHtml5(); + } else { + self._playLock = true; + + var listener = function() { + // Begin playback. + playHtml5(); + + // Clear this listener. + node.removeEventListener(Howler._canPlayEvent, listener, false); + }; + node.addEventListener(Howler._canPlayEvent, listener, false); + + // Cancel the end timer. + self._clearTimer(sound._id); + } + } + + return sound._id; + }, + + /** + * Pause playback and save current position. + * @param {Number} id The sound ID (empty to pause all in group). + * @return {Howl} + */ + pause: function(id) { + var self = this; + + // If the sound hasn't loaded or a play() promise is pending, add it to the load queue to pause when capable. + if (self._state !== 'loaded' || self._playLock) { + self._queue.push({ + event: 'pause', + action: function() { + self.pause(id); + } + }); + + return self; + } + + // If no id is passed, get all ID's to be paused. + var ids = self._getSoundIds(id); + + for (var i=0; i Returns the group's volume value. + * volume(id) -> Returns the sound id's current volume. + * volume(vol) -> Sets the volume of all sounds in this Howl group. + * volume(vol, id) -> Sets the volume of passed sound id. + * @return {Howl/Number} Returns self or current volume. + */ + volume: function() { + var self = this; + var args = arguments; + var vol, id; + + // Determine the values based on arguments. + if (args.length === 0) { + // Return the value of the groups' volume. + return self._volume; + } else if (args.length === 1 || args.length === 2 && typeof args[1] === 'undefined') { + // First check if this is an ID, and if not, assume it is a new volume. + var ids = self._getSoundIds(); + var index = ids.indexOf(args[0]); + if (index >= 0) { + id = parseInt(args[0], 10); + } else { + vol = parseFloat(args[0]); + } + } else if (args.length >= 2) { + vol = parseFloat(args[0]); + id = parseInt(args[1], 10); + } + + // Update the volume or return the current volume. + var sound; + if (typeof vol !== 'undefined' && vol >= 0 && vol <= 1) { + // If the sound hasn't loaded, add it to the load queue to change volume when capable. + if (self._state !== 'loaded'|| self._playLock) { + self._queue.push({ + event: 'volume', + action: function() { + self.volume.apply(self, args); + } + }); + + return self; + } + + // Set the group volume. + if (typeof id === 'undefined') { + self._volume = vol; + } + + // Update one or all volumes. + id = self._getSoundIds(id); + for (var i=0; i 0) ? len / steps : len); + var lastTick = Date.now(); + + // Store the value being faded to. + sound._fadeTo = to; + + // Update the volume value on each interval tick. + sound._interval = setInterval(function() { + // Update the volume based on the time since the last tick. + var tick = (Date.now() - lastTick) / len; + lastTick = Date.now(); + vol += diff * tick; + + // Make sure the volume is in the right bounds. + vol = Math.max(0, vol); + vol = Math.min(1, vol); + + // Round to within 2 decimal points. + vol = Math.round(vol * 100) / 100; + + // Change the volume. + if (self._webAudio) { + sound._volume = vol; + } else { + self.volume(vol, sound._id, true); + } + + // Set the group's volume. + if (isGroup) { + self._volume = vol; + } + + // When the fade is complete, stop it and fire event. + if ((to < from && vol <= to) || (to > from && vol >= to)) { + clearInterval(sound._interval); + sound._interval = null; + sound._fadeTo = null; + self.volume(to, sound._id); + self._emit('fade', sound._id); + } + }, stepLen); + }, + + /** + * Internal method that stops the currently playing fade when + * a new fade starts, volume is changed or the sound is stopped. + * @param {Number} id The sound id. + * @return {Howl} + */ + _stopFade: function(id) { + var self = this; + var sound = self._soundById(id); + + if (sound && sound._interval) { + if (self._webAudio) { + sound._node.gain.cancelScheduledValues(Howler.ctx.currentTime); + } + + clearInterval(sound._interval); + sound._interval = null; + self.volume(sound._fadeTo, id); + sound._fadeTo = null; + self._emit('fade', id); + } + + return self; + }, + + /** + * Get/set the loop parameter on a sound. This method can optionally take 0, 1 or 2 arguments. + * loop() -> Returns the group's loop value. + * loop(id) -> Returns the sound id's loop value. + * loop(loop) -> Sets the loop value for all sounds in this Howl group. + * loop(loop, id) -> Sets the loop value of passed sound id. + * @return {Howl/Boolean} Returns self or current loop value. + */ + loop: function() { + var self = this; + var args = arguments; + var loop, id, sound; + + // Determine the values for loop and id. + if (args.length === 0) { + // Return the grou's loop value. + return self._loop; + } else if (args.length === 1) { + if (typeof args[0] === 'boolean') { + loop = args[0]; + self._loop = loop; + } else { + // Return this sound's loop value. + sound = self._soundById(parseInt(args[0], 10)); + return sound ? sound._loop : false; + } + } else if (args.length === 2) { + loop = args[0]; + id = parseInt(args[1], 10); + } + + // If no id is passed, get all ID's to be looped. + var ids = self._getSoundIds(id); + for (var i=0; i Returns the first sound node's current playback rate. + * rate(id) -> Returns the sound id's current playback rate. + * rate(rate) -> Sets the playback rate of all sounds in this Howl group. + * rate(rate, id) -> Sets the playback rate of passed sound id. + * @return {Howl/Number} Returns self or the current playback rate. + */ + rate: function() { + var self = this; + var args = arguments; + var rate, id; + + // Determine the values based on arguments. + if (args.length === 0) { + // We will simply return the current rate of the first node. + id = self._sounds[0]._id; + } else if (args.length === 1) { + // First check if this is an ID, and if not, assume it is a new rate value. + var ids = self._getSoundIds(); + var index = ids.indexOf(args[0]); + if (index >= 0) { + id = parseInt(args[0], 10); + } else { + rate = parseFloat(args[0]); + } + } else if (args.length === 2) { + rate = parseFloat(args[0]); + id = parseInt(args[1], 10); + } + + // Update the playback rate or return the current value. + var sound; + if (typeof rate === 'number') { + // If the sound hasn't loaded, add it to the load queue to change playback rate when capable. + if (self._state !== 'loaded' || self._playLock) { + self._queue.push({ + event: 'rate', + action: function() { + self.rate.apply(self, args); + } + }); + + return self; + } + + // Set the group rate. + if (typeof id === 'undefined') { + self._rate = rate; + } + + // Update one or all volumes. + id = self._getSoundIds(id); + for (var i=0; i Returns the first sound node's current seek position. + * seek(id) -> Returns the sound id's current seek position. + * seek(seek) -> Sets the seek position of the first sound node. + * seek(seek, id) -> Sets the seek position of passed sound id. + * @return {Howl/Number} Returns self or the current seek position. + */ + seek: function() { + var self = this; + var args = arguments; + var seek, id; + + // Determine the values based on arguments. + if (args.length === 0) { + // We will simply return the current position of the first node. + id = self._sounds[0]._id; + } else if (args.length === 1) { + // First check if this is an ID, and if not, assume it is a new seek position. + var ids = self._getSoundIds(); + var index = ids.indexOf(args[0]); + if (index >= 0) { + id = parseInt(args[0], 10); + } else if (self._sounds.length) { + id = self._sounds[0]._id; + seek = parseFloat(args[0]); + } + } else if (args.length === 2) { + seek = parseFloat(args[0]); + id = parseInt(args[1], 10); + } + + // If there is no ID, bail out. + if (typeof id === 'undefined') { + return self; + } + + // If the sound hasn't loaded, add it to the load queue to seek when capable. + if (self._state !== 'loaded' || self._playLock) { + self._queue.push({ + event: 'seek', + action: function() { + self.seek.apply(self, args); + } + }); + + return self; + } + + // Get the sound. + var sound = self._soundById(id); + + if (sound) { + if (typeof seek === 'number' && seek >= 0) { + // Pause the sound and update position for restarting playback. + var playing = self.playing(id); + if (playing) { + self.pause(id, true); + } + + // Move the position of the track and cancel timer. + sound._seek = seek; + sound._ended = false; + self._clearTimer(id); + + // Update the seek position for HTML5 Audio. + if (!self._webAudio && sound._node && !isNaN(sound._node.duration)) { + sound._node.currentTime = seek; + } + + // Seek and emit when ready. + var seekAndEmit = function() { + self._emit('seek', id); + + // Restart the playback if the sound was playing. + if (playing) { + self.play(id, true); + } + }; + + // Wait for the play lock to be unset before emitting (HTML5 Audio). + if (playing && !self._webAudio) { + var emitSeek = function() { + if (!self._playLock) { + seekAndEmit(); + } else { + setTimeout(emitSeek, 0); + } + }; + setTimeout(emitSeek, 0); + } else { + seekAndEmit(); + } + } else { + if (self._webAudio) { + var realTime = self.playing(id) ? Howler.ctx.currentTime - sound._playStart : 0; + var rateSeek = sound._rateSeek ? sound._rateSeek - sound._seek : 0; + return sound._seek + (rateSeek + realTime * Math.abs(sound._rate)); + } else { + return sound._node.currentTime; + } + } + } + + return self; + }, + + /** + * Check if a specific sound is currently playing or not (if id is provided), or check if at least one of the sounds in the group is playing or not. + * @param {Number} id The sound id to check. If none is passed, the whole sound group is checked. + * @return {Boolean} True if playing and false if not. + */ + playing: function(id) { + var self = this; + + // Check the passed sound ID (if any). + if (typeof id === 'number') { + var sound = self._soundById(id); + return sound ? !sound._paused : false; + } + + // Otherwise, loop through all sounds and check if any are playing. + for (var i=0; i= 0) { + Howler._howls.splice(index, 1); + } + + // Delete this sound from the cache (if no other Howl is using it). + var remCache = true; + for (i=0; i= 0) { + remCache = false; + break; + } + } + + if (cache && remCache) { + delete cache[self._src]; + } + + // Clear global errors. + Howler.noAudio = false; + + // Clear out `self`. + self._state = 'unloaded'; + self._sounds = []; + self = null; + + return null; + }, + + /** + * Listen to a custom event. + * @param {String} event Event name. + * @param {Function} fn Listener to call. + * @param {Number} id (optional) Only listen to events for this sound. + * @param {Number} once (INTERNAL) Marks event to fire only once. + * @return {Howl} + */ + on: function(event, fn, id, once) { + var self = this; + var events = self['_on' + event]; + + if (typeof fn === 'function') { + events.push(once ? {id: id, fn: fn, once: once} : {id: id, fn: fn}); + } + + return self; + }, + + /** + * Remove a custom event. Call without parameters to remove all events. + * @param {String} event Event name. + * @param {Function} fn Listener to remove. Leave empty to remove all. + * @param {Number} id (optional) Only remove events for this sound. + * @return {Howl} + */ + off: function(event, fn, id) { + var self = this; + var events = self['_on' + event]; + var i = 0; + + // Allow passing just an event and ID. + if (typeof fn === 'number') { + id = fn; + fn = null; + } + + if (fn || id) { + // Loop through event store and remove the passed function. + for (i=0; i=0; i--) { + // Only fire the listener if the correct ID is used. + if (!events[i].id || events[i].id === id || event === 'load') { + setTimeout(function(fn) { + fn.call(this, id, msg); + }.bind(self, events[i].fn), 0); + + // If this event was setup with `once`, remove it. + if (events[i].once) { + self.off(event, events[i].fn, events[i].id); + } + } + } + + // Pass the event type into load queue so that it can continue stepping. + self._loadQueue(event); + + return self; + }, + + /** + * Queue of actions initiated before the sound has loaded. + * These will be called in sequence, with the next only firing + * after the previous has finished executing (even if async like play). + * @return {Howl} + */ + _loadQueue: function(event) { + var self = this; + + if (self._queue.length > 0) { + var task = self._queue[0]; + + // Remove this task if a matching event was passed. + if (task.event === event) { + self._queue.shift(); + self._loadQueue(); + } + + // Run the task if no event type is passed. + if (!event) { + task.action(); + } + } + + return self; + }, + + /** + * Fired when playback ends at the end of the duration. + * @param {Sound} sound The sound object to work with. + * @return {Howl} + */ + _ended: function(sound) { + var self = this; + var sprite = sound._sprite; + + // If we are using IE and there was network latency we may be clipping + // audio before it completes playing. Lets check the node to make sure it + // believes it has completed, before ending the playback. + if (!self._webAudio && sound._node && !sound._node.paused && !sound._node.ended && sound._node.currentTime < sound._stop) { + setTimeout(self._ended.bind(self, sound), 100); + return self; + } + + // Should this sound loop? + var loop = !!(sound._loop || self._sprite[sprite][2]); + + // Fire the ended event. + self._emit('end', sound._id); + + // Restart the playback for HTML5 Audio loop. + if (!self._webAudio && loop) { + self.stop(sound._id, true).play(sound._id); + } + + // Restart this timer if on a Web Audio loop. + if (self._webAudio && loop) { + self._emit('play', sound._id); + sound._seek = sound._start || 0; + sound._rateSeek = 0; + sound._playStart = Howler.ctx.currentTime; + + var timeout = ((sound._stop - sound._start) * 1000) / Math.abs(sound._rate); + self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout); + } + + // Mark the node as paused. + if (self._webAudio && !loop) { + sound._paused = true; + sound._ended = true; + sound._seek = sound._start || 0; + sound._rateSeek = 0; + self._clearTimer(sound._id); + + // Clean up the buffer source. + self._cleanBuffer(sound._node); + + // Attempt to auto-suspend AudioContext if no sounds are still playing. + Howler._autoSuspend(); + } + + // When using a sprite, end the track. + if (!self._webAudio && !loop) { + self.stop(sound._id, true); + } + + return self; + }, + + /** + * Clear the end timer for a sound playback. + * @param {Number} id The sound ID. + * @return {Howl} + */ + _clearTimer: function(id) { + var self = this; + + if (self._endTimers[id]) { + // Clear the timeout or remove the ended listener. + if (typeof self._endTimers[id] !== 'function') { + clearTimeout(self._endTimers[id]); + } else { + var sound = self._soundById(id); + if (sound && sound._node) { + sound._node.removeEventListener('ended', self._endTimers[id], false); + } + } + + delete self._endTimers[id]; + } + + return self; + }, + + /** + * Return the sound identified by this ID, or return null. + * @param {Number} id Sound ID + * @return {Object} Sound object or null. + */ + _soundById: function(id) { + var self = this; + + // Loop through all sounds and find the one with this ID. + for (var i=0; i=0; i--) { + if (cnt <= limit) { + return; + } + + if (self._sounds[i]._ended) { + // Disconnect the audio source when using Web Audio. + if (self._webAudio && self._sounds[i]._node) { + self._sounds[i]._node.disconnect(0); + } + + // Remove sounds until we have the pool size. + self._sounds.splice(i, 1); + cnt--; + } + } + }, + + /** + * Get all ID's from the sounds pool. + * @param {Number} id Only return one ID if one is passed. + * @return {Array} Array of IDs. + */ + _getSoundIds: function(id) { + var self = this; + + if (typeof id === 'undefined') { + var ids = []; + for (var i=0; i= 0; + + if (Howler._scratchBuffer && node.bufferSource) { + node.bufferSource.onended = null; + node.bufferSource.disconnect(0); + if (isIOS) { + try { node.bufferSource.buffer = Howler._scratchBuffer; } catch(e) {} + } + } + node.bufferSource = null; + + return self; + }, + + /** + * Set the source to a 0-second silence to stop any downloading (except in IE). + * @param {Object} node Audio node to clear. + */ + _clearSound: function(node) { + var checkIE = /MSIE |Trident\//.test(Howler._navigator && Howler._navigator.userAgent); + if (!checkIE) { + node.src = 'data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA'; + } + } + }; + + /** Single Sound Methods **/ + /***************************************************************************/ + + /** + * Setup the sound object, which each node attached to a Howl group is contained in. + * @param {Object} howl The Howl parent group. + */ + var Sound = function(howl) { + this._parent = howl; + this.init(); + }; + Sound.prototype = { + /** + * Initialize a new Sound object. + * @return {Sound} + */ + init: function() { + var self = this; + var parent = self._parent; + + // Setup the default parameters. + self._muted = parent._muted; + self._loop = parent._loop; + self._volume = parent._volume; + self._rate = parent._rate; + self._seek = 0; + self._paused = true; + self._ended = true; + self._sprite = '__default'; + + // Generate a unique ID for this sound. + self._id = ++Howler._counter; + + // Add itself to the parent's pool. + parent._sounds.push(self); + + // Create the new node. + self.create(); + + return self; + }, + + /** + * Create and setup a new sound object, whether HTML5 Audio or Web Audio. + * @return {Sound} + */ + create: function() { + var self = this; + var parent = self._parent; + var volume = (Howler._muted || self._muted || self._parent._muted) ? 0 : self._volume; + + if (parent._webAudio) { + // Create the gain node for controlling volume (the source will connect to this). + self._node = (typeof Howler.ctx.createGain === 'undefined') ? Howler.ctx.createGainNode() : Howler.ctx.createGain(); + self._node.gain.setValueAtTime(volume, Howler.ctx.currentTime); + self._node.paused = true; + self._node.connect(Howler.masterGain); + } else { + // Get an unlocked Audio object from the pool. + self._node = Howler._obtainHtml5Audio(); + + // Listen for errors (http://dev.w3.org/html5/spec-author-view/spec.html#mediaerror). + self._errorFn = self._errorListener.bind(self); + self._node.addEventListener('error', self._errorFn, false); + + // Listen for 'canplaythrough' event to let us know the sound is ready. + self._loadFn = self._loadListener.bind(self); + self._node.addEventListener(Howler._canPlayEvent, self._loadFn, false); + + // Setup the new audio node. + self._node.src = parent._src; + self._node.preload = 'auto'; + self._node.volume = volume * Howler.volume(); + + // Begin loading the source. + self._node.load(); + } + + return self; + }, + + /** + * Reset the parameters of this sound to the original state (for recycle). + * @return {Sound} + */ + reset: function() { + var self = this; + var parent = self._parent; + + // Reset all of the parameters of this sound. + self._muted = parent._muted; + self._loop = parent._loop; + self._volume = parent._volume; + self._rate = parent._rate; + self._seek = 0; + self._rateSeek = 0; + self._paused = true; + self._ended = true; + self._sprite = '__default'; + + // Generate a new ID so that it isn't confused with the previous sound. + self._id = ++Howler._counter; + + return self; + }, + + /** + * HTML5 Audio error listener callback. + */ + _errorListener: function() { + var self = this; + + // Fire an error event and pass back the code. + self._parent._emit('loaderror', self._id, self._node.error ? self._node.error.code : 0); + + // Clear the event listener. + self._node.removeEventListener('error', self._errorFn, false); + }, + + /** + * HTML5 Audio canplaythrough listener callback. + */ + _loadListener: function() { + var self = this; + var parent = self._parent; + + // Round up the duration to account for the lower precision in HTML5 Audio. + parent._duration = Math.ceil(self._node.duration * 10) / 10; + + // Setup a sprite if none is defined. + if (Object.keys(parent._sprite).length === 0) { + parent._sprite = {__default: [0, parent._duration * 1000]}; + } + + if (parent._state !== 'loaded') { + parent._state = 'loaded'; + parent._emit('load'); + parent._loadQueue(); + } + + // Clear the event listener. + self._node.removeEventListener(Howler._canPlayEvent, self._loadFn, false); + } + }; + + /** Helper Methods **/ + /***************************************************************************/ + + var cache = {}; + + /** + * Buffer a sound from URL, Data URI or cache and decode to audio source (Web Audio API). + * @param {Howl} self + */ + var loadBuffer = function(self) { + var url = self._src; + + // Check if the buffer has already been cached and use it instead. + if (cache[url]) { + // Set the duration from the cache. + self._duration = cache[url].duration; + + // Load the sound into this Howl. + loadSound(self); + + return; + } + + if (/^data:[^;]+;base64,/.test(url)) { + // Decode the base64 data URI without XHR, since some browsers don't support it. + var data = atob(url.split(',')[1]); + var dataView = new Uint8Array(data.length); + for (var i=0; i 0) { + cache[self._src] = buffer; + loadSound(self, buffer); + } else { + error(); + } + }; + + // Decode the buffer into an audio source. + if (typeof Promise !== 'undefined' && Howler.ctx.decodeAudioData.length === 1) { + Howler.ctx.decodeAudioData(arraybuffer).then(success).catch(error); + } else { + Howler.ctx.decodeAudioData(arraybuffer, success, error); + } + } + + /** + * Sound is now loaded, so finish setting everything up and fire the loaded event. + * @param {Howl} self + * @param {Object} buffer The decoded buffer sound source. + */ + var loadSound = function(self, buffer) { + // Set the duration. + if (buffer && !self._duration) { + self._duration = buffer.duration; + } + + // Setup a sprite if none is defined. + if (Object.keys(self._sprite).length === 0) { + self._sprite = {__default: [0, self._duration * 1000]}; + } + + // Fire the loaded event. + if (self._state !== 'loaded') { + self._state = 'loaded'; + self._emit('load'); + self._loadQueue(); + } + }; + + /** + * Setup the audio context when available, or switch to HTML5 Audio mode. + */ + var setupAudioContext = function() { + // If we have already detected that Web Audio isn't supported, don't run this step again. + if (!Howler.usingWebAudio) { + return; + } + + // Check if we are using Web Audio and setup the AudioContext if we are. + try { + if (typeof AudioContext !== 'undefined') { + Howler.ctx = new AudioContext(); + } else if (typeof webkitAudioContext !== 'undefined') { + Howler.ctx = new webkitAudioContext(); + } else { + Howler.usingWebAudio = false; + } + } catch(e) { + Howler.usingWebAudio = false; + } + + // If the audio context creation still failed, set using web audio to false. + if (!Howler.ctx) { + Howler.usingWebAudio = false; + } + + // Check if a webview is being used on iOS8 or earlier (rather than the browser). + // If it is, disable Web Audio as it causes crashing. + var iOS = (/iP(hone|od|ad)/.test(Howler._navigator && Howler._navigator.platform)); + var appVersion = Howler._navigator && Howler._navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/); + var version = appVersion ? parseInt(appVersion[1], 10) : null; + if (iOS && version && version < 9) { + var safari = /safari/.test(Howler._navigator && Howler._navigator.userAgent.toLowerCase()); + if (Howler._navigator && Howler._navigator.standalone && !safari || Howler._navigator && !Howler._navigator.standalone && !safari) { + Howler.usingWebAudio = false; + } + } + + // Create and expose the master GainNode when using Web Audio (useful for plugins or advanced usage). + if (Howler.usingWebAudio) { + Howler.masterGain = (typeof Howler.ctx.createGain === 'undefined') ? Howler.ctx.createGainNode() : Howler.ctx.createGain(); + Howler.masterGain.gain.setValueAtTime(Howler._muted ? 0 : 1, Howler.ctx.currentTime); + Howler.masterGain.connect(Howler.ctx.destination); + } + + // Re-run the setup on Howler. + Howler._setup(); + }; + + // Add support for AMD (Asynchronous Module Definition) libraries such as require.js. + if (typeof define === 'function' && define.amd) { + define([], function() { + return { + Howler: Howler, + Howl: Howl + }; + }); + } + + // Add support for CommonJS libraries such as browserify. + if (typeof exports !== 'undefined') { + exports.Howler = Howler; + exports.Howl = Howl; + } + + // Define globally in case AMD is not available or unused. + if (typeof window !== 'undefined') { + window.HowlerGlobal = HowlerGlobal; + window.Howler = Howler; + window.Howl = Howl; + window.Sound = Sound; + } else if (typeof global !== 'undefined') { // Add to global in Node.js (for testing, etc). + global.HowlerGlobal = HowlerGlobal; + global.Howler = Howler; + global.Howl = Howl; + global.Sound = Sound; + } +})(); + + +/*! + * Spatial Plugin - Adds support for stereo and 3D audio where Web Audio is supported. + * + * howler.js v2.1.2 + * howlerjs.com + * + * (c) 2013-2019, James Simpson of GoldFire Studios + * goldfirestudios.com + * + * MIT License + */ + +(function() { + + 'use strict'; + + // Setup default properties. + HowlerGlobal.prototype._pos = [0, 0, 0]; + HowlerGlobal.prototype._orientation = [0, 0, -1, 0, 1, 0]; + + /** Global Methods **/ + /***************************************************************************/ + + /** + * Helper method to update the stereo panning position of all current Howls. + * Future Howls will not use this value unless explicitly set. + * @param {Number} pan A value of -1.0 is all the way left and 1.0 is all the way right. + * @return {Howler/Number} Self or current stereo panning value. + */ + HowlerGlobal.prototype.stereo = function(pan) { + var self = this; + + // Stop right here if not using Web Audio. + if (!self.ctx || !self.ctx.listener) { + return self; + } + + // Loop through all Howls and update their stereo panning. + for (var i=self._howls.length-1; i>=0; i--) { + self._howls[i].stereo(pan); + } + + return self; + }; + + /** + * Get/set the position of the listener in 3D cartesian space. Sounds using + * 3D position will be relative to the listener's position. + * @param {Number} x The x-position of the listener. + * @param {Number} y The y-position of the listener. + * @param {Number} z The z-position of the listener. + * @return {Howler/Array} Self or current listener position. + */ + HowlerGlobal.prototype.pos = function(x, y, z) { + var self = this; + + // Stop right here if not using Web Audio. + if (!self.ctx || !self.ctx.listener) { + return self; + } + + // Set the defaults for optional 'y' & 'z'. + y = (typeof y !== 'number') ? self._pos[1] : y; + z = (typeof z !== 'number') ? self._pos[2] : z; + + if (typeof x === 'number') { + self._pos = [x, y, z]; + + if (typeof self.ctx.listener.positionX !== 'undefined') { + self.ctx.listener.positionX.setTargetAtTime(self._pos[0], Howler.ctx.currentTime, 0.1); + self.ctx.listener.positionY.setTargetAtTime(self._pos[1], Howler.ctx.currentTime, 0.1); + self.ctx.listener.positionZ.setTargetAtTime(self._pos[2], Howler.ctx.currentTime, 0.1); + } else { + self.ctx.listener.setPosition(self._pos[0], self._pos[1], self._pos[2]); + } + } else { + return self._pos; + } + + return self; + }; + + /** + * Get/set the direction the listener is pointing in the 3D cartesian space. + * A front and up vector must be provided. The front is the direction the + * face of the listener is pointing, and up is the direction the top of the + * listener is pointing. Thus, these values are expected to be at right angles + * from each other. + * @param {Number} x The x-orientation of the listener. + * @param {Number} y The y-orientation of the listener. + * @param {Number} z The z-orientation of the listener. + * @param {Number} xUp The x-orientation of the top of the listener. + * @param {Number} yUp The y-orientation of the top of the listener. + * @param {Number} zUp The z-orientation of the top of the listener. + * @return {Howler/Array} Returns self or the current orientation vectors. + */ + HowlerGlobal.prototype.orientation = function(x, y, z, xUp, yUp, zUp) { + var self = this; + + // Stop right here if not using Web Audio. + if (!self.ctx || !self.ctx.listener) { + return self; + } + + // Set the defaults for optional 'y' & 'z'. + var or = self._orientation; + y = (typeof y !== 'number') ? or[1] : y; + z = (typeof z !== 'number') ? or[2] : z; + xUp = (typeof xUp !== 'number') ? or[3] : xUp; + yUp = (typeof yUp !== 'number') ? or[4] : yUp; + zUp = (typeof zUp !== 'number') ? or[5] : zUp; + + if (typeof x === 'number') { + self._orientation = [x, y, z, xUp, yUp, zUp]; + + if (typeof self.ctx.listener.forwardX !== 'undefined') { + self.ctx.listener.forwardX.setTargetAtTime(x, Howler.ctx.currentTime, 0.1); + self.ctx.listener.forwardY.setTargetAtTime(y, Howler.ctx.currentTime, 0.1); + self.ctx.listener.forwardZ.setTargetAtTime(z, Howler.ctx.currentTime, 0.1); + self.ctx.listener.upX.setTargetAtTime(x, Howler.ctx.currentTime, 0.1); + self.ctx.listener.upY.setTargetAtTime(y, Howler.ctx.currentTime, 0.1); + self.ctx.listener.upZ.setTargetAtTime(z, Howler.ctx.currentTime, 0.1); + } else { + self.ctx.listener.setOrientation(x, y, z, xUp, yUp, zUp); + } + } else { + return or; + } + + return self; + }; + + /** Group Methods **/ + /***************************************************************************/ + + /** + * Add new properties to the core init. + * @param {Function} _super Core init method. + * @return {Howl} + */ + Howl.prototype.init = (function(_super) { + return function(o) { + var self = this; + + // Setup user-defined default properties. + self._orientation = o.orientation || [1, 0, 0]; + self._stereo = o.stereo || null; + self._pos = o.pos || null; + self._pannerAttr = { + coneInnerAngle: typeof o.coneInnerAngle !== 'undefined' ? o.coneInnerAngle : 360, + coneOuterAngle: typeof o.coneOuterAngle !== 'undefined' ? o.coneOuterAngle : 360, + coneOuterGain: typeof o.coneOuterGain !== 'undefined' ? o.coneOuterGain : 0, + distanceModel: typeof o.distanceModel !== 'undefined' ? o.distanceModel : 'inverse', + maxDistance: typeof o.maxDistance !== 'undefined' ? o.maxDistance : 10000, + panningModel: typeof o.panningModel !== 'undefined' ? o.panningModel : 'HRTF', + refDistance: typeof o.refDistance !== 'undefined' ? o.refDistance : 1, + rolloffFactor: typeof o.rolloffFactor !== 'undefined' ? o.rolloffFactor : 1 + }; + + // Setup event listeners. + self._onstereo = o.onstereo ? [{fn: o.onstereo}] : []; + self._onpos = o.onpos ? [{fn: o.onpos}] : []; + self._onorientation = o.onorientation ? [{fn: o.onorientation}] : []; + + // Complete initilization with howler.js core's init function. + return _super.call(this, o); + }; + })(Howl.prototype.init); + + /** + * Get/set the stereo panning of the audio source for this sound or all in the group. + * @param {Number} pan A value of -1.0 is all the way left and 1.0 is all the way right. + * @param {Number} id (optional) The sound ID. If none is passed, all in group will be updated. + * @return {Howl/Number} Returns self or the current stereo panning value. + */ + Howl.prototype.stereo = function(pan, id) { + var self = this; + + // Stop right here if not using Web Audio. + if (!self._webAudio) { + return self; + } + + // If the sound hasn't loaded, add it to the load queue to change stereo pan when capable. + if (self._state !== 'loaded') { + self._queue.push({ + event: 'stereo', + action: function() { + self.stereo(pan, id); + } + }); + + return self; + } + + // Check for PannerStereoNode support and fallback to PannerNode if it doesn't exist. + var pannerType = (typeof Howler.ctx.createStereoPanner === 'undefined') ? 'spatial' : 'stereo'; + + // Setup the group's stereo panning if no ID is passed. + if (typeof id === 'undefined') { + // Return the group's stereo panning if no parameters are passed. + if (typeof pan === 'number') { + self._stereo = pan; + self._pos = [pan, 0, 0]; + } else { + return self._stereo; + } + } + + // Change the streo panning of one or all sounds in group. + var ids = self._getSoundIds(id); + for (var i=0; i Returns the group's values. + * pannerAttr(id) -> Returns the sound id's values. + * pannerAttr(o) -> Set's the values of all sounds in this Howl group. + * pannerAttr(o, id) -> Set's the values of passed sound id. + * + * Attributes: + * coneInnerAngle - (360 by default) A parameter for directional audio sources, this is an angle, in degrees, + * inside of which there will be no volume reduction. + * coneOuterAngle - (360 by default) A parameter for directional audio sources, this is an angle, in degrees, + * outside of which the volume will be reduced to a constant value of `coneOuterGain`. + * coneOuterGain - (0 by default) A parameter for directional audio sources, this is the gain outside of the + * `coneOuterAngle`. It is a linear value in the range `[0, 1]`. + * distanceModel - ('inverse' by default) Determines algorithm used to reduce volume as audio moves away from + * listener. Can be `linear`, `inverse` or `exponential. + * maxDistance - (10000 by default) The maximum distance between source and listener, after which the volume + * will not be reduced any further. + * refDistance - (1 by default) A reference distance for reducing volume as source moves further from the listener. + * This is simply a variable of the distance model and has a different effect depending on which model + * is used and the scale of your coordinates. Generally, volume will be equal to 1 at this distance. + * rolloffFactor - (1 by default) How quickly the volume reduces as source moves from listener. This is simply a + * variable of the distance model and can be in the range of `[0, 1]` with `linear` and `[0, ∞]` + * with `inverse` and `exponential`. + * panningModel - ('HRTF' by default) Determines which spatialization algorithm is used to position audio. + * Can be `HRTF` or `equalpower`. + * + * @return {Howl/Object} Returns self or current panner attributes. + */ + Howl.prototype.pannerAttr = function() { + var self = this; + var args = arguments; + var o, id, sound; + + // Stop right here if not using Web Audio. + if (!self._webAudio) { + return self; + } + + // Determine the values based on arguments. + if (args.length === 0) { + // Return the group's panner attribute values. + return self._pannerAttr; + } else if (args.length === 1) { + if (typeof args[0] === 'object') { + o = args[0]; + + // Set the grou's panner attribute values. + if (typeof id === 'undefined') { + if (!o.pannerAttr) { + o.pannerAttr = { + coneInnerAngle: o.coneInnerAngle, + coneOuterAngle: o.coneOuterAngle, + coneOuterGain: o.coneOuterGain, + distanceModel: o.distanceModel, + maxDistance: o.maxDistance, + refDistance: o.refDistance, + rolloffFactor: o.rolloffFactor, + panningModel: o.panningModel + }; + } + + self._pannerAttr = { + coneInnerAngle: typeof o.pannerAttr.coneInnerAngle !== 'undefined' ? o.pannerAttr.coneInnerAngle : self._coneInnerAngle, + coneOuterAngle: typeof o.pannerAttr.coneOuterAngle !== 'undefined' ? o.pannerAttr.coneOuterAngle : self._coneOuterAngle, + coneOuterGain: typeof o.pannerAttr.coneOuterGain !== 'undefined' ? o.pannerAttr.coneOuterGain : self._coneOuterGain, + distanceModel: typeof o.pannerAttr.distanceModel !== 'undefined' ? o.pannerAttr.distanceModel : self._distanceModel, + maxDistance: typeof o.pannerAttr.maxDistance !== 'undefined' ? o.pannerAttr.maxDistance : self._maxDistance, + refDistance: typeof o.pannerAttr.refDistance !== 'undefined' ? o.pannerAttr.refDistance : self._refDistance, + rolloffFactor: typeof o.pannerAttr.rolloffFactor !== 'undefined' ? o.pannerAttr.rolloffFactor : self._rolloffFactor, + panningModel: typeof o.pannerAttr.panningModel !== 'undefined' ? o.pannerAttr.panningModel : self._panningModel + }; + } + } else { + // Return this sound's panner attribute values. + sound = self._soundById(parseInt(args[0], 10)); + return sound ? sound._pannerAttr : self._pannerAttr; + } + } else if (args.length === 2) { + o = args[0]; + id = parseInt(args[1], 10); + } + + // Update the values of the specified sounds. + var ids = self._getSoundIds(id); + for (var i=0; i=0&&e<=1){if(o._volume=e,o._muted)return o;o.usingWebAudio&&o.masterGain.gain.setValueAtTime(e,n.ctx.currentTime);for(var t=0;t=0;o--)e._howls[o].unload();return e.usingWebAudio&&e.ctx&&void 0!==e.ctx.close&&(e.ctx.close(),e.ctx=null,_()),e},codecs:function(e){return(this||n)._codecs[e.replace(/^x-/,"")]},_setup:function(){var e=this||n;if(e.state=e.ctx?e.ctx.state||"suspended":"suspended",e._autoSuspend(),!e.usingWebAudio)if("undefined"!=typeof Audio)try{var o=new Audio;void 0===o.oncanplaythrough&&(e._canPlayEvent="canplay")}catch(n){e.noAudio=!0}else e.noAudio=!0;try{var o=new Audio;o.muted&&(e.noAudio=!0)}catch(e){}return e.noAudio||e._setupCodecs(),e},_setupCodecs:function(){var e=this||n,o=null;try{o="undefined"!=typeof Audio?new Audio:null}catch(n){return e}if(!o||"function"!=typeof o.canPlayType)return e;var t=o.canPlayType("audio/mpeg;").replace(/^no$/,""),r=e._navigator&&e._navigator.userAgent.match(/OPR\/([0-6].)/g),a=r&&parseInt(r[0].split("/")[1],10)<33;return e._codecs={mp3:!(a||!t&&!o.canPlayType("audio/mp3;").replace(/^no$/,"")),mpeg:!!t,opus:!!o.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/,""),ogg:!!o.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),oga:!!o.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),wav:!!o.canPlayType('audio/wav; codecs="1"').replace(/^no$/,""),aac:!!o.canPlayType("audio/aac;").replace(/^no$/,""),caf:!!o.canPlayType("audio/x-caf;").replace(/^no$/,""),m4a:!!(o.canPlayType("audio/x-m4a;")||o.canPlayType("audio/m4a;")||o.canPlayType("audio/aac;")).replace(/^no$/,""),mp4:!!(o.canPlayType("audio/x-mp4;")||o.canPlayType("audio/mp4;")||o.canPlayType("audio/aac;")).replace(/^no$/,""),weba:!!o.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/,""),webm:!!o.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/,""),dolby:!!o.canPlayType('audio/mp4; codecs="ec-3"').replace(/^no$/,""),flac:!!(o.canPlayType("audio/x-flac;")||o.canPlayType("audio/flac;")).replace(/^no$/,"")},e},_unlockAudio:function(){var e=this||n;if(!e._audioUnlocked&&e.ctx){e._audioUnlocked=!1,e.autoUnlock=!1,e._mobileUnloaded||44100===e.ctx.sampleRate||(e._mobileUnloaded=!0,e.unload()),e._scratchBuffer=e.ctx.createBuffer(1,1,22050);var o=function(n){for(var t=0;t0?i._seek:t._sprite[e][0]/1e3),s=Math.max(0,(t._sprite[e][0]+t._sprite[e][1])/1e3-_),l=1e3*s/Math.abs(i._rate),c=t._sprite[e][0]/1e3,f=(t._sprite[e][0]+t._sprite[e][1])/1e3,p=!(!i._loop&&!t._sprite[e][2]);i._sprite=e,i._ended=!1;var m=function(){i._paused=!1,i._seek=_,i._start=c,i._stop=f,i._loop=p};if(_>=f)return void t._ended(i);var v=i._node;if(t._webAudio){var h=function(){t._playLock=!1,m(),t._refreshBuffer(i);var e=i._muted||t._muted?0:i._volume;v.gain.setValueAtTime(e,n.ctx.currentTime),i._playStart=n.ctx.currentTime,void 0===v.bufferSource.start?i._loop?v.bufferSource.noteGrainOn(0,_,86400):v.bufferSource.noteGrainOn(0,_,s):i._loop?v.bufferSource.start(0,_,86400):v.bufferSource.start(0,_,s),l!==1/0&&(t._endTimers[i._id]=setTimeout(t._ended.bind(t,i),l)),o||setTimeout(function(){t._emit("play",i._id),t._loadQueue()},0)};"running"===n.state?h():(t._playLock=!0,t.once("resume",h),t._clearTimer(i._id))}else{var y=function(){v.currentTime=_,v.muted=i._muted||t._muted||n._muted||v.muted,v.volume=i._volume*n.volume(),v.playbackRate=i._rate;try{var r=v.play();if(r&&"undefined"!=typeof Promise&&(r instanceof Promise||"function"==typeof r.then)?(t._playLock=!0,m(),r.then(function(){t._playLock=!1,v._unlocked=!0,o||(t._emit("play",i._id),t._loadQueue())}).catch(function(){t._playLock=!1,t._emit("playerror",i._id,"Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction."),i._ended=!0,i._paused=!0})):o||(t._playLock=!1,m(),t._emit("play",i._id),t._loadQueue()),v.playbackRate=i._rate,v.paused)return void t._emit("playerror",i._id,"Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction.");"__default"!==e||i._loop?t._endTimers[i._id]=setTimeout(t._ended.bind(t,i),l):(t._endTimers[i._id]=function(){t._ended(i),v.removeEventListener("ended",t._endTimers[i._id],!1)},v.addEventListener("ended",t._endTimers[i._id],!1))}catch(e){t._emit("playerror",i._id,e)}};"data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA"===v.src&&(v.src=t._src,v.load());var g=window&&window.ejecta||!v.readyState&&n._navigator.isCocoonJS;if(v.readyState>=3||g)y();else{t._playLock=!0;var A=function(){y(),v.removeEventListener(n._canPlayEvent,A,!1)};v.addEventListener(n._canPlayEvent,A,!1),t._clearTimer(i._id)}}return i._id},pause:function(e){var n=this;if("loaded"!==n._state||n._playLock)return n._queue.push({event:"pause",action:function(){n.pause(e)}}),n;for(var o=n._getSoundIds(e),t=0;t=0?o=parseInt(r[0],10):e=parseFloat(r[0])}else r.length>=2&&(e=parseFloat(r[0]),o=parseInt(r[1],10));var a;if(!(void 0!==e&&e>=0&&e<=1))return a=o?t._soundById(o):t._sounds[0],a?a._volume:0;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"volume",action:function(){t.volume.apply(t,r)}}),t;void 0===o&&(t._volume=e),o=t._getSoundIds(o);for(var u=0;u0?t/_:t),l=Date.now();e._fadeTo=o,e._interval=setInterval(function(){var r=(Date.now()-l)/t;l=Date.now(),i+=d*r,i=Math.max(0,i),i=Math.min(1,i),i=Math.round(100*i)/100,u._webAudio?e._volume=i:u.volume(i,e._id,!0),a&&(u._volume=i),(on&&i>=o)&&(clearInterval(e._interval),e._interval=null,e._fadeTo=null,u.volume(o,e._id),u._emit("fade",e._id))},s)},_stopFade:function(e){var o=this,t=o._soundById(e);return t&&t._interval&&(o._webAudio&&t._node.gain.cancelScheduledValues(n.ctx.currentTime),clearInterval(t._interval),t._interval=null,o.volume(t._fadeTo,e),t._fadeTo=null,o._emit("fade",e)),o},loop:function(){var e,n,o,t=this,r=arguments;if(0===r.length)return t._loop;if(1===r.length){if("boolean"!=typeof r[0])return!!(o=t._soundById(parseInt(r[0],10)))&&o._loop;e=r[0],t._loop=e}else 2===r.length&&(e=r[0],n=parseInt(r[1],10));for(var a=t._getSoundIds(n),u=0;u=0?o=parseInt(r[0],10):e=parseFloat(r[0])}else 2===r.length&&(e=parseFloat(r[0]),o=parseInt(r[1],10));var i;if("number"!=typeof e)return i=t._soundById(o),i?i._rate:t._rate;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"rate",action:function(){t.rate.apply(t,r)}}),t;void 0===o&&(t._rate=e),o=t._getSoundIds(o);for(var d=0;d=0?o=parseInt(r[0],10):t._sounds.length&&(o=t._sounds[0]._id,e=parseFloat(r[0]))}else 2===r.length&&(e=parseFloat(r[0]),o=parseInt(r[1],10));if(void 0===o)return t;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"seek",action:function(){t.seek.apply(t,r)}}),t;var i=t._soundById(o);if(i){if(!("number"==typeof e&&e>=0)){if(t._webAudio){var d=t.playing(o)?n.ctx.currentTime-i._playStart:0,_=i._rateSeek?i._rateSeek-i._seek:0;return i._seek+(_+d*Math.abs(i._rate))}return i._node.currentTime}var s=t.playing(o);s&&t.pause(o,!0),i._seek=e,i._ended=!1,t._clearTimer(o),t._webAudio||!i._node||isNaN(i._node.duration)||(i._node.currentTime=e);var l=function(){t._emit("seek",o),s&&t.play(o,!0)};if(s&&!t._webAudio){var c=function(){t._playLock?setTimeout(c,0):l()};setTimeout(c,0)}else l()}return t},playing:function(e){var n=this;if("number"==typeof e){var o=n._soundById(e);return!!o&&!o._paused}for(var t=0;t=0&&n._howls.splice(a,1);var u=!0;for(t=0;t=0){u=!1;break}return r&&u&&delete r[e._src],n.noAudio=!1,e._state="unloaded",e._sounds=[],e=null,null},on:function(e,n,o,t){var r=this,a=r["_on"+e];return"function"==typeof n&&a.push(t?{id:o,fn:n,once:t}:{id:o,fn:n}),r},off:function(e,n,o){var t=this,r=t["_on"+e],a=0;if("number"==typeof n&&(o=n,n=null),n||o)for(a=0;a=0;a--)r[a].id&&r[a].id!==n&&"load"!==e||(setTimeout(function(e){e.call(this,n,o)}.bind(t,r[a].fn),0),r[a].once&&t.off(e,r[a].fn,r[a].id));return t._loadQueue(e),t},_loadQueue:function(e){var n=this;if(n._queue.length>0){var o=n._queue[0];o.event===e&&(n._queue.shift(),n._loadQueue()),e||o.action()}return n},_ended:function(e){var o=this,t=e._sprite;if(!o._webAudio&&e._node&&!e._node.paused&&!e._node.ended&&e._node.currentTime=0;t--){if(o<=n)return;e._sounds[t]._ended&&(e._webAudio&&e._sounds[t]._node&&e._sounds[t]._node.disconnect(0),e._sounds.splice(t,1),o--)}}},_getSoundIds:function(e){var n=this;if(void 0===e){for(var o=[],t=0;t=0;if(n._scratchBuffer&&e.bufferSource&&(e.bufferSource.onended=null,e.bufferSource.disconnect(0),t))try{e.bufferSource.buffer=n._scratchBuffer}catch(e){}return e.bufferSource=null,o},_clearSound:function(e){/MSIE |Trident\//.test(n._navigator&&n._navigator.userAgent)||(e.src="data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA")}};var t=function(e){this._parent=e,this.init()};t.prototype={init:function(){var e=this,o=e._parent;return e._muted=o._muted,e._loop=o._loop,e._volume=o._volume,e._rate=o._rate,e._seek=0,e._paused=!0,e._ended=!0,e._sprite="__default",e._id=++n._counter,o._sounds.push(e),e.create(),e},create:function(){var e=this,o=e._parent,t=n._muted||e._muted||e._parent._muted?0:e._volume;return o._webAudio?(e._node=void 0===n.ctx.createGain?n.ctx.createGainNode():n.ctx.createGain(),e._node.gain.setValueAtTime(t,n.ctx.currentTime),e._node.paused=!0,e._node.connect(n.masterGain)):(e._node=n._obtainHtml5Audio(),e._errorFn=e._errorListener.bind(e),e._node.addEventListener("error",e._errorFn,!1),e._loadFn=e._loadListener.bind(e),e._node.addEventListener(n._canPlayEvent,e._loadFn,!1),e._node.src=o._src,e._node.preload="auto",e._node.volume=t*n.volume(),e._node.load()),e},reset:function(){var e=this,o=e._parent;return e._muted=o._muted,e._loop=o._loop,e._volume=o._volume,e._rate=o._rate,e._seek=0,e._rateSeek=0,e._paused=!0,e._ended=!0,e._sprite="__default",e._id=++n._counter,e},_errorListener:function(){var e=this;e._parent._emit("loaderror",e._id,e._node.error?e._node.error.code:0),e._node.removeEventListener("error",e._errorFn,!1)},_loadListener:function(){var e=this,o=e._parent;o._duration=Math.ceil(10*e._node.duration)/10,0===Object.keys(o._sprite).length&&(o._sprite={__default:[0,1e3*o._duration]}),"loaded"!==o._state&&(o._state="loaded",o._emit("load"),o._loadQueue()),e._node.removeEventListener(n._canPlayEvent,e._loadFn,!1)}};var r={},a=function(e){var n=e._src;if(r[n])return e._duration=r[n].duration,void d(e);if(/^data:[^;]+;base64,/.test(n)){for(var o=atob(n.split(",")[1]),t=new Uint8Array(o.length),a=0;a0?(r[o._src]=e,d(o,e)):t()};"undefined"!=typeof Promise&&1===n.ctx.decodeAudioData.length?n.ctx.decodeAudioData(e).then(a).catch(t):n.ctx.decodeAudioData(e,a,t)},d=function(e,n){n&&!e._duration&&(e._duration=n.duration),0===Object.keys(e._sprite).length&&(e._sprite={__default:[0,1e3*e._duration]}),"loaded"!==e._state&&(e._state="loaded",e._emit("load"),e._loadQueue())},_=function(){if(n.usingWebAudio){try{"undefined"!=typeof AudioContext?n.ctx=new AudioContext:"undefined"!=typeof webkitAudioContext?n.ctx=new webkitAudioContext:n.usingWebAudio=!1}catch(e){n.usingWebAudio=!1}n.ctx||(n.usingWebAudio=!1);var e=/iP(hone|od|ad)/.test(n._navigator&&n._navigator.platform),o=n._navigator&&n._navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/),t=o?parseInt(o[1],10):null;if(e&&t&&t<9){var r=/safari/.test(n._navigator&&n._navigator.userAgent.toLowerCase());(n._navigator&&n._navigator.standalone&&!r||n._navigator&&!n._navigator.standalone&&!r)&&(n.usingWebAudio=!1)}n.usingWebAudio&&(n.masterGain=void 0===n.ctx.createGain?n.ctx.createGainNode():n.ctx.createGain(),n.masterGain.gain.setValueAtTime(n._muted?0:1,n.ctx.currentTime),n.masterGain.connect(n.ctx.destination)),n._setup()}};"function"==typeof define&&define.amd&&define([],function(){return{Howler:n,Howl:o}}),"undefined"!=typeof exports&&(exports.Howler=n,exports.Howl=o),"undefined"!=typeof window?(window.HowlerGlobal=e,window.Howler=n,window.Howl=o,window.Sound=t):"undefined"!=typeof global&&(global.HowlerGlobal=e,global.Howler=n,global.Howl=o,global.Sound=t)}(); -/*! Spatial Plugin */ +/*! howler.js v2.1.2 | (c) 2013-2019, James Simpson of GoldFire Studios | MIT License | howlerjs.com */ +!function(){"use strict";var e=function(){this.init()};e.prototype={init:function(){var e=this||n;return e._counter=1e3,e._html5AudioPool=[],e.html5PoolSize=10,e._codecs={},e._howls=[],e._muted=!1,e._volume=1,e._canPlayEvent="canplaythrough",e._navigator="undefined"!=typeof window&&window.navigator?window.navigator:null,e.masterGain=null,e.noAudio=!1,e.usingWebAudio=!0,e.autoSuspend=!0,e.ctx=null,e.autoUnlock=!0,e._setup(),e},volume:function(e){var o=this||n;if(e=parseFloat(e),o.ctx||_(),void 0!==e&&e>=0&&e<=1){if(o._volume=e,o._muted)return o;o.usingWebAudio&&o.masterGain.gain.setValueAtTime(e,n.ctx.currentTime);for(var t=0;t=0;o--)e._howls[o].unload();return e.usingWebAudio&&e.ctx&&void 0!==e.ctx.close&&(e.ctx.close(),e.ctx=null,_()),e},codecs:function(e){return(this||n)._codecs[e.replace(/^x-/,"")]},_setup:function(){var e=this||n;if(e.state=e.ctx?e.ctx.state||"suspended":"suspended",e._autoSuspend(),!e.usingWebAudio)if("undefined"!=typeof Audio)try{var o=new Audio;void 0===o.oncanplaythrough&&(e._canPlayEvent="canplay")}catch(n){e.noAudio=!0}else e.noAudio=!0;try{var o=new Audio;o.muted&&(e.noAudio=!0)}catch(e){}return e.noAudio||e._setupCodecs(),e},_setupCodecs:function(){var e=this||n,o=null;try{o="undefined"!=typeof Audio?new Audio:null}catch(n){return e}if(!o||"function"!=typeof o.canPlayType)return e;var t=o.canPlayType("audio/mpeg;").replace(/^no$/,""),r=e._navigator&&e._navigator.userAgent.match(/OPR\/([0-6].)/g),a=r&&parseInt(r[0].split("/")[1],10)<33;return e._codecs={mp3:!(a||!t&&!o.canPlayType("audio/mp3;").replace(/^no$/,"")),mpeg:!!t,opus:!!o.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/,""),ogg:!!o.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),oga:!!o.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,""),wav:!!o.canPlayType('audio/wav; codecs="1"').replace(/^no$/,""),aac:!!o.canPlayType("audio/aac;").replace(/^no$/,""),caf:!!o.canPlayType("audio/x-caf;").replace(/^no$/,""),m4a:!!(o.canPlayType("audio/x-m4a;")||o.canPlayType("audio/m4a;")||o.canPlayType("audio/aac;")).replace(/^no$/,""),mp4:!!(o.canPlayType("audio/x-mp4;")||o.canPlayType("audio/mp4;")||o.canPlayType("audio/aac;")).replace(/^no$/,""),weba:!!o.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/,""),webm:!!o.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/,""),dolby:!!o.canPlayType('audio/mp4; codecs="ec-3"').replace(/^no$/,""),flac:!!(o.canPlayType("audio/x-flac;")||o.canPlayType("audio/flac;")).replace(/^no$/,"")},e},_unlockAudio:function(){var e=this||n;if(!e._audioUnlocked&&e.ctx){e._audioUnlocked=!1,e.autoUnlock=!1,e._mobileUnloaded||44100===e.ctx.sampleRate||(e._mobileUnloaded=!0,e.unload()),e._scratchBuffer=e.ctx.createBuffer(1,1,22050);var o=function(n){for(var t=0;t0?i._seek:t._sprite[e][0]/1e3),s=Math.max(0,(t._sprite[e][0]+t._sprite[e][1])/1e3-_),l=1e3*s/Math.abs(i._rate),c=t._sprite[e][0]/1e3,f=(t._sprite[e][0]+t._sprite[e][1])/1e3,p=!(!i._loop&&!t._sprite[e][2]);i._sprite=e,i._ended=!1;var m=function(){i._paused=!1,i._seek=_,i._start=c,i._stop=f,i._loop=p};if(_>=f)return void t._ended(i);var v=i._node;if(t._webAudio){var h=function(){t._playLock=!1,m(),t._refreshBuffer(i);var e=i._muted||t._muted?0:i._volume;v.gain.setValueAtTime(e,n.ctx.currentTime),i._playStart=n.ctx.currentTime,void 0===v.bufferSource.start?i._loop?v.bufferSource.noteGrainOn(0,_,86400):v.bufferSource.noteGrainOn(0,_,s):i._loop?v.bufferSource.start(0,_,86400):v.bufferSource.start(0,_,s),l!==1/0&&(t._endTimers[i._id]=setTimeout(t._ended.bind(t,i),l)),o||setTimeout(function(){t._emit("play",i._id),t._loadQueue()},0)};"running"===n.state?h():(t._playLock=!0,t.once("resume",h),t._clearTimer(i._id))}else{var y=function(){v.currentTime=_,v.muted=i._muted||t._muted||n._muted||v.muted,v.volume=i._volume*n.volume(),v.playbackRate=i._rate;try{var r=v.play();if(r&&"undefined"!=typeof Promise&&(r instanceof Promise||"function"==typeof r.then)?(t._playLock=!0,m(),r.then(function(){t._playLock=!1,v._unlocked=!0,o||(t._emit("play",i._id),t._loadQueue())}).catch(function(){t._playLock=!1,t._emit("playerror",i._id,"Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction."),i._ended=!0,i._paused=!0})):o||(t._playLock=!1,m(),t._emit("play",i._id),t._loadQueue()),v.playbackRate=i._rate,v.paused)return void t._emit("playerror",i._id,"Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction.");"__default"!==e||i._loop?t._endTimers[i._id]=setTimeout(t._ended.bind(t,i),l):(t._endTimers[i._id]=function(){t._ended(i),v.removeEventListener("ended",t._endTimers[i._id],!1)},v.addEventListener("ended",t._endTimers[i._id],!1))}catch(e){t._emit("playerror",i._id,e)}};"data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA"===v.src&&(v.src=t._src,v.load());var g=window&&window.ejecta||!v.readyState&&n._navigator.isCocoonJS;if(v.readyState>=3||g)y();else{t._playLock=!0;var A=function(){y(),v.removeEventListener(n._canPlayEvent,A,!1)};v.addEventListener(n._canPlayEvent,A,!1),t._clearTimer(i._id)}}return i._id},pause:function(e){var n=this;if("loaded"!==n._state||n._playLock)return n._queue.push({event:"pause",action:function(){n.pause(e)}}),n;for(var o=n._getSoundIds(e),t=0;t=0?o=parseInt(r[0],10):e=parseFloat(r[0])}else r.length>=2&&(e=parseFloat(r[0]),o=parseInt(r[1],10));var a;if(!(void 0!==e&&e>=0&&e<=1))return a=o?t._soundById(o):t._sounds[0],a?a._volume:0;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"volume",action:function(){t.volume.apply(t,r)}}),t;void 0===o&&(t._volume=e),o=t._getSoundIds(o);for(var u=0;u0?t/_:t),l=Date.now();e._fadeTo=o,e._interval=setInterval(function(){var r=(Date.now()-l)/t;l=Date.now(),i+=d*r,i=Math.max(0,i),i=Math.min(1,i),i=Math.round(100*i)/100,u._webAudio?e._volume=i:u.volume(i,e._id,!0),a&&(u._volume=i),(on&&i>=o)&&(clearInterval(e._interval),e._interval=null,e._fadeTo=null,u.volume(o,e._id),u._emit("fade",e._id))},s)},_stopFade:function(e){var o=this,t=o._soundById(e);return t&&t._interval&&(o._webAudio&&t._node.gain.cancelScheduledValues(n.ctx.currentTime),clearInterval(t._interval),t._interval=null,o.volume(t._fadeTo,e),t._fadeTo=null,o._emit("fade",e)),o},loop:function(){var e,n,o,t=this,r=arguments;if(0===r.length)return t._loop;if(1===r.length){if("boolean"!=typeof r[0])return!!(o=t._soundById(parseInt(r[0],10)))&&o._loop;e=r[0],t._loop=e}else 2===r.length&&(e=r[0],n=parseInt(r[1],10));for(var a=t._getSoundIds(n),u=0;u=0?o=parseInt(r[0],10):e=parseFloat(r[0])}else 2===r.length&&(e=parseFloat(r[0]),o=parseInt(r[1],10));var i;if("number"!=typeof e)return i=t._soundById(o),i?i._rate:t._rate;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"rate",action:function(){t.rate.apply(t,r)}}),t;void 0===o&&(t._rate=e),o=t._getSoundIds(o);for(var d=0;d=0?o=parseInt(r[0],10):t._sounds.length&&(o=t._sounds[0]._id,e=parseFloat(r[0]))}else 2===r.length&&(e=parseFloat(r[0]),o=parseInt(r[1],10));if(void 0===o)return t;if("loaded"!==t._state||t._playLock)return t._queue.push({event:"seek",action:function(){t.seek.apply(t,r)}}),t;var i=t._soundById(o);if(i){if(!("number"==typeof e&&e>=0)){if(t._webAudio){var d=t.playing(o)?n.ctx.currentTime-i._playStart:0,_=i._rateSeek?i._rateSeek-i._seek:0;return i._seek+(_+d*Math.abs(i._rate))}return i._node.currentTime}var s=t.playing(o);s&&t.pause(o,!0),i._seek=e,i._ended=!1,t._clearTimer(o),t._webAudio||!i._node||isNaN(i._node.duration)||(i._node.currentTime=e);var l=function(){t._emit("seek",o),s&&t.play(o,!0)};if(s&&!t._webAudio){var c=function(){t._playLock?setTimeout(c,0):l()};setTimeout(c,0)}else l()}return t},playing:function(e){var n=this;if("number"==typeof e){var o=n._soundById(e);return!!o&&!o._paused}for(var t=0;t=0&&n._howls.splice(a,1);var u=!0;for(t=0;t=0){u=!1;break}return r&&u&&delete r[e._src],n.noAudio=!1,e._state="unloaded",e._sounds=[],e=null,null},on:function(e,n,o,t){var r=this,a=r["_on"+e];return"function"==typeof n&&a.push(t?{id:o,fn:n,once:t}:{id:o,fn:n}),r},off:function(e,n,o){var t=this,r=t["_on"+e],a=0;if("number"==typeof n&&(o=n,n=null),n||o)for(a=0;a=0;a--)r[a].id&&r[a].id!==n&&"load"!==e||(setTimeout(function(e){e.call(this,n,o)}.bind(t,r[a].fn),0),r[a].once&&t.off(e,r[a].fn,r[a].id));return t._loadQueue(e),t},_loadQueue:function(e){var n=this;if(n._queue.length>0){var o=n._queue[0];o.event===e&&(n._queue.shift(),n._loadQueue()),e||o.action()}return n},_ended:function(e){var o=this,t=e._sprite;if(!o._webAudio&&e._node&&!e._node.paused&&!e._node.ended&&e._node.currentTime=0;t--){if(o<=n)return;e._sounds[t]._ended&&(e._webAudio&&e._sounds[t]._node&&e._sounds[t]._node.disconnect(0),e._sounds.splice(t,1),o--)}}},_getSoundIds:function(e){var n=this;if(void 0===e){for(var o=[],t=0;t=0;if(n._scratchBuffer&&e.bufferSource&&(e.bufferSource.onended=null,e.bufferSource.disconnect(0),t))try{e.bufferSource.buffer=n._scratchBuffer}catch(e){}return e.bufferSource=null,o},_clearSound:function(e){/MSIE |Trident\//.test(n._navigator&&n._navigator.userAgent)||(e.src="data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA")}};var t=function(e){this._parent=e,this.init()};t.prototype={init:function(){var e=this,o=e._parent;return e._muted=o._muted,e._loop=o._loop,e._volume=o._volume,e._rate=o._rate,e._seek=0,e._paused=!0,e._ended=!0,e._sprite="__default",e._id=++n._counter,o._sounds.push(e),e.create(),e},create:function(){var e=this,o=e._parent,t=n._muted||e._muted||e._parent._muted?0:e._volume;return o._webAudio?(e._node=void 0===n.ctx.createGain?n.ctx.createGainNode():n.ctx.createGain(),e._node.gain.setValueAtTime(t,n.ctx.currentTime),e._node.paused=!0,e._node.connect(n.masterGain)):(e._node=n._obtainHtml5Audio(),e._errorFn=e._errorListener.bind(e),e._node.addEventListener("error",e._errorFn,!1),e._loadFn=e._loadListener.bind(e),e._node.addEventListener(n._canPlayEvent,e._loadFn,!1),e._node.src=o._src,e._node.preload="auto",e._node.volume=t*n.volume(),e._node.load()),e},reset:function(){var e=this,o=e._parent;return e._muted=o._muted,e._loop=o._loop,e._volume=o._volume,e._rate=o._rate,e._seek=0,e._rateSeek=0,e._paused=!0,e._ended=!0,e._sprite="__default",e._id=++n._counter,e},_errorListener:function(){var e=this;e._parent._emit("loaderror",e._id,e._node.error?e._node.error.code:0),e._node.removeEventListener("error",e._errorFn,!1)},_loadListener:function(){var e=this,o=e._parent;o._duration=Math.ceil(10*e._node.duration)/10,0===Object.keys(o._sprite).length&&(o._sprite={__default:[0,1e3*o._duration]}),"loaded"!==o._state&&(o._state="loaded",o._emit("load"),o._loadQueue()),e._node.removeEventListener(n._canPlayEvent,e._loadFn,!1)}};var r={},a=function(e){var n=e._src;if(r[n])return e._duration=r[n].duration,void d(e);if(/^data:[^;]+;base64,/.test(n)){for(var o=atob(n.split(",")[1]),t=new Uint8Array(o.length),a=0;a0?(r[o._src]=e,d(o,e)):t()};"undefined"!=typeof Promise&&1===n.ctx.decodeAudioData.length?n.ctx.decodeAudioData(e).then(a).catch(t):n.ctx.decodeAudioData(e,a,t)},d=function(e,n){n&&!e._duration&&(e._duration=n.duration),0===Object.keys(e._sprite).length&&(e._sprite={__default:[0,1e3*e._duration]}),"loaded"!==e._state&&(e._state="loaded",e._emit("load"),e._loadQueue())},_=function(){if(n.usingWebAudio){try{"undefined"!=typeof AudioContext?n.ctx=new AudioContext:"undefined"!=typeof webkitAudioContext?n.ctx=new webkitAudioContext:n.usingWebAudio=!1}catch(e){n.usingWebAudio=!1}n.ctx||(n.usingWebAudio=!1);var e=/iP(hone|od|ad)/.test(n._navigator&&n._navigator.platform),o=n._navigator&&n._navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/),t=o?parseInt(o[1],10):null;if(e&&t&&t<9){var r=/safari/.test(n._navigator&&n._navigator.userAgent.toLowerCase());(n._navigator&&n._navigator.standalone&&!r||n._navigator&&!n._navigator.standalone&&!r)&&(n.usingWebAudio=!1)}n.usingWebAudio&&(n.masterGain=void 0===n.ctx.createGain?n.ctx.createGainNode():n.ctx.createGain(),n.masterGain.gain.setValueAtTime(n._muted?0:1,n.ctx.currentTime),n.masterGain.connect(n.ctx.destination)),n._setup()}};"function"==typeof define&&define.amd&&define([],function(){return{Howler:n,Howl:o}}),"undefined"!=typeof exports&&(exports.Howler=n,exports.Howl=o),"undefined"!=typeof window?(window.HowlerGlobal=e,window.Howler=n,window.Howl=o,window.Sound=t):"undefined"!=typeof global&&(global.HowlerGlobal=e,global.Howler=n,global.Howl=o,global.Sound=t)}(); +/*! Spatial Plugin */ !function(){"use strict";HowlerGlobal.prototype._pos=[0,0,0],HowlerGlobal.prototype._orientation=[0,0,-1,0,1,0],HowlerGlobal.prototype.stereo=function(e){var n=this;if(!n.ctx||!n.ctx.listener)return n;for(var t=n._howls.length-1;t>=0;t--)n._howls[t].stereo(e);return n},HowlerGlobal.prototype.pos=function(e,n,t){var r=this;return r.ctx&&r.ctx.listener?(n="number"!=typeof n?r._pos[1]:n,t="number"!=typeof t?r._pos[2]:t,"number"!=typeof e?r._pos:(r._pos=[e,n,t],void 0!==r.ctx.listener.positionX?(r.ctx.listener.positionX.setTargetAtTime(r._pos[0],Howler.ctx.currentTime,.1),r.ctx.listener.positionY.setTargetAtTime(r._pos[1],Howler.ctx.currentTime,.1),r.ctx.listener.positionZ.setTargetAtTime(r._pos[2],Howler.ctx.currentTime,.1)):r.ctx.listener.setPosition(r._pos[0],r._pos[1],r._pos[2]),r)):r},HowlerGlobal.prototype.orientation=function(e,n,t,r,o,i){var a=this;if(!a.ctx||!a.ctx.listener)return a;var s=a._orientation;return n="number"!=typeof n?s[1]:n,t="number"!=typeof t?s[2]:t,r="number"!=typeof r?s[3]:r,o="number"!=typeof o?s[4]:o,i="number"!=typeof i?s[5]:i,"number"!=typeof e?s:(a._orientation=[e,n,t,r,o,i],void 0!==a.ctx.listener.forwardX?(a.ctx.listener.forwardX.setTargetAtTime(e,Howler.ctx.currentTime,.1),a.ctx.listener.forwardY.setTargetAtTime(n,Howler.ctx.currentTime,.1),a.ctx.listener.forwardZ.setTargetAtTime(t,Howler.ctx.currentTime,.1),a.ctx.listener.upX.setTargetAtTime(e,Howler.ctx.currentTime,.1),a.ctx.listener.upY.setTargetAtTime(n,Howler.ctx.currentTime,.1),a.ctx.listener.upZ.setTargetAtTime(t,Howler.ctx.currentTime,.1)):a.ctx.listener.setOrientation(e,n,t,r,o,i),a)},Howl.prototype.init=function(e){return function(n){var t=this;return t._orientation=n.orientation||[1,0,0],t._stereo=n.stereo||null,t._pos=n.pos||null,t._pannerAttr={coneInnerAngle:void 0!==n.coneInnerAngle?n.coneInnerAngle:360,coneOuterAngle:void 0!==n.coneOuterAngle?n.coneOuterAngle:360,coneOuterGain:void 0!==n.coneOuterGain?n.coneOuterGain:0,distanceModel:void 0!==n.distanceModel?n.distanceModel:"inverse",maxDistance:void 0!==n.maxDistance?n.maxDistance:1e4,panningModel:void 0!==n.panningModel?n.panningModel:"HRTF",refDistance:void 0!==n.refDistance?n.refDistance:1,rolloffFactor:void 0!==n.rolloffFactor?n.rolloffFactor:1},t._onstereo=n.onstereo?[{fn:n.onstereo}]:[],t._onpos=n.onpos?[{fn:n.onpos}]:[],t._onorientation=n.onorientation?[{fn:n.onorientation}]:[],e.call(this,n)}}(Howl.prototype.init),Howl.prototype.stereo=function(n,t){var r=this;if(!r._webAudio)return r;if("loaded"!==r._state)return r._queue.push({event:"stereo",action:function(){r.stereo(n,t)}}),r;var o=void 0===Howler.ctx.createStereoPanner?"spatial":"stereo";if(void 0===t){if("number"!=typeof n)return r._stereo;r._stereo=n,r._pos=[n,0,0]}for(var i=r._getSoundIds(t),a=0;a=0;t--)n._howls[t].stereo(e);return n},HowlerGlobal.prototype.pos=function(e,n,t){var r=this;return r.ctx&&r.ctx.listener?(n="number"!=typeof n?r._pos[1]:n,t="number"!=typeof t?r._pos[2]:t,"number"!=typeof e?r._pos:(r._pos=[e,n,t],void 0!==r.ctx.listener.positionX?(r.ctx.listener.positionX.setTargetAtTime(r._pos[0],Howler.ctx.currentTime,.1),r.ctx.listener.positionY.setTargetAtTime(r._pos[1],Howler.ctx.currentTime,.1),r.ctx.listener.positionZ.setTargetAtTime(r._pos[2],Howler.ctx.currentTime,.1)):r.ctx.listener.setPosition(r._pos[0],r._pos[1],r._pos[2]),r)):r},HowlerGlobal.prototype.orientation=function(e,n,t,r,o,i){var a=this;if(!a.ctx||!a.ctx.listener)return a;var s=a._orientation;return n="number"!=typeof n?s[1]:n,t="number"!=typeof t?s[2]:t,r="number"!=typeof r?s[3]:r,o="number"!=typeof o?s[4]:o,i="number"!=typeof i?s[5]:i,"number"!=typeof e?s:(a._orientation=[e,n,t,r,o,i],void 0!==a.ctx.listener.forwardX?(a.ctx.listener.forwardX.setTargetAtTime(e,Howler.ctx.currentTime,.1),a.ctx.listener.forwardY.setTargetAtTime(n,Howler.ctx.currentTime,.1),a.ctx.listener.forwardZ.setTargetAtTime(t,Howler.ctx.currentTime,.1),a.ctx.listener.upX.setTargetAtTime(e,Howler.ctx.currentTime,.1),a.ctx.listener.upY.setTargetAtTime(n,Howler.ctx.currentTime,.1),a.ctx.listener.upZ.setTargetAtTime(t,Howler.ctx.currentTime,.1)):a.ctx.listener.setOrientation(e,n,t,r,o,i),a)},Howl.prototype.init=function(e){return function(n){var t=this;return t._orientation=n.orientation||[1,0,0],t._stereo=n.stereo||null,t._pos=n.pos||null,t._pannerAttr={coneInnerAngle:void 0!==n.coneInnerAngle?n.coneInnerAngle:360,coneOuterAngle:void 0!==n.coneOuterAngle?n.coneOuterAngle:360,coneOuterGain:void 0!==n.coneOuterGain?n.coneOuterGain:0,distanceModel:void 0!==n.distanceModel?n.distanceModel:"inverse",maxDistance:void 0!==n.maxDistance?n.maxDistance:1e4,panningModel:void 0!==n.panningModel?n.panningModel:"HRTF",refDistance:void 0!==n.refDistance?n.refDistance:1,rolloffFactor:void 0!==n.rolloffFactor?n.rolloffFactor:1},t._onstereo=n.onstereo?[{fn:n.onstereo}]:[],t._onpos=n.onpos?[{fn:n.onpos}]:[],t._onorientation=n.onorientation?[{fn:n.onorientation}]:[],e.call(this,n)}}(Howl.prototype.init),Howl.prototype.stereo=function(n,t){var r=this;if(!r._webAudio)return r;if("loaded"!==r._state)return r._queue.push({event:"stereo",action:function(){r.stereo(n,t)}}),r;var o=void 0===Howler.ctx.createStereoPanner?"spatial":"stereo";if(void 0===t){if("number"!=typeof n)return r._stereo;r._stereo=n,r._pos=[n,0,0]}for(var i=r._getSoundIds(t),a=0;a