You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
161 lines
4.4 KiB
161 lines
4.4 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Studio</title>
|
|
<!-- Latest compiled and minified CSS -->
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="/css/cover.css"/>
|
|
</head>
|
|
<body>
|
|
<div class="site-wrapper">
|
|
<div class="site-wrapper-inner">
|
|
<div class="cover-container">
|
|
<div class="inner cover" style="height:900px;position:relative">
|
|
|
|
<div id="idBoothPanel" style="position:absolute;width:100%">
|
|
<div style="height:180px">
|
|
<div id="idViewTrigger">
|
|
<h1 class="cover-heading">Prends ta face !</h1>
|
|
</div>
|
|
<div id="idViewCountdown" style="font-size:15em; display:none"></div>
|
|
</div>
|
|
<div style="font-size:8em; height:600px; display:none">
|
|
Faites<br/>
|
|
<span style="font-size:2em">le chat</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="idPictPreview" style="position:absolute;display:none;width:100%">
|
|
<img src="/img/test.jpgautoOrient.jpg" height="900px">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mastfoot">
|
|
<div class="inner">
|
|
<p>BW Bros.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
<!-- Latest compiled and minified JQuery -->
|
|
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
|
|
<!-- Latest compiled and minified javaScript bootstrap-->
|
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
|
|
<!-- Getting the Socket.IO Client -->
|
|
<script src="https://cdn.socket.io/socket.io-1.3.4.js"></script>
|
|
</html>
|
|
|
|
<style type="text/css">
|
|
* {
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
</style>
|
|
|
|
<script type="text/javascript">
|
|
|
|
var socket = io('http://192.168.1.15:3000');
|
|
|
|
socket.on('connect', function() {
|
|
console.log("connect")
|
|
})
|
|
|
|
socket.on('boothClick', function(pData) {
|
|
BOB_runBooth();
|
|
});
|
|
|
|
BOB_var_context = {
|
|
boothOnGoing : false,
|
|
initTimer : 3,
|
|
onGoingTimer : 0,
|
|
boothId : null,
|
|
pictureId : 0
|
|
}
|
|
|
|
BOB_var_themes = [
|
|
"le chat",
|
|
"le cuir moustache",
|
|
"le roi",
|
|
"le bouffon",
|
|
"le moussailon",
|
|
"le geek",
|
|
"l'amoureux",
|
|
]
|
|
|
|
$(document).ready(function() {
|
|
$('#idBtnClick').click(function() {
|
|
BOB_runBooth();
|
|
})
|
|
})
|
|
|
|
function BOB_runBooth() {
|
|
|
|
if( BOB_var_context.boothOnGoing === false ) {
|
|
var currentDate = new Date();
|
|
BOB_var_context.boothOnGoing = true;
|
|
BOB_var_context.boothId = currentDate.getTime();
|
|
BOB_var_context.pictureId = 0;
|
|
BOB_var_context.onGoingTimer = BOB_var_context.initTimer;
|
|
$('#idViewTrigger').fadeOut(500, function() {
|
|
BOB_countdown();
|
|
});
|
|
}
|
|
|
|
}
|
|
|
|
function BOB_countdown() {
|
|
$('#idViewCountdown').fadeIn();
|
|
$('#idViewCountdown').html(BOB_var_context.onGoingTimer);
|
|
if( BOB_var_context.onGoingTimer > 0 ) {
|
|
setTimeout(function() {
|
|
BOB_var_context.onGoingTimer -= 1;
|
|
BOB_countdown();
|
|
}, 1000)
|
|
} else {
|
|
$('#idViewCountdown').html("Smile :-)");
|
|
BOB_takeThe1Pictures();
|
|
}
|
|
}
|
|
|
|
function BOB_displayPictPreview(pBoothId, pPictureId, pCallback) {
|
|
$('#idViewCountdown').html("");
|
|
$('#idPictPreview > img').attr('src', '/img/original/'+pBoothId+'/pict_'+pPictureId+'.jpg');
|
|
$('#idBoothPanel').fadeOut(50, function() {
|
|
$('#idPictPreview').show();
|
|
setTimeout(function() {
|
|
$('#idPictPreview').hide();
|
|
$('#idBoothPanel').fadeIn(50, function() {
|
|
pCallback()
|
|
})
|
|
}, 2000)
|
|
})
|
|
}
|
|
|
|
function BOB_takeThe1Pictures() {
|
|
$.get('/dslr/takepicture/'+BOB_var_context.boothId+'/'+BOB_var_context.pictureId, function(pResponse) {
|
|
console.log(pResponse);
|
|
|
|
BOB_displayPictPreview(BOB_var_context.boothId, BOB_var_context.pictureId, function() {
|
|
BOB_var_context.pictureId += 1;
|
|
if( BOB_var_context.pictureId < 4 ) {
|
|
BOB_var_context.onGoingTimer = BOB_var_context.initTimer;
|
|
BOB_countdown();
|
|
} else {
|
|
BOB_var_context.boothOnGoing = false;
|
|
$.get('/booth/build/'+BOB_var_context.boothId);
|
|
$('#idViewCountdown').fadeOut(500, function() {
|
|
$('#idViewTrigger').fadeIn();
|
|
});
|
|
}
|
|
})
|
|
})
|
|
}
|
|
|
|
|
|
</script>
|