krouzek:bludiste2

Rozdíly

Zde můžete vidět rozdíly mezi vybranou verzí a aktuální verzí dané stránky.

Odkaz na výstup diff

Obě strany předchozí revize Předchozí verze
Následující verze		 Předchozí verze
krouzek:bludiste2 [2022/04/13 13:33] – adminkrouzek:bludiste2 [2023/11/15 20:54] (aktuální) – upraveno mimo DokuWiki 127.0.0.1
Řádek 4: Řádek 4:
   * hráč se pohybuje klávesami   * hráč se pohybuje klávesami
   * dvě nepohybující se příšery   * dvě nepohybující se příšery
 +
 +
 +
 +<code javascript>
 +
 +/* Javascript */
 +
 +// obalová funkce zajistí, že se vše spustí až po načtení dokumentu
 +(function() {
 +
 +const mapa = [
 +    ['X','X','X','X','X','X','X','X','X','X','X'], // y=0
 +    ['X',' ',' ','X',' ',' ',' ',' ','X',' ','X'], // y=1
 +    ['X',' ',' ','X','X',' ','X',' ','X',' ','X'], // y=2
 +    ['X',' ','X','X',' ',' ','X',' ','X',' ','X'], // y=3
 +    ['X',' ','X',' ',' ','X','X',' ',' ',' ','X'], // y=4
 +    ['X',' ',' ',' ',' ','X','X','X','X',' ','X'], // y=5
 +    ['X',' ',' ','X',' ','X',' ',' ',' ',' ','X'], // y=6
 +    ['X',' ','X','X',' ','X',' ','X','X','X','X'], // y=7
 +    ['X',' ',' ','X',' ','X',' ',' ',' ',' ','X'], // y=8
 +    ['X','X','X','X','X','X','X','X','X','X','X']  // y=9
 +]
 +// uvodni pozice hrace
 +const start = {x: 1, y: 1}
 +// kam se chce dostat
 +const end = {x: 9, y: 1}
 +
 +// pole uvodnich pozic prekazek
 +const prisery = [
 +    {pohyb: 'random', x: 4, y: 3},
 +    {pohyb: 'greedy', x: 7, y: 4}
 +]
 +
 +    let player = start
 +
 +    //
 +function vykresli(){
 +    const hraciDeska = document.getElementById('hraci-deska')
 +    // vnejsi cyklus: po jednotlivych radkach
 +    for (let y = 0; y < mapa.length; y++){
 +        const radka = mapa[y];
 +        let radkaElement = document.getElementById(`radka_${y}`)
 +        if(!radkaElement){
 +            radkaElement = document.createElement('div')
 +            radkaElement.classList.add('radka') // v CSS: .radka { ... }
 +            radkaElement.id = `radka_${y}`
 +            hraciDeska.appendChild(radkaElement)
 +        }
 +
 +        // vnitrni cyklus: po polickach v ramci jedne radky
 +        for(let x = 0; x< radka.length; x++){
 +            let policko = document.getElementById(`policko_${x}_${y}`)
 +            if(!policko){
 +                policko = document.createElement('div')
 +                policko.classList.add('policko') // v CSS: .policko { ... }
 +                policko.id = `policko_${x}_${y}`
 +                radkaElement.appendChild(policko)
 +            }
 +            if(mapa[y][x] == 'X'){
 +               policko.style.backgroundImage = "url('yoshi-32/yoshi-32-wall.png')"
 +            } else if(player.x == x && player.y == y) {
 +                // hrac 
 +                policko.style.backgroundImage = "url('yoshi-32/yoshi-32-worker.png')"
 +            } else if(prisery[0].x == x && prisery[0].y == y) {
 +                // prisera 1
 +                policko.style.backgroundImage = "url('yoshi-32/monster.png')"
 +            } else if(prisery[1].x == x && prisery[1].y == y) {
 +                // prisera 2
 +                policko.style.backgroundImage = "url('yoshi-32/monster.png')"
 +            }
 +            else {
 +                // prazdno
 +                policko.style.backgroundImage = "url('yoshi-32/yoshi-32-floor.png')"
 +            }
 +        }
 +    }
 +}
 +
 +function pohybHrace(event){
 +    let cilovaX = player.x
 +    let cilovaY = player.y
 +    if(!bylPohyb && event.code == "ArrowDown"){
 +        // ukazkovy pohyb panacka dolu
 +        cilovaY = player.y + 1
 +        cilovaX = player.x
 +    }
 +    if(!bylPohyb && event.code == "ArrowLeft"){
 +        // pohyb vlevo
 +        cilovaY = player.y
 +        cilovaX = player.x - 1
 +    }
 +    if(!bylPohyb && event.code == "ArrowRight"){
 +        // pohyb vpravo
 +        cilovaY = player.y
 +        cilovaX = player.x + 1
 +    }
 +    if(!bylPohyb && event.code == "ArrowUp"){
 +        // pohyb nahoru
 +        cilovaY = player.y - 1
 +        cilovaX = player.x
 +    }        
 +    if(mapa[cilovaY][cilovaX] == ' '){
 +        player.x = cilovaX
 +        player.y = cilovaY
 +        bylPohyb = true
 +    }
 +}
 + 
 +document.addEventListener("keydown", pohybHrace);
 +
 +// objekt musi mit x a y
 +function jeVolnoNa(cilovaPozice){
 +    return (mapa[cilovaPozice.y][cilovaPozice.x] != 'X')
 +}
 +
 +function vyberNahodne(pole){
 +   return pole[Math.floor(Math.random()*pole.length)]
 +}
 +
 +/* Zde pracujeme na pohybu priser*/
 +function pohniPriseru(cisloPrisery){
 +    if(prisery[cisloPrisery].pohyb == "random"){
 +        // Random prisera
 +        mozneCile = [
 +            {x: prisery[cisloPrisery].x, y:prisery[cisloPrisery].y+1}, 
 +            {x: prisery[cisloPrisery].x, y:prisery[cisloPrisery].y-1},
 +            {x: prisery[cisloPrisery].x+1, y:prisery[cisloPrisery].y},
 +            {x: prisery[cisloPrisery].x-1, y:prisery[cisloPrisery].y},
 +        ].filter(cil => jeVolnoNa(cil))
 +        // Vyber nahodne z moznych cilu
 +        cil = vyberNahodne(mozneCile)
 +        // presun se na nej
 +        prisery[cisloPrisery].x = cil.x
 +        prisery[cisloPrisery].y = cil.y
 +    } else if(prisery[cisloPrisery].pohyb == "greedy"){
 +        // zkracuje nejdelsi vzdalenost k hraci
 +        const diffX = prisery[cisloPrisery].x - player.x
 +        const diffY = prisery[cisloPrisery].y - player.y
 +        let cil
 +        if(diffX > diffY){
 +            console.log("<>")
 +            // vpravo/vlevo
 +            if(diffX > 0){
 +                //prisera je napravo od hrace
 +                cil = {x:prisery[cisloPrisery].x-1, y:prisery[cisloPrisery].y}
 +            }else{
 +                cil = {x:prisery[cisloPrisery].x+1, y:prisery[cisloPrisery].y}
 +            }
 +        }else{
 +            console.log("^")
 +            // nahoru/dolu
 +            if(diffY > 0){
 +                //prisera je dole od hrace
 +                cil = {x:prisery[cisloPrisery].x, y:prisery[cisloPrisery].y-1}
 +            } else{
 +                cil = {x:prisery[cisloPrisery].x, y:prisery[cisloPrisery].y+1}
 +            }
 +        }
 +        // Jdu pouze pokud mohu
 +        if(jeVolnoNa(cil)){
 +            prisery[cisloPrisery].x = cil.x
 +            prisery[cisloPrisery].y = cil.y
 +        }
 +
 +    } else {
 +        throw "Neznamy typ pohybu prisery " + cisloPrisery
 +    }
 +}
 +
 +
 +setInterval( function(){
 +    // pridal jsem funkci na pohnuti priser
 +    for(let i=0; i<prisery.length; i++){
 +        pohniPriseru(i)
 +    }
 +    vykresli()
 +    bylPohyb = false
 +}, 1000)
 +
 +})()
 +
 +</code>
  • krouzek/bludiste2.1649856780.txt.gz
  • Poslední úprava: 2023/11/15 20:54
  • (upraveno mimo DokuWiki)