Generates image content :
Select sound : jo audio format, for mix in the video :
Placement of audio files in the video:
get sound : abadie jo audio format, for header javascript :
1: 2: 3: 4: 5: 6: 7: 8: 9: 10: 11: 12: 13: 14: 15: 16:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>multidirectional-talk</title> <script> var persistanceretinienne = 15; var nbimg = null; var nbboucle = 70; var mua1 = 0;
var ouioui; var joueur = 'fleur'; var joueur1; var joueur2; var version = 1; var joueur3 = 'bisfleur'; var joueur4; var joueur5 = 'bis'; var joueur7; var joueur8; var arretimage5mn = 300000; var souvenirvitesse = 1000; var soud1 = [
]; var soud2 = [
]; var soud3 = [
]; var soud4 = [
]; var soud5 = [
]; var soud6 = [
]; var soud7 = [
]; var soud8 = [
]; var soud9 = [
]; var soud10 = [
]; var soud11 = [
]; var soud12 = [
]; var soud13 = [
]; var soud14 = [
]; var soud15 = [
]; var soud16 = [
]; function acelereLeVent(){ if(vitesseDuVent>123){ clearInterval(nbimg); vitesseDuVent = vitesseDuVent -40; nbboucle = 70; lancertout(); } } function diminuLeVent(){ clearInterval(nbimg); vitesseDuVent = vitesseDuVent + 300; nbboucle = 70; lancertout(); } function actionstop(){ clearInterval(nbimg); vitesseDuVent = arretimage5mn; nbboucle = 7; vitesseDuVent = vitesseDuVent +1; lancertout(); } function actionrestart(){ clearInterval(nbimg); vitesseDuVent = souvenirvitesse; nbboucle = 7; vitesseDuVent = vitesseDuVent +1; lancertout(); } function decoupe2(joueur4){//1 document.getElementById(joueur4).className = 'cachemoi'; }//3 function decoupe1(joueur2){//1 document.getElementById(joueur2).className = 'cachemoi'; }//3 function decoupe3(joueur1){//1 document.getElementById(joueur1).className = 'sortdutrou'; }//3 function restecalme(joueur1,joueur8,ouioui){//1 if(version == 1){//2 for (var placier = 1; placier < ouioui; placier++) {//3 joueur2 = joueur + placier; document.getElementById(joueur2).className = 'cachemoi'; }//3 for (var placier = ouioui+1; placier < 17; placier++) {//3 joueur2 = joueur + placier; document.getElementById(joueur2).className = 'cachemoi'; }//3 for (var placier = 1; placier < ouioui; placier++) {//3 joueur4 = joueur3 + placier; document.getElementById(joueur4).className = 'cachemoi'; }//3 for (var placier = ouioui+1; placier < 17; placier++) {//3 joueur4 = joueur3 + placier; document.getElementById(joueur4).className = 'cachemoi'; }//3 document.getElementById(joueur1).className = 'sortdutrou'; document.getElementById(joueur8).className = 'cachemoi'; }//2 if(version == 2){//2 for (var placier = 1; placier < ouioui; placier++) {//3 joueur4 = joueur3 + placier; document.getElementById(joueur4).className = 'cachemoi'; }//3 for (var placier = ouioui+1; placier < 17; placier++) {//3 joueur4 = joueur3 + placier; document.getElementById(joueur4).className = 'cachemoi'; }//3 for (var placier = 1; placier < ouioui; placier++) {//3 joueur2 = joueur + placier; document.getElementById(joueur2).className = 'cachemoi'; }//3 for (var placier = ouioui+1; placier < 17; placier++) {//3 joueur2 = joueur + placier; document.getElementById(joueur2).className = 'cachemoi'; }//3 document.getElementById(joueur8).className = 'sortdutrou'; document.getElementById(joueur1).className = 'cachemoi'; } } function change(persistanceretinienne) { switch (persistanceretinienne) { case 0: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 1: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 2: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 3: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 4: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 5: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 6: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 7: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 8: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 9: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 10: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 11: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 12: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 13: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 14: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; case 15: ouioui = persistanceretinienne + 1; joueur1 = joueur + ouioui; joueur8 = joueur3 + ouioui; restecalme(joueur1,joueur8,ouioui);
break; } } function durermax() { clearInterval(nbimg); /* lancerChange4(); */ } function seance() { change(persistanceretinienne); persistanceretinienne--; if ((nbboucle>1)&&(persistanceretinienne<0)) { /* selection du nombre d'image*/ /* persistanceretinienne = 3;*/ persistanceretinienne = 15; nbboucle = nbboucle-1; } } function lancertout() { nbimg = setInterval(seance, vitesseDuVent); setTimeout(durermax, persistanceretinienne * 81000); change(persistanceretinienne); } function lancertout1() { lecjo(soud1); lecjo(soud2); lecjo(soud3); lecjo(soud4); lecjo(soud5); lecjo(soud6); lecjo(soud7); lecjo(soud8); lecjo(soud9); lecjo(soud10); lecjo(soud11); lecjo(soud12); lecjo(soud13); lecjo(soud14); lecjo(soud15); lecjo(soud16); lancertout(); } function JoueLeSon(mua1){ if(mua1==0){ var multia1 = document.getElementById("1awav"); multia1.play(); } else if(mua1==1){ var multia2 = document.getElementById("2awav"); multia2.play(); } else if(mua1==2){ var multia3 = document.getElementById("3awav"); multia3.play(); } else if(mua1==3){ var multia4 = document.getElementById("4awav"); multia4.play(); } } function JoueLeSon1(){ var multib1 = document.getElementById("1awav"); multib1.play(); } function JoueLeSon2(){ var multic1 = document.getElementById("2awav"); multic1.play(); } function JoueLeSon3(){ var multid1 = document.getElementById("3awav"); multid1.play(); } function JoueLeSon4(){ var multie1 = document.getElementById("4awav"); multie1.play(); } function JoueLeSon5(){ var multif1 = document.getElementById("5awav"); multif1.play(); } function JoueLeSon6(){ var multig1 = document.getElementById("6awav"); multig1.play(); } function JoueLeSon7(){ var multih1 = document.getElementById("7awav"); multih1.play(); } function JoueLeSon8(){ var multii1 = document.getElementById("8awav"); multii1.play(); } function JoueLeSon9(){ var multij1 = document.getElementById("9awav"); multij1.play(); } function JoueLeSon10(){ var multik1 = document.getElementById("10awav"); multik1.play(); } function JoueLeSon11(){ var multil1 = document.getElementById("11awav"); multil1.play(); } function JoueLeSon12(){ var multic1 = document.getElementById("12awav"); multic1.play(); } function JoueLeSon13(){ var multim1 = document.getElementById("13awav"); multim1.play(); } function JoueLeSon14(){ var multin1 = document.getElementById("14awav"); multin1.play(); } function JoueLeSon15(){ var multio1 = document.getElementById("15awav"); multio1.play(); } function JoueLeSon16(){ var multip1 = document.getElementById("16awav"); multip1.play(); } function action1Press(){ version = version + 1; if(version>2){ version = 1; } } function actionx1Press(){ persistanceretinienne = 15; } function actionx2Press(){ persistanceretinienne = 14; } function actionx3Press(){ persistanceretinienne = 13; } function actionx4Press(){ persistanceretinienne = 12; } function actionx5Press(){ persistanceretinienne = 11; } function actionx6Press(){ persistanceretinienne = 10; } function actionx7Press(){ persistanceretinienne = 9; } function actionx8Press(){ persistanceretinienne = 8; } function actionx9Press(){ persistanceretinienne = 7; } function actionx10Press(){ persistanceretinienne = 6; } function actionx11Press(){ persistanceretinienne = 5; } function actionx12Press(){ persistanceretinienne = 4; } function actionx13Press(){ persistanceretinienne = 3; } function actionx14Press(){ persistanceretinienne = 2; } function actionx15Press(){ persistanceretinienne = 1; } function actionx16Press(){ persistanceretinienne = 0; } /**passerelle firefox 48 pour remplacer le bouton d'appel java**/ function load() { lancertout1(); } document.addEventListener("DOMContentLoaded", function(event) { load(); }); /**fin passerelle firefox 48**/ </script> <style> .indique{ cursor:pointer; } .cachemoi { display: none; } .sortdutrou { display: inline; } .action{ position:fixed; height:4%; width:1.4%; margin-top:1%; background:blue; border-right:1px solid #BBB; cursor:pointer; } .action5mn{ position:fixed; height:4%; width:1.4%; margin-top:1%; background:red; border-right:1px solid #BBB; cursor:pointer; } .actionvitesse{ position:fixed; height:4%; width:1.4%; margin-top:1%; background:green; border-right:1px solid #BBB; cursor:pointer; } .actionunivers{ position:fixed; height:4%; width:1.4%; margin-top:1%; background:black; border-right:1px solid #BBB; cursor:pointer; } .actionunivers{ position:fixed; height:4%; width:1.4%; margin-top:2%; border-right:1px solid #BBB; cursor:pointer; }
</style> </head> <body"> <div id='basewave1'> </div> <div id='basewave2'> </div> <div id='basewave3'> </div> <div id='basewave4'> </div> <div id='basewave5'> </div> <div id='basewave6'> </div> <div id='basewave7'> </div> <div id='basewave8'> </div> <div id='basewave9'> </div> <div id='basewave10'> </div> <div id='basewave11'> </div> <div id='basewave12'> </div> <div id='basewave13'> </div> <div id='basewave14'> </div> <div id='basewave15'> </div> <div id='basewave16'> </div> <div id="fleur1" class="cachemoi" >
</div> <!--bis--> <div id="bisfleur1" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur2" class="cachemoi" >
</div> <!--bis--> <div id="bisfleur2" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur3" class="cachemoi">
</div> <!--bis--> <div id="bisfleur3" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur4" class="cachemoi">
</div> <!--bis--> <div id="bisfleur4" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur5" class="cachemoi">
</div> <!--bis--> <div id="bisfleur5" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur6" class="cachemoi" >
</div> <!--bis--> <div id="bisfleur6" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur7" class="cachemoi">
</div> <!--bis--> <div id="bisfleur7" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur8" class="cachemoi">
</div> <!--bis--> <div id="bisfleur8" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur9" class="cachemoi" >
</div> <!--bis--> <div id="bisfleur9" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur10" class="cachemoi" >
</div> <!--bis--> <div id="bisfleur10" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur11" class="cachemoi">
</div> <!--bis--> <div id="bisfleur11" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur12" class="cachemoi">
</div> <!--bis--> <div id="bisfleur12" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur13" class="cachemoi">
</div> <!--bis--> <div id="bisfleur13" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur14" class="cachemoi" >
</div> <!--bis--> <div id="bisfleur14" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur15" class="cachemoi">
</div> <!--bis--> <div id="bisfleur15" class="cachemoi" >
</div> <!--fin bis--> <div id="fleur16" class="cachemoi">
</div> <!--bis--> <div id="bisfleur16" class="cachemoi" >
</div> <!--fin bis--> <!-- bare de temps --> <div class="action" onMouseDown="actionx1Press();" style="margin-left:1%;"></div> <div class="action" onMouseDown="actionx2Press();" style="margin-left:3%;"></div> <div class="action" onMouseDown="actionx3Press();" style="margin-left:5%;"></div> <div class="action" onMouseDown="actionx4Press();" style="margin-left:7%;"></div> <div class="action" onMouseDown="actionx5Press();" style="margin-left:9%;"></div> <div class="action" onMouseDown="actionx6Press();" style="margin-left:11%;"></div> <div class="action" onMouseDown="actionx7Press();" style="margin-left:13%;"></div> <div class="action" onMouseDown="actionx8Press();" style="margin-left:15%;"></div> <div class="action" onMouseDown="actionx9Press();" style="margin-left:17%;"></div> <div class="action" onMouseDown="actionx10Press();" style="margin-left:19%;"></div> <div class="action" onMouseDown="actionx11Press();" style="margin-left:21%;"></div> <div class="action" onMouseDown="actionx12Press();" style="margin-left:23%;"></div> <div class="action" onMouseDown="actionx13Press();" style="margin-left:25%;"></div> <div class="action" onMouseDown="actionx14Press();" style="margin-left:27%;"></div> <div class="action" onMouseDown="actionx15Press();" style="margin-left:29%;"></div> <div class="action" onMouseDown="actionx16Press();" style="margin-left:31%;"></div> <div class="action5mn" onMouseDown="actionstop();" style="margin-left:61%;"></div> <div class="action5mn" onMouseDown="actionrestart();" style="margin-left:63%;"></div> <div class="actionvitesse" onMouseDown="diminuLeVent();" style="margin-left:67%;">-</div> <div class="actionvitesse" onMouseDown="acelereLeVent();" style="margin-left:69%;">+</div> <div class="actionunivers" onMouseDown="action1Press();" style="margin-left:75%;"></div> <div class="actiontexte" style="margin-left:15%;"><p>time line</p></div> <div class="actiontexte" style="margin-left:61%;"><p>pause</p></div> <div class="actiontexte" style="margin-left:67%;"><p>speed</p></div> <div class="actiontexte" style="margin-left:75%;"><p>multidirectional talk</p></div> <script type="text/javascript" src="jom.js"></script> </body> </html>