Commit 57664629 authored by onny's avatar onny

added audio sprite

parent d46e2e0f
Pipeline #48 canceled with stages
......@@ -33,6 +33,32 @@
</style>
<script src="static/js/howler.min-2.1.3.js"></script>
<script>
switchAudioState = function (clapsPerSecond) {
if (clapsPerSecond < 4) {
level = 0;
} else if (clapsPerSecond >= 4) {
level = 1;
} else if (clapsPerSecond >= 10) {
level = 2;
} else if (clapsPerSecond >= 15) {
level = 3;
} else if (clapsPerSecond >= 20) {
level = 4;
} else if (clapsPerSecond >= 25) {
level = 5;
};
if (level = 0) {
if( claps.playing() ){
claps.fade(1, 0, 1000);
}
};
console.log(level);
};
document.addEventListener("DOMContentLoaded", function() {
var ws = new WebSocket("ws://192.168.178.184:8080/websocket");
......@@ -42,66 +68,27 @@
clapsPerSecond = evt.data.size;
var status_field = document.getElementsByClassName('status')[0];
status_field.textContent = "Right now: "+clapsPerSecond+" claps/sec";
if (! clapSound.playing()) {
if (clapsPerSecond >= 2) {
clapSound01.play();
};
if (clapsPerSecond >= 6) {
clapSound02.play();
};
if (clapsPerSecond >= 16) {
clapSound03.play();
};
if (clapsPerSecond >= 25) {
clapSound04.play();
};
if (clapsPerSecond >= 35) {
clapSound05.play();
};
};
switchAudioState(clapsPerSecond);
};
};
window.onclick = function(event) {
if (event.target.closest('.clap')) {
ws.send("clap");
claps.play('clap01');
};
};
clapSound01 = new Howl({
src: "static/sounds/clap01.opus",
html5: true,
volume: 0,
loop: true,
autoplay: true
});
clapSound02 = new Howl({
src: "static/sounds/clap02.opus",
html5: true,
volume: 0,
loop: true,
autoplay: true
});
clapSound03 = new Howl({
src: "static/sounds/clap03.opus",
html5: true,
volume: 0,
loop: true,
autoplay: true
});
clapSound04 = new Howl({
src: "static/sounds/clap04.opus",
html5: true,
volume: 0,
loop: true,
autoplay: true
});
clapSound05 = new Howl({
src: "static/sounds/clap05.opus",
html5: true,
volume: 0,
loop: true,
autoplay: true
claps = new Howl({
src: "static/sounds/claps.opus",
sprite: {
clap01: [0, 2363.6734693877552],
clap02: [4000, 7784.4444444444445],
clap03: [9000, 16749.20634920635],
clap04: [18000, 21607.05215419501],
clap05: [23000, 30209.637188208617]
},
volume: 0
});
});
......
......@@ -5,6 +5,11 @@ import time
from threading import Thread
from datetime import datetime
import gevent
from geventwebsocket import WebSocketError
from geventwebsocket.handler import WebSocketHandler
import werkzeug.serving
app = bottle.Bottle()
claps = 0
......@@ -55,9 +60,10 @@ def handle_websocket():
def index():
return bottle.template('index.tpl')
from gevent.pywsgi import WSGIServer
from geventwebsocket import WebSocketError
from geventwebsocket.handler import WebSocketHandler
server = WSGIServer(("0.0.0.0", 8080), app,
handler_class=WebSocketHandler)
server.serve_forever()
@werkzeug.serving.run_with_reloader
def runServer():
app.debug = True
ws = gevent.pywsgi.WSGIServer(("0.0.0.0", 8080), app,
handler_class=WebSocketHandler)
ws.serve_forever()
{
"resources": [
"claps.ogg",
"claps.m4a",
"claps.mp3",
"claps.ac3"
],
"spritemap": {
"clap01": {
"start": 0,
"end": 2.3636734693877552,
"loop": false
},
"clap02": {
"start": 4,
"end": 7.7844444444444445,
"loop": false
},
"clap03": {
"start": 9,
"end": 16.74920634920635,
"loop": false
},
"clap04": {
"start": 18,
"end": 21.60705215419501,
"loop": false
},
"clap05": {
"start": 23,
"end": 30.209637188208617,
"loop": false
}
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment