Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.09.2016, 14:02
Интересующийся
Отправить личное сообщение для CANGARIE Посмотреть профиль Найти все сообщения от CANGARIE
 
Регистрация: 22.09.2016
Сообщений: 11

Коллизия в платформере. Как это подчинить.
<!DOCTYPE html> 

<html> 

<head> 
<canvas id="app">Your browser doesnt support the Canvas. Please update it to actual version.</canvas> 
</head> 

<body> 
<script defend src="js2d.js"></script> 
<script defend src="key.js"></script> 
<script defend src="engine.js"></script> 
<script> 
/*load game script*/ 
'use strict' 
var game = { 
width: 800, 
height: 600, 
scene: 'loader' 
}; 
/*in this variable i contian all game configurations*/ 
/*and load canvas*/ 

var c = document.getElementById('app'); 
var ctx = c.getContext('2d'); 
c.width=game.width; 
c.height=game.height; 

/*load image*/ 

var loader_first = new Image(); 
var loader_second = new Image(); 
var loader_third = new Image(); 

loader_first.src="http://vkapilessons.esy.es/1.png"; 
loader_second.src="http://vkapilessons.esy.es/2.png"; 
loader_third.src="http://vkapilessons.esy.es/3.png"; 

var isLoad = false; 

/*create the loader*/ 
if(game.scene=='loader') { 
window.onload = function getLoader() { 
ctx.drawImage(loader_first,0,0,game.width,game.height); 

setTimeout( 
function() { 
ctx.clearRect(0,0,game.width,game.height); 
ctx.drawImage(loader_second,0,0,game.width,game.height); 
} 
, 900); 
setTimeout( 
function() { 
ctx.clearRect(0,0,game.width,game.height); 
ctx.drawImage(loader_third,0,0,game.width,game.height); 
isLoad=true; 
player.draw(); 
} 
, 1600); 
}; 
}; 

/*change gamescene*/ 
if(isLoad) { 
game.scene='gamelesson' 
}; 
/*global obj player with player.config*/ 
var player = { 
x:150, 
y: 250, 
width: 50, 
height: 50, 

/*player behv.*/ 
isRight: false, 
isLeft: false, 
isJump: false, 
isDestroy: false, 
speed: 3, 

draw: function drawPlayer() { 
clearCanvas(0,0,game.width,game.height); 
draw(player.x, player.y, player.width, player.height); 
map.draw(); 
} 
}; 

/*in this function we create the player-move*/ 
function movePlayerLeft() { 
clearCanvas(player.x, player.y, player.width, player.height); 
player.x-=player.speed 
player.draw() 
}; 

function movePlayerRight() { 
clearCanvas(player.x, player.y, player.width, player.height); 
player.x+=player.speed 
player.draw() 
}; 

var isJump = 0; 

function playerJump() { 
if (isJump==0) { 
setTimeout(function() { 
clearCanvas(player.x, player.y, player.width, player.height); 
player.y-=10; 
player.draw(); 
isJump = 1; 
},100); 
setTimeout(function(){ 
clearCanvas(player.x, player.y, player.width, player.height); 
player.y+=10; 
player.draw(); 
isJump=0; 
},300); 
}; 
}; 

/*big func to clear or draw canvas easy*/ 
function clearCanvas(x,y,width,height) { 
ctx.clearRect(x,y,width,height); 
}; 
function draw(x,y,width,height) { 
ctx.fillRect(x,y,width,height); 
}; 

/*in game loop we give keyCode and dofunc*/ 
startGame( 
function() { 
if(isKeyDown('D')) { 
movePlayerRight(); 
}; 
if(isKeyDown('A')) { 
movePlayerLeft(); 
}; 
if(isKeyDown('LEFT')) { 
movePlayerLeft(); 
}; 
if(isKeyDown('RIGHT')) { 
movePlayerRight(); 
}; 
if(isKeyDown('W')) { 
if(isJump==0) { 
playerJump(); 
}; 
}; 
if(isKeyDown('UP')) { 
if(isJump==0) { 
playerJump(); 
}; 
}; 
}); 


var map = { 

x: [150,350,480], 
y: [290,250, 250], 
w: [100,100, 250], 
h: [30,30,40], 

draw: function() { 
for(var i=map.x.length; i!=-1; i--) 
ctx.fillRect(map.x[i], map.y[i], map.w[i], map.h[i]); 
} 
}; 

var isCollision = 0; 


function checkCollision() { 
for(var i=map.x.length; i!=-1; i--){ 
if (player.x < map.x[i] + map.w[i] && 
player.x + player.width > map.x[i] && 
player.y < map.y[i] + map.h[i] && 
player.height + player.y > map.y[i]) { 
console.log('Hello motherfucker'); 
player.y=map.y[i]+map.w[i]; 
isCollision=1; 
var fall=0; 
} else { 
if(isCollision==0) { 
var fall = setInterval(function() { 
clearCanvas(player.x,player.y,player.width,player.height); 
player.y+=3; 
player.draw(); 
if(player.y>800) { 
clearInterval(fall) 
console.log('Fall has been stoped!:)') 
}; 
},10) 
fall(); 
}; 
}; 
}; 
}; 

var fall; 

function fall() { 
if(isCollision==0) { 
var fall; 
}; 
}; 

</script> 
</body>


Содержимое файлов key.js и engine.js отвечают за клавишу и игровой цикл. Как я себе представляю механизм и вообще в чем проблема?

Дело такое. Мне нужно постоянно (т.е., нужно действие в цикл засунуть, я бы это уже сделал, да только вот оно вообще не работает, цикл в функции startGame) сравнивать значения из массива мапы с координатами игрока, если все совпадает - игрок становится на координату платформы (player.y = map.y[i]+map.w[i]).

Казалось бы все должно работать. но есть одно НО. В массиве несколько значений, а значит что для одной платформы - коллизия есть, для остальных нет, в следствии чего происходит и console.log() и fall();.

Как я представлял себе решение задачи?

var global=0
var try=0

while(global==0) {
for() if() {
global=1
} else {
global==0
try++
If(try==map.x.lenght) {
fall();
};
};
}


но в данном случае значение функции - undefined. для запуска функции использовал консоль(checkCollision()

Что должно получится? персонаж должен уметь ходить и прыгать по платформам и падать, если не допрыгнул (стандартная механика платформера, короче).

ОЧЕНЬ буду благодарен за помощь, заранее спасибо
Ответить с цитированием
  #2 (permalink)  
Старый 22.09.2016, 14:03
Интересующийся
Отправить личное сообщение для CANGARIE Посмотреть профиль Найти все сообщения от CANGARIE
 
Регистрация: 22.09.2016
Сообщений: 11

/*engine.js*/
var _renderer = (function() {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
function (callback) {
setTimeout(callback,1000/60);
};
})();

var _engine = function() {
	console.log('Игровой цикл не инициализирован!');
};

var startGame = function(game) {
	if(typeof game == 'function') {
		_engine = game;
	};
	gameLoop();
};

var setGame = function(game) {
	if(typeof game == 'function') {
		_engine = game;
	};
};

var gameLoop = function() {
	_engine();
	_renderer(gameLoop);
};
Ответить с цитированием
  #3 (permalink)  
Старый 22.09.2016, 14:03
Интересующийся
Отправить личное сообщение для CANGARIE Посмотреть профиль Найти все сообщения от CANGARIE
 
Регистрация: 22.09.2016
Сообщений: 11

/*key.js*/
var keys = {
'W':87,
'A':65,
'D':68,
'LEFT':37,
'RIGHT':39,
'UP':38
};

var keyDown = {};

var setKey = function (keyCode) {
keyDown[keyCode] = true;
};

var clearKey = function (keyCode) {
keyDown[keyCode] = false;
};

var isKeyDown = function (keyName) {
return keyDown[keys[keyName]]==true;
};

window.onkeydown = function(e) {
setKey(e.keyCode);
};

window.onkeyup = function(e) {
clearKey(e.keyCode);
};
Ответить с цитированием
  #4 (permalink)  
Старый 22.09.2016, 14:06
Интересующийся
Отправить личное сообщение для CANGARIE Посмотреть профиль Найти все сообщения от CANGARIE
 
Регистрация: 22.09.2016
Сообщений: 11

P.S: решения не прошу. если можете - подкиньте идейку
Ответить с цитированием
  #5 (permalink)  
Старый 24.09.2016, 09:29
Интересующийся
Отправить личное сообщение для CANGARIE Посмотреть профиль Найти все сообщения от CANGARIE
 
Регистрация: 22.09.2016
Сообщений: 11

Спасибо за помощь
Ответить с цитированием
  #6 (permalink)  
Старый 25.09.2016, 11:19
Интересующийся
Отправить личное сообщение для CANGARIE Посмотреть профиль Найти все сообщения от CANGARIE
 
Регистрация: 22.09.2016
Сообщений: 11

АУ ТОВАРИЩИ?

вы спите? неужели никто не знает? мда..
Ответить с цитированием
  #7 (permalink)  
Старый 25.09.2016, 15:55
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Цитата:

Как я представлял себе решение задачи?
...
If(try==map.x.lenght)
...
в следствии чего происходит и console.log()

В общем эльфы набигают грабить корованы.
Ответить с цитированием
  #8 (permalink)  
Старый 25.09.2016, 15:56
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Это господа знаете, что такое?

If(try==map.x.lenght)

Парень поцеловал девушку, после этого она сказала слово из трех букв, и в этом слове сделала три ошибки. Что она сказала?
Ответить с цитированием
  #9 (permalink)  
Старый 25.09.2016, 15:59
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Сообщение от CANGARIE
ТОВАРИЩИ
Тамбовский волк тебе товарищ. Кури травы меньше.
Ответить с цитированием
  #10 (permalink)  
Старый 26.09.2016, 21:32
Интересующийся
Отправить личное сообщение для CANGARIE Посмотреть профиль Найти все сообщения от CANGARIE
 
Регистрация: 22.09.2016
Сообщений: 11

Сообщение от warren buffet Посмотреть сообщение
Это господа знаете, что такое?

If(try==map.x.lenght)

Парень поцеловал девушку, после этого она сказала слово из трех букв, и в этом слове сделала три ошибки. Что она сказала?
а теперь не выебывайся и скажи где здесь ошибка
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Развитие стандарта HTML Paguo-86PK Элементы интерфейса 104 14.12.2015 21:58
В callback функции теряется контекст. Как это обойти? xintrea AJAX и COMET 4 02.06.2013 11:40
БД, JS и PHP или как всё это сложить lazerru Общие вопросы Javascript 2 15.04.2013 17:20
Как бы Вы это верстали? madd1 (X)HTML/CSS 19 03.08.2012 00:13
form, onclick, function...как это все сплести воедино? Berowz Общие вопросы Javascript 0 04.03.2012 15:06