Memory game

JavaScript and client side scripting.

Moderator: General Moderators

User avatar
papa
Forum Regular
Posts: 958
Joined: Wed Aug 27, 2008 3:36 am
Location: Sweden/Sthlm

Re: Memory game

Post by papa »

Well when implementing this function the images are no longer clickable. So my function seems to be very poorly written. :)
User avatar
Burrito
Spockulator
Posts: 4715
Joined: Wed Feb 04, 2004 8:15 pm
Location: Eden, Utah

Re: Memory game

Post by Burrito »

after I make my second selection, the image immediately turns back over and I can't even see what it is.

you should put a setTimeout() to provide a delay so users can see what the second image (in a pair) is they're turning over.
User avatar
papa
Forum Regular
Posts: 958
Joined: Wed Aug 27, 2008 3:36 am
Location: Sweden/Sthlm

Re: Memory game

Post by papa »

Burrito wrote:after I make my second selection, the image immediately turns back over and I can't even see what it is.

you should put a setTimeout() to provide a delay so users can see what the second image (in a pair) is they're turning over.
There is a delay of 500ms but increased it to 1000. So hopefully it works better now :)

Noone has an idea why my function doesn't work ? :(
User avatar
papa
Forum Regular
Posts: 958
Joined: Wed Aug 27, 2008 3:36 am
Location: Sweden/Sthlm

Re: Memory game

Post by papa »

I've just rewieved the code and got the gamOver function working.

I'm so close now I can hear the fat ladies singing. But I can't get it to work and I'm running out of ideas...

Last cry for help in this thread:

Code: Select all

 
MemoryGame.prototype.handleLinkClick = function (link) {
    
    //If image is already revealed, then quit
    if (link.memoryGameState) return;
    
    var ref = link.name;    //find everything after #, which is the id of the image
 
    if(this.gameOver()) { //This if statement doesn't work at all... 
        alert('Congratulations, YOU WON!');
        window.location.replace('Memory.php');
    } else { 
    if (this.state) {   //If 1 image is already visible
 
        if (this.selectedId == ref)
        {
            //Match found
            this.showImage(link);
            
            link.memoryGameState = 2;
            this.selected.memoryGameState = 2;
            
            document.getElementById('result').innerHTML='<font color="green">Match!</font>';
        }
        else
        {
            //Match not found
            this.showImage(link);
            
            //Set images which will need to be hidden
            this.delayedHideList = [link, this.selected];
            
            var self = this;    //Save reference to MemoryGame object
            setTimeout(function () { self.hideImagesDelayed(); }, 1000);
            
            link.memoryGameState = 0;
            this.selected.memoryGameState = 0;
        
            document.getElementById('result').innerHTML='<font color="red">No match...</font>';
            
            //No of user attempts
            if(this.attempts) {
                this.attempts += 1;
                if(this.maxAttempts<=this.attempts) {
                    alert('Game Over');
                    window.location.replace('Memory.php');
                }               
            } else {
                this.attempts = 1;
            }
            //Displays attempts
            document.getElementById('attempts').innerHTML='Attempts: ' + this.attempts + '/' + this.maxAttempts;
        }
        
        this.state = 0;
        this.selectedId = null;
        this.selected = null;
    
    } else {
    
        this.showImage(link);
        
        link.memoryGameState = 1;
        
        this.state = 1;
        this.selected = link;
        this.selectedId = ref;
        
    }
    
    } //End else game over
    
}; 
Seems to work properly

Code: Select all

//See if all images are displayed
MemoryGame.prototype.gameOver = function () {
    var images = this.container.getElementsByTagName('img');
    
    //Loops thru images
    for(var i=0,j=images.length; i<j; i++) {
        //If any image still hidden, end loop
        if(images[i].src == './php/Classes/Memory/icons/icon_back.png') {
            return 0; //Game continues
            break;
        } 
    }
    //Returns 1 all images are displayed 
    return 1;
};
Source code


Thanks :crazy:
Post Reply