Pracuję nad grą Słowo Scramble za pomocą Phaser 3 i JavaScript. Do tej pory mogłem wyświetlić wymonglowane słowo na ekranie jednym kliknięciem przycisku. Teraz potrzebuję użytkownika, aby móc kliknąć to, co myślą, jest pierwszą literą Słowo, które jest wymierane. Jeśli mają rację, list zostaje umieszczony gdzieś gdzieś, a one kontynuowały, aż słowo zostanie prawidłowo wypisane. Jeśli klikniesz na niewłaściwym liście, nie zostanie umieszczony powyżej, więc próbują ponownie. Nie wiem, co robić dalej. Oto, co mam do tej pory:

public onSceneCreated() {
     // Fit world to screen
        this.scene.game.scale.scaleMode = Phaser.Scale.FIT;
        this.scene.game.scale.refresh(PhaserHelper.worldSize.width, PhaserHelper.worldSize.height);

    // See the world size, eventually remove
       this.scene.cameras.main.setBackgroundColor("rgba(255, 255, 255, 0.2)");

    let centerX = PhaserHelper.worldSize.width / 2;
    let centerY = PhaserHelper.worldSize.height / 2;   
    
    // Random word picked from array
    let word = this.activityItems[Math.floor(Math.random() * this.activityItems.length)];
    
    // Function that scrambles a word
    let scramble = (a) => {
        a = a.split("");
        for(let b = a.length - 1; 0 < b; b--) {
            let c = Math.floor(Math.random()*(b + 1));
            let d = a[b];
                a[b] = a[c];
                a[c] = d;
        }
         return a.join("");
    }        

    // Adds button (clickable text)
    let clickButton = this.scene.add.text(1000, 800, 'Button', { 
        fontFamily: Fonts.BalsamiqSans,
        fontSize: 50,
        color: Colors.black,
         });    
        clickButton.setInteractive();
    // Display scrambled word by clicking button
        clickButton.on('pointerdown', () => {
    this.scene.add.text(centerX, centerY, scramble(`${word.answer.text}`), {
        fontFamily: Fonts.BalsamiqSans,
        fontSize: 100,
        color: Colors.black,
        });
     });
    console.log(`${word.answer.text}`);
}

Każda pomoc byłaby bardzo mile widziana. Dzięki.

0
Chris 19 październik 2020, 02:51

1 odpowiedź

Najlepsza odpowiedź

Nie znam fazera, ale może to pomóc w idei w JavaScript

var cnt =  0 

var spans = document.getElementsByTagName('span');
for(i=0;i<spans.length;i++)
    spans[i].onclick=getLetter;

function getLetter(){

var correct = document.getElementById('correct')

    var letter =this.innerHTML
    
    
    if (cnt == 0 && letter == 'v'){
       correct.innerHTML = 'v'
       cnt++
    }
    else if( cnt == 1 && letter == 'o')
    {
       correct.innerHTML = 'vo'
       cnt++
    }
    else if( cnt == 2 && letter == 't')
    {
       correct.innerHTML = 'vot'
       cnt++  
    }
    else if( cnt == 3 && letter == 'e')
    {
       correct.innerHTML = 'vote'
       cnt++
    }
    else if( cnt == 4 && letter == 's')
    {
       correct.innerHTML = 'votes'
       cnt++      
    }
}
span{
display:inline-block;
border:solid 1px black;
width:20px;

margin:5px;
padding:5px;
text-align:center;
}

#correct{
margin:50px;
}

#scrambled{
border:solid black 1px;
width:210px;}
<div id="correct"></div>
<div id='scrambled'><span>e</span><span>o</span><span>v</span><span>s</span><span>t</span></div>
0
DCR 19 październik 2020, 00:45