194 lines
5.5 KiB
JavaScript
Executable File
194 lines
5.5 KiB
JavaScript
Executable File
function logDebug(...args) {
|
||
// console.log.apply(this, args);
|
||
}
|
||
|
||
class Vector2 {
|
||
constructor(x, y) {
|
||
this.x = x;
|
||
this.y = y;
|
||
}
|
||
}
|
||
|
||
class Shimeji {
|
||
constructor() {
|
||
this.x = 0;
|
||
this.y = 0;
|
||
this.offset = null;
|
||
this.mouseHover = false;
|
||
this.mouseDown = false;
|
||
this.isFalling = true;
|
||
this.isWalking = false;
|
||
this.oldRect = null;
|
||
this.rect = null;
|
||
this.mousePos = new Vector2(0,0);
|
||
this.renderElem = document.createElement("img");
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime1.png";
|
||
this.renderElem.style.position = "fixed";
|
||
this.renderElem.style.zIndex = 1021;
|
||
this.renderElem.setAttribute("draggable", "false");
|
||
document.body.appendChild(this.renderElem);
|
||
this.updateInterval = setInterval(this.update.bind(this), 50);
|
||
this.move(0, 0);
|
||
this.renderElem.addEventListener("mouseenter", this.onMouseEnter.bind(this));
|
||
this.renderElem.addEventListener("mouseleave", this.onMouseLeave.bind(this));
|
||
this.renderElem.addEventListener("contextmenu", this.onContextMenu.bind(this));
|
||
window.addEventListener("mousedown", this.onMouseDown.bind(this));
|
||
window.addEventListener("mouseup", this.onMouseUp.bind(this));
|
||
window.addEventListener("mousemove", this.onMouseMove.bind(this));
|
||
}
|
||
|
||
move(x, y) {
|
||
this.x = x;
|
||
this.y = y;
|
||
this.renderElem.style.left = x + "px";
|
||
this.renderElem.style.top = y + "px";
|
||
}
|
||
|
||
onMouseMove(e) {
|
||
logDebug("onMouseMove");
|
||
this.mousePos = new Vector2(e.clientX, e.clientY);
|
||
const rect = this.renderElem.getBoundingClientRect();
|
||
if(this.mouseDown && (this.mouseHover || this.offset)) {
|
||
if(this.offset == null) {
|
||
this.offset = new Vector2(e.clientX - rect.left, e.clientY - rect.top);
|
||
}
|
||
this.move(e.clientX - this.offset.x, e.clientY - this.offset.y);
|
||
} else {
|
||
this.offset = null;
|
||
}
|
||
this.previewsEvent = e;
|
||
}
|
||
|
||
onMouseDown(e) {
|
||
logDebug("onMouseDown");
|
||
this.mouseDown = true;
|
||
}
|
||
|
||
onMouseUp(e) {
|
||
logDebug("onMouseUp");
|
||
this.mouseDown = false;
|
||
this.offset = null;
|
||
}
|
||
|
||
onMouseEnter(e) {
|
||
logDebug("onMouseUp");
|
||
this.mouseHover = true;
|
||
}
|
||
|
||
onMouseLeave(e) {
|
||
logDebug("onMouseUp");
|
||
this.mouseHover = false;
|
||
}
|
||
|
||
onContextMenu(e) {
|
||
e.preventDefault();
|
||
}
|
||
|
||
update() {
|
||
this.rect = this.renderElem.getBoundingClientRect();
|
||
if(this.offset == null) {
|
||
if(this.rect.bottom <= window.innerHeight -1) {
|
||
logDebug("isFalling");
|
||
this.isFalling = true;
|
||
this.move(this.rect.x, Math.min(this.rect.y + 10, window.innerHeight - this.rect.height));
|
||
} else {
|
||
this.isFalling = false;
|
||
if(Math.abs(this.rect.x - this.mousePos.x + (this.rect.width / 2)) > 5) {
|
||
logDebug("isWalking");
|
||
this.isWalking = true;
|
||
this.move(this.rect.x + (5 * -Math.sign(this.rect.x - this.mousePos.x + (this.rect.width / 2))), this.rect.y);
|
||
} else {
|
||
this.isWalking = false;
|
||
}
|
||
}
|
||
}
|
||
this.animate();
|
||
this.oldRect = this.rect;
|
||
}
|
||
|
||
animate() {
|
||
if(this.oldRect == null) this.oldRect = this.rect;
|
||
let diffX = this.oldRect.x - this.rect.x;
|
||
if(this.offset) {
|
||
// grap animation
|
||
if(Math.abs(diffX) > 20) {
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime9.png";
|
||
} else if(Math.abs(diffX) > 10){
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime7.png";
|
||
} else {
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime5.png";
|
||
}
|
||
this.renderElem.style.transform = diffX > 0 ? "scaleX(-1)" : "scaleX(1)";
|
||
} else if (this.isFalling) {
|
||
// falling animation
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime4.png";
|
||
} else {
|
||
// on floor animation
|
||
if(diffX == 0) {
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime1.png";
|
||
} else {
|
||
let animeIndex = new Date().getTime();
|
||
if(animeIndex % 400 > 200) {
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime3.png";
|
||
} else {
|
||
this.renderElem.src = "https://portfolio.sorlinv.fr/static/Shimeji/shime2.png";
|
||
}
|
||
this.renderElem.style.transform = diffX > 0 ? "scaleX(1)" : "scaleX(-1)";
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
let currentShimeji = null;
|
||
function initShimeji() {
|
||
currentShimeji = new Shimeji();
|
||
}
|
||
|
||
function initKonamiCode(_fct) {
|
||
let code = [];
|
||
let konamiCode = [38, 38, 40, 40, 37, 39, 37, 39, 66, 65];
|
||
let timeout;
|
||
document.body.addEventListener("keydown", function (e) {
|
||
clearTimeout(timeout);
|
||
e = e || window.event;
|
||
if (e.keyCode === konamiCode[code.length])
|
||
code.push(e.keyCode);
|
||
else
|
||
code = [];
|
||
if (code.length === konamiCode.length) _fct();
|
||
if (code.length <= 1) {
|
||
timeout = setTimeout(function () {
|
||
code = [];
|
||
}, 2000)
|
||
}
|
||
});
|
||
}
|
||
|
||
initKonamiCode(initShimeji);
|
||
|
||
console.log("LibKonamiCode from sorlinv is loaded");
|
||
|
||
function startaudio() {
|
||
let frequency = [32.703, 36.708, 41.203, 43.654, 48.999, 55.000, 61.735, 65.406, 73.416, 82.407, 87.307, 97.999, 110, 123.47, 130.81, 146.83, 164.81, 174.61, 196, 220, 246.94, 261.6, 293.67, 329.63, 349.23, 392, 440, 493.88, 523.25, 587.33, 659.26, 698.46];
|
||
fetch('songs/hakunamatata/Jean-Philippe Puymartin & Michel Elias (Le Roi Lion) - Hakuna Matata.txt')
|
||
.then(function(response) {
|
||
return response.text();
|
||
})
|
||
.then(function(text) {
|
||
let lines = text.split("\n");
|
||
for (let line of lines) {
|
||
let array = line.split(" ");
|
||
if(array[0] == ":" || array[0] == "F" || array[0] == "*") {
|
||
setTimeout(()=>{
|
||
// console.log(parseInt(array[3]));
|
||
let note = Pts.Sound.generate( "square", frequency[parseInt(array[3])]);
|
||
note.start();
|
||
setTimeout(()=>{
|
||
note.stop();
|
||
}, array[2] * 60);
|
||
}, array[1] * 60);
|
||
}
|
||
}
|
||
});
|
||
}
|