mirror of https://github.com/sundowndev/Detank.git
update js
sundowndev
parent
cf6161317a
commit
9a0df65f8f
|
|
@ -0,0 +1,197 @@
|
|||
/*
|
||||
* nano.js * Audio Player library
|
||||
* by SundownDEV
|
||||
* version 1.0.0
|
||||
*/
|
||||
|
||||
function nanoPlayer(player, options) {
|
||||
this.player = document.querySelector(player);
|
||||
this.options = options;
|
||||
|
||||
/* Adding additional params */
|
||||
if(this.options.DefaultSong !== 'undefined'){
|
||||
this.options.index = this.options.DefaultSong;
|
||||
}else{
|
||||
this.options.index = 0;
|
||||
}
|
||||
|
||||
this.options.current_timeline = '00:00';
|
||||
this.options.timeline = '00:00';
|
||||
this.options.playing = false;
|
||||
|
||||
/* Init the player */
|
||||
var audioTag = document.createElement('audio');
|
||||
this.player.appendChild(audioTag);
|
||||
audioTag.preload = 'auto';
|
||||
|
||||
var mainDiv = document.createElement('div');
|
||||
mainDiv.classList.add('mainDiv');
|
||||
this.player.appendChild(mainDiv);
|
||||
|
||||
/* Play button */
|
||||
var pButton = document.createElement('button');
|
||||
pButton.classList.add('pButton');
|
||||
mainDiv.appendChild(pButton);
|
||||
pButton.innerHTML = 'play';
|
||||
|
||||
/* Timeline element */
|
||||
var timeline = document.createElement('div');
|
||||
timeline.classList.add('timeline');
|
||||
mainDiv.appendChild(timeline);
|
||||
|
||||
var progress = document.createElement('div');
|
||||
progress.classList.add('progress');
|
||||
timeline.appendChild(progress);
|
||||
|
||||
var loaded = document.createElement('div');
|
||||
loaded.classList.add('loaded');
|
||||
timeline.appendChild(loaded);
|
||||
|
||||
/* Song duration element */
|
||||
var timer = document.createElement('div');
|
||||
timer.classList.add('timer');
|
||||
mainDiv.appendChild(timer);
|
||||
|
||||
/* Volume control element */
|
||||
var volumeControl = document.createElement('div');
|
||||
volumeControl.classList.add('volumeControl');
|
||||
this.player.appendChild(volumeControl);
|
||||
|
||||
/* functions */
|
||||
this.setSong = function(id){
|
||||
this.options.index = id;
|
||||
audio.src = this.options.songList[id].path;
|
||||
audio.load();
|
||||
}
|
||||
|
||||
this.play = function(){
|
||||
audio.play();
|
||||
pButton.innerHTML = 'pause';
|
||||
}
|
||||
|
||||
this.pause = function(){
|
||||
audio.pause();
|
||||
pButton.innerHTML = 'play';
|
||||
}
|
||||
|
||||
this.stop = function(){
|
||||
audio.pause();
|
||||
audio.currentTime = 0;
|
||||
pButton.innerHTML = 'play';
|
||||
options.playing = false;
|
||||
}
|
||||
|
||||
this.prev = function(){
|
||||
if(options.songList.indexOf(options.songList[options.index]) != 0){
|
||||
options.index -= 1;
|
||||
this.setSong(options.index);
|
||||
this.stop();
|
||||
|
||||
if(options.playing === true){
|
||||
this.play();
|
||||
}else{
|
||||
this.stop();
|
||||
}
|
||||
}else if(options.playing === false){
|
||||
this.stop();
|
||||
}
|
||||
}
|
||||
|
||||
this.next = function(){
|
||||
if(options.songList.indexOf(options.songList[options.index]) != options.songList.length - 1){
|
||||
options.index += 1;
|
||||
this.setSong(options.index);
|
||||
this.pause();
|
||||
|
||||
if(options.playing === true){
|
||||
this.play();
|
||||
}else{
|
||||
this.pause();
|
||||
}
|
||||
}else{
|
||||
this.stop();
|
||||
}
|
||||
}
|
||||
|
||||
this.setVolume = function(vol){
|
||||
audio.volume = vol * 0.01; // round 100 to 1
|
||||
}
|
||||
|
||||
var getCurrentTimerPourcentage = function(){
|
||||
//audio.currentTime/audio.duration
|
||||
//timeline.style.width = '40%';
|
||||
}
|
||||
|
||||
var getCurrentTimerSec = function(){
|
||||
//audio.currentTime/audio.duration
|
||||
|
||||
timeline.style.width = '40%';
|
||||
}
|
||||
|
||||
var setDuration = function(duration){
|
||||
var minutes = "0" + Math.floor(duration / 60);
|
||||
var seconds = "0" + (Math.floor(duration) - minutes * 60);
|
||||
options.timeline = minutes.substr(-2) + ":" + seconds.substr(-2);
|
||||
}
|
||||
|
||||
this.setCurrentTimer = function(currentTime){
|
||||
var minutes = "0" + Math.floor(currentTime / 60);
|
||||
var seconds = "0" + (Math.floor(currentTime) - minutes * 60);
|
||||
this.options.current_timeline = minutes.substr(-2) + ":" + seconds.substr(-2);
|
||||
}
|
||||
|
||||
this.refreshTimer = function(){
|
||||
this.setCurrentTimer(audio.currentTime);
|
||||
|
||||
timer.innerHTML = '<span class="played">'+this.options.current_timeline+'</span> / <strong class="duration">'+this.options.timeline+'</strong>';
|
||||
}
|
||||
|
||||
/* Create the audio object */
|
||||
var audio = new Audio();
|
||||
|
||||
this.setSong(this.options.index);
|
||||
this.setVolume(this.options.defaultVolume);
|
||||
|
||||
audio.addEventListener('canplay', function() {
|
||||
setDuration(audio.duration);
|
||||
nanoPlayer.refreshTimer();
|
||||
});
|
||||
|
||||
/* Using params */
|
||||
if(this.options.autoplay === true){
|
||||
this.play();
|
||||
}
|
||||
|
||||
/* triggering elements */
|
||||
pButton.addEventListener('click', function(){
|
||||
if(options.playing === false){
|
||||
nanoPlayer.play();
|
||||
options.playing = true;
|
||||
}else{
|
||||
nanoPlayer.pause();
|
||||
options.playing = false;
|
||||
}
|
||||
});
|
||||
|
||||
timeline.addEventListener('click', function(){
|
||||
//mettre à jour progress bar en fonction du clic
|
||||
//maj le timer
|
||||
//console.log('test1');
|
||||
});
|
||||
|
||||
audio.addEventListener("playing", function(){
|
||||
nanoPlayer.options.playing = true;
|
||||
});
|
||||
|
||||
audio.addEventListener("timeupdate", function(){
|
||||
nanoPlayer.refreshTimer();
|
||||
});
|
||||
|
||||
audio.addEventListener("ended", function(){
|
||||
if(options.loop === true && options.songList.indexOf(options.songList[options.index]) == options.songList.length - 1){
|
||||
nanoPlayer.play();
|
||||
}else{
|
||||
nanoPlayer.next();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -1,250 +1,281 @@
|
|||
var player = document.querySelector('#player');
|
||||
function run (difficulty) {
|
||||
var player = document.querySelector('#player');
|
||||
|
||||
var maxX = document.querySelectorAll('.line-1 .col').length;
|
||||
var maxY = document.querySelectorAll('.line').length;
|
||||
var maxX = document.querySelectorAll('.line-1 .col').length;
|
||||
var maxY = document.querySelectorAll('.line').length;
|
||||
|
||||
var score = document.querySelectorAll('.textScore');
|
||||
var score = document.querySelectorAll('.textScore');
|
||||
|
||||
score.forEach(function(e){
|
||||
e.textContent = 0;
|
||||
});
|
||||
var gameover = document.querySelector('.gameover');
|
||||
gameover.style.display = 'none';
|
||||
|
||||
var x = 1;
|
||||
var y = 5;
|
||||
var cibleValue = 0;
|
||||
var playing = true;
|
||||
var cibles = document.querySelectorAll('.cible');
|
||||
|
||||
var controls = {
|
||||
up: 'z',
|
||||
down: 's',
|
||||
left: 'q',
|
||||
right: 'd'
|
||||
}
|
||||
|
||||
var rotation = {
|
||||
up: '0px -50px',
|
||||
down: '-50px -50px',
|
||||
left: '-50px 0px',
|
||||
right: '0px 0px'
|
||||
}
|
||||
|
||||
var direction = rotation.right;
|
||||
|
||||
var bulletX = 0;
|
||||
var bulletY = 0;
|
||||
var bulletDir = direction;
|
||||
|
||||
function set_score (){
|
||||
score.forEach(function(e){
|
||||
e.textContent = 0;
|
||||
});
|
||||
}
|
||||
|
||||
function setPosition (posX, posY, dir) {
|
||||
gridX = x;
|
||||
gridY = y;
|
||||
|
||||
var grid = document.querySelector('.line-'+posY+' .col-'+posX);
|
||||
|
||||
if(grid.classList.contains('cible')){
|
||||
return;
|
||||
if(cibles){
|
||||
cibles.forEach(function(e){
|
||||
e.classList.remove('cible');
|
||||
});
|
||||
}
|
||||
|
||||
var grids = document.querySelectorAll('.col');
|
||||
|
||||
grids.forEach(function(e){
|
||||
e.style.background = '';
|
||||
e.style.backgroundPosition = '';
|
||||
score.forEach(function(e){
|
||||
e.textContent = 0;
|
||||
});
|
||||
|
||||
direction = dir;
|
||||
var x = 1;
|
||||
var y = 5;
|
||||
var cibleValue = 0;
|
||||
var playing = true;
|
||||
|
||||
grid.style.background = 'url(./assets/img/tank_bg.png) no-repeat';
|
||||
grid.style.backgroundPosition = direction;
|
||||
|
||||
x = posX;
|
||||
y = posY;
|
||||
}
|
||||
|
||||
function getPosition () {
|
||||
return [x, y];
|
||||
}
|
||||
|
||||
function tirer () {
|
||||
var posX = x;
|
||||
var posY = y;
|
||||
|
||||
switch(direction){
|
||||
case rotation.up:
|
||||
posY--;
|
||||
break
|
||||
case rotation.down:
|
||||
posY++;
|
||||
break
|
||||
case rotation.left:
|
||||
posX--;
|
||||
break
|
||||
case rotation.right:
|
||||
posX++;
|
||||
break
|
||||
var controls = {
|
||||
up: 'z',
|
||||
down: 's',
|
||||
left: 'q',
|
||||
right: 'd'
|
||||
}
|
||||
|
||||
if(posX < 1 || posX > maxX || posY < 1 || posY > maxY){
|
||||
return;
|
||||
var rotation = {
|
||||
up: '0px -50px',
|
||||
down: '-50px -50px',
|
||||
left: '-50px 0px',
|
||||
right: '0px 0px'
|
||||
}
|
||||
|
||||
bulletX = posX;
|
||||
bulletY = posY;
|
||||
bulletDir = direction;
|
||||
var direction = rotation.right;
|
||||
|
||||
var grid = document.querySelector('.line-'+posY+' .col-'+posX);
|
||||
var bulletX = 0;
|
||||
var bulletY = 0;
|
||||
var bulletDir = direction;
|
||||
|
||||
grid.style.background = 'url(./assets/img/bg_bullet.png) no-repeat';
|
||||
grid.style.backgroundPosition = bulletDir;
|
||||
}
|
||||
|
||||
function move(event) {
|
||||
var k = event.key;
|
||||
|
||||
if(playing == true){
|
||||
if(k == controls.up && y > 1){
|
||||
var newY = y-1;
|
||||
setPosition(x, newY, rotation.up);
|
||||
} else if (k == controls.down && y < maxY){
|
||||
var newY = y+1;
|
||||
setPosition(x, newY, rotation.down);
|
||||
} else if (k == controls.left && x > 1){
|
||||
var newX = x-1;
|
||||
setPosition(newX, y, rotation.left);
|
||||
} else if (k == controls.right && x < maxX){
|
||||
var newX = x+1;
|
||||
setPosition(newX, y, rotation.right);
|
||||
} else if (event.keyCode == 32){
|
||||
event.preventDefault();
|
||||
tirer();
|
||||
}
|
||||
}else{
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
setInterval(function(){
|
||||
console.log('test');
|
||||
if(bulletX == 0 || bulletY == 0){
|
||||
return;
|
||||
if(difficulty == 'easy'){
|
||||
difficulty = 2000;
|
||||
}else if(difficulty == 'hard'){
|
||||
difficulty = 1400;
|
||||
}
|
||||
|
||||
var newY = bulletY;
|
||||
var newX = bulletX;
|
||||
|
||||
var bulletDestination = document.querySelector('.line-'+newY+' .col-'+newX);
|
||||
|
||||
if(bulletDestination.classList.contains('cible')){
|
||||
bulletDestination.classList.remove('cible');
|
||||
cibleValue = cibleValue - 1;
|
||||
function set_score (){
|
||||
score.forEach(function(e){
|
||||
e.textContent = Number(e.textContent)+100;
|
||||
e.textContent = 0;
|
||||
});
|
||||
}
|
||||
|
||||
function setPosition (posX, posY, dir) {
|
||||
gridX = x;
|
||||
gridY = y;
|
||||
|
||||
var grid = document.querySelector('.line-'+posY+' .col-'+posX);
|
||||
|
||||
if(grid.classList.contains('cible')){
|
||||
return;
|
||||
}
|
||||
|
||||
var grids = document.querySelectorAll('.col');
|
||||
|
||||
grids.forEach(function(e){
|
||||
e.style.background = '';
|
||||
e.style.backgroundPosition = '';
|
||||
});
|
||||
bulletDestination.classList.add('cible-touchee');
|
||||
bulletX = 0;
|
||||
bulletY = 0;
|
||||
setTimeout(function(){
|
||||
bulletDestination.classList.remove('cible-touchee');
|
||||
bulletDestination.style.background = '';
|
||||
bulletDestination.style.backgroundPosition = '';
|
||||
}, 1000);
|
||||
return;
|
||||
|
||||
direction = dir;
|
||||
|
||||
grid.style.background = 'url(./assets/img/tank_bg.png) no-repeat';
|
||||
grid.style.backgroundPosition = direction;
|
||||
|
||||
x = posX;
|
||||
y = posY;
|
||||
}
|
||||
|
||||
switch(bulletDir){
|
||||
case rotation.up:
|
||||
newY--;
|
||||
break;
|
||||
case rotation.down:
|
||||
newY++;
|
||||
break;
|
||||
case rotation.left:
|
||||
newX--;
|
||||
break;
|
||||
case rotation.right:
|
||||
newX++;
|
||||
break;
|
||||
function getPosition () {
|
||||
return [x, y];
|
||||
}
|
||||
|
||||
function tirer () {
|
||||
var posX = x;
|
||||
var posY = y;
|
||||
|
||||
switch(direction){
|
||||
case rotation.up:
|
||||
posY--;
|
||||
break
|
||||
case rotation.down:
|
||||
posY++;
|
||||
break
|
||||
case rotation.left:
|
||||
posX--;
|
||||
break
|
||||
case rotation.right:
|
||||
posX++;
|
||||
break
|
||||
}
|
||||
|
||||
if(posX < 1 || posX > maxX || posY < 1 || posY > maxY){
|
||||
return;
|
||||
}
|
||||
|
||||
bulletX = posX;
|
||||
bulletY = posY;
|
||||
bulletDir = direction;
|
||||
|
||||
var grid = document.querySelector('.line-'+posY+' .col-'+posX);
|
||||
|
||||
grid.style.background = 'url(./assets/img/bg_bullet.png) no-repeat';
|
||||
grid.style.backgroundPosition = bulletDir;
|
||||
}
|
||||
|
||||
function move(event) {
|
||||
var k = event.key;
|
||||
|
||||
if(playing == true){
|
||||
if(k == controls.up && y > 1){
|
||||
var newY = y-1;
|
||||
setPosition(x, newY, rotation.up);
|
||||
} else if (k == controls.down && y < maxY){
|
||||
var newY = y+1;
|
||||
setPosition(x, newY, rotation.down);
|
||||
} else if (k == controls.left && x > 1){
|
||||
var newX = x-1;
|
||||
setPosition(newX, y, rotation.left);
|
||||
} else if (k == controls.right && x < maxX){
|
||||
var newX = x+1;
|
||||
setPosition(newX, y, rotation.right);
|
||||
} else if (event.keyCode == 32){
|
||||
event.preventDefault();
|
||||
tirer();
|
||||
}
|
||||
}else{
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
setInterval(function(){
|
||||
console.log('test');
|
||||
if(bulletX == 0 || bulletY == 0){
|
||||
return;
|
||||
}
|
||||
|
||||
var newY = bulletY;
|
||||
var newX = bulletX;
|
||||
|
||||
var bulletDestination = document.querySelector('.line-'+newY+' .col-'+newX);
|
||||
|
||||
if(bulletDestination.classList.contains('cible')){
|
||||
bulletDestination.classList.remove('cible');
|
||||
cibleValue = cibleValue - 1;
|
||||
score.forEach(function(e){
|
||||
e.textContent = Number(e.textContent)+100;
|
||||
});
|
||||
bulletDestination.classList.add('cible-touchee');
|
||||
bulletX = 0;
|
||||
bulletY = 0;
|
||||
setTimeout(function(){
|
||||
bulletDestination.classList.remove('cible-touchee');
|
||||
bulletDestination.style.background = '';
|
||||
bulletDestination.style.backgroundPosition = '';
|
||||
}, 1000);
|
||||
return;
|
||||
}
|
||||
|
||||
switch(bulletDir){
|
||||
case rotation.up:
|
||||
newY--;
|
||||
break;
|
||||
case rotation.down:
|
||||
newY++;
|
||||
break;
|
||||
case rotation.left:
|
||||
newX--;
|
||||
break;
|
||||
case rotation.right:
|
||||
newX++;
|
||||
break;
|
||||
}
|
||||
|
||||
|
||||
if(newY < 1 || newY > maxY || newX < 1 || newX > maxX){
|
||||
var grid = document.querySelector('.line-'+bulletY+' .col-'+bulletX);
|
||||
|
||||
grid.style.background = '';
|
||||
grid.style.backgroundPosition = '';
|
||||
return;
|
||||
}
|
||||
|
||||
if(newY < 1 || newY > maxY || newX < 1 || newX > maxX){
|
||||
var grid = document.querySelector('.line-'+bulletY+' .col-'+bulletX);
|
||||
|
||||
grid.style.background = '';
|
||||
grid.style.backgroundPosition = '';
|
||||
return;
|
||||
}
|
||||
|
||||
var grid = document.querySelector('.line-'+bulletY+' .col-'+bulletX);
|
||||
var bulletDestination = document.querySelector('.line-'+newY+' .col-'+newX);
|
||||
|
||||
grid.style.background = '';
|
||||
grid.style.backgroundPosition = '';
|
||||
if(bulletDestination.classList.contains('cible')){
|
||||
bulletDestination.classList.remove('cible');
|
||||
cibleValue = cibleValue - 1;
|
||||
score.forEach(function(e){
|
||||
e.textContent = Number(e.textContent)+100;
|
||||
});
|
||||
bulletDestination.classList.add('cible-touchee');
|
||||
bulletX = 0;
|
||||
bulletY = 0;
|
||||
setTimeout(function(){
|
||||
bulletDestination.classList.remove('cible-touchee');
|
||||
}, 1000);
|
||||
return;
|
||||
}
|
||||
|
||||
var bulletDestination = document.querySelector('.line-'+newY+' .col-'+newX);
|
||||
bulletX = newX;
|
||||
bulletY = newY;
|
||||
|
||||
if(bulletDestination.classList.contains('cible')){
|
||||
bulletDestination.classList.remove('cible');
|
||||
cibleValue = cibleValue - 1;
|
||||
score.forEach(function(e){
|
||||
e.textContent = Number(e.textContent)+100;
|
||||
});
|
||||
bulletDestination.classList.add('cible-touchee');
|
||||
bulletX = 0;
|
||||
bulletY = 0;
|
||||
setTimeout(function(){
|
||||
bulletDestination.classList.remove('cible-touchee');
|
||||
}, 1000);
|
||||
return;
|
||||
}
|
||||
var grid = document.querySelector('.line-'+bulletY+' .col-'+bulletX);
|
||||
|
||||
bulletX = newX;
|
||||
bulletY = newY;
|
||||
grid.style.background = 'url(./assets/img/bg_bullet.png) no-repeat';
|
||||
grid.style.backgroundPosition = bulletDir;
|
||||
}, 32.12);
|
||||
|
||||
var grid = document.querySelector('.line-'+bulletY+' .col-'+bulletX);
|
||||
var ntm = setInterval(function(){
|
||||
x2 = Math.floor(Math.random() * 10) + 1;
|
||||
if (x2 == x){
|
||||
x2 = x+1;
|
||||
}
|
||||
y2 = Math.floor(Math.random() * 20) + 1;
|
||||
if (y2 == y){
|
||||
y2 = y+1;
|
||||
}
|
||||
|
||||
grid.style.background = 'url(./assets/img/bg_bullet.png) no-repeat';
|
||||
grid.style.backgroundPosition = bulletDir;
|
||||
}, 32.12);
|
||||
if(ciblex < maxX && cibley < maxY){
|
||||
console.log(ciblex+' pour '+maxX);
|
||||
emplacement = document.querySelector(".line-"+ciblex+" .col-"+cibley);
|
||||
emplacement.classList.add('cible');
|
||||
}
|
||||
|
||||
var ntm = setInterval(function(){
|
||||
x2 = Math.floor(Math.random() * 10) + 1;
|
||||
if (x2 == x){
|
||||
x2 = x+1;
|
||||
}
|
||||
y2 = Math.floor(Math.random() * 20) + 1;
|
||||
if (y2 == y){
|
||||
y2 = y+1;
|
||||
}
|
||||
var ciblex = x2,
|
||||
cibley = y2,
|
||||
emplacement = document.querySelector(".line-"+ciblex+" .col-"+cibley);
|
||||
emplacement.classList.add('cible');
|
||||
cibleValue = cibleValue + 1;
|
||||
if (cibleValue>=4){
|
||||
gameover.style.display = 'block';
|
||||
playing = false;
|
||||
clearInterval(ntm);
|
||||
}
|
||||
}, difficulty);
|
||||
|
||||
if(ciblex < maxX && cibley < maxY){
|
||||
console.log(ciblex+' pour '+maxX);
|
||||
emplacement = document.querySelector(".line-"+ciblex+" .col-"+cibley);
|
||||
emplacement.classList.add('cible');
|
||||
}
|
||||
|
||||
var ciblex = x2,
|
||||
cibley = y2,
|
||||
emplacement = document.querySelector(".line-"+ciblex+" .col-"+cibley);
|
||||
emplacement.classList.add('cible');
|
||||
cibleValue = cibleValue + 1;
|
||||
if (cibleValue>=4){
|
||||
var gameover = document.querySelector('.gameover');
|
||||
gameover.style.display = 'block';
|
||||
playing = false;
|
||||
clearInterval(ntm);
|
||||
}
|
||||
}, 1600);
|
||||
|
||||
document.addEventListener('keydown', move, false);
|
||||
setPosition(x, y, direction);
|
||||
document.addEventListener('keydown', move, false);
|
||||
setPosition(x, y, direction);
|
||||
}
|
||||
|
||||
var replay = document.querySelector('.replay');
|
||||
var easy = document.querySelector('.play.easy');
|
||||
var hard = document.querySelector('.play.hard');
|
||||
var startmenu = document.querySelector('.startmenu');
|
||||
|
||||
replay.addEventListener('onclick', function(){
|
||||
alert('test');
|
||||
replay.addEventListener('click', function(){
|
||||
run('easy');
|
||||
});
|
||||
|
||||
easy.addEventListener('click', function(){
|
||||
run('easy');
|
||||
startmenu.style.display = 'none';
|
||||
});
|
||||
|
||||
hard.addEventListener('click', function(){
|
||||
run('hard');
|
||||
startmenu.style.display = 'none';
|
||||
});
|
||||
26
index.html
26
index.html
|
|
@ -6,6 +6,8 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class="nano-player" style="display: none"></div>
|
||||
|
||||
<section class="header">
|
||||
<h1>de_tank</h1>
|
||||
</section>
|
||||
|
|
@ -23,9 +25,9 @@
|
|||
<div class="startmenu">
|
||||
<h1>DE_TANK</h1>
|
||||
<h4>Vous devez détruire les cibles,<br><br> si plus de 3 cibles sont affichées c'est PERDU.</h4>
|
||||
<a href="#" class="play">Facile</a>
|
||||
<a href="#" class="play easy">Facile</a>
|
||||
<br><br>
|
||||
<a href="#" class="play">Pas facile</a>
|
||||
<a href="#" class="play hard">Pas facile</a>
|
||||
<img src="assets/img/tank.png" alt="tank">
|
||||
</div>
|
||||
<div class="line line-1">
|
||||
|
|
@ -252,7 +254,23 @@
|
|||
</div>
|
||||
<div class="background"></div>
|
||||
|
||||
</body>
|
||||
<script src="assets/js/script.js"></script>
|
||||
<script src="./assets/js/nano.js"></script>
|
||||
<script src="assets/js/script.js"></script>
|
||||
|
||||
<script>
|
||||
var nanoPlayer = new nanoPlayer('.nano-player', {
|
||||
// Parameters
|
||||
autoplay: true,
|
||||
loop: true,
|
||||
defaultVolume: 100,
|
||||
songList: [
|
||||
{
|
||||
name: 'musique',
|
||||
path: 'song.mp3'
|
||||
}
|
||||
],
|
||||
DefaultSong: 0
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in New Issue