diff --git a/00160.камера.js b/00160.камера.js new file mode 100644 index 0000000..51bfa07 --- /dev/null +++ b/00160.камера.js @@ -0,0 +1,41 @@ +мир.камера = { + обновить: обновитьКамеру, +}; + + +// // // // + + +function обновитьКамеру() +{ + var тело = мир.объекты.тела[мир.игрок.задано.объект]; + if (!тело) + { + return; + } + + var корень = document.getElementById("корень"); + // Сейчас. + var x0 = 0; + if (корень.style.left.endsWith("px")) + { + x0 = корень.style.left.slice(0, -2); + } + var y0 = 0; + if (корень.style.top.endsWith("px")) + { + y0 = корень.style.top.slice(0, -2); + } + // Цель. + var x1 = window.innerWidth / 2 - тело.position.x; + var y1 = window.innerHeight / 2 - тело.position.y; + // Плавно. + function lerp(v0, v1, t) { + return v0 * (1 - t) + v1 * t; + } + var x = lerp(x0, x1, 0.1); + var y = lerp(y0, y1, 0.1); + + корень.style.left = `${x}px`; + корень.style.top = `${y}px`; +} diff --git a/01000.пуск.js b/01000.пуск.js index 89e67a7..c0a07e4 100644 --- a/01000.пуск.js +++ b/01000.пуск.js @@ -3,6 +3,7 @@ мир.физика.обновить(); мир.объекты.обновить(); мир.игрок.обновить(); + мир.камера.обновить(); requestAnimationFrame(мир.обновить); }; diff --git a/01300.пример.json.js b/01300.пример.json.js index b9dffaa..3f55a9c 100644 --- a/01300.пример.json.js +++ b/01300.пример.json.js @@ -12,10 +12,11 @@ объекты: { пол: { x: 1000, - y: 300, + y: 590, ширина: 2000, вид: { background: "url(р/отладка/основа.jpg) repeat-x", + display: "none", }, }, колобок: { @@ -28,10 +29,19 @@ background: "url(р/колобок/колобок_неподвижен.png) no-repeat scroll 50% 0% / contain", }, }, + фундаментПечи: { + x: 840, + y: 480, + ширина: 550, + вид: { + background: "url(р/отладка/основа.jpg) repeat-x", + //display: "none", + }, + }, }, игрок: { объект: "колобок", - скорость: [4, 12], + скорость: [4, 13], клавиши: ["ArrowLeft", "ArrowRight", "ArrowUp"], }, }); diff --git a/index.html b/index.html index 113e369..2a0b22e 100644 --- a/index.html +++ b/index.html @@ -9,6 +9,7 @@ margin: 0; padding: 0; overflow: hidden; + background: #fbfbfb; } body { @@ -29,6 +30,7 @@ +