Executing a function

Probably a silly question.
Creating a noughts and crosses game against the computer.
When user clicks in one of the nine squares it calls a function to check not already used, enter the X character and check if there is a winning line.
It then calls another function that carries out the computer’s turn.
The problem is that the user’s X is not written until after the second function has been executed and so the X and O appear together.
Is there a way to force the inner HTML for the X to be written before the second function is called?

I’d suggest posting your file for anyone being able to help you …

In general you can delay a function call with setTimeout

update: setTimeout instead of setInterval

1 Like

You could also use the API

hypeDocument.functions().theFunctionToCall(hypeDocument, element, event)

in the first function after your checks.

1 Like

Thanks. I have tried your suggestion but has the same problem.
The first function that calls the second one is not completed until the second one has run i.e. the user’s 'X’symbol is not written until the second function where the computer decides to go has been completed - therefore the X and O are written together.

I think it’s the way you are calling/using your functions. It’s difficult to give you an exact solution as we don’t know how you’re calling your functions therefore we are just guessing as to what needs to be done. As Hans suggested … Can you share your doc?

Thanks for your suggestions. I have solved the problem in a couple of ways:

  1. Calling the second function using setTimeout. It now completes the output from the calling function before calling the second one.
  2. Using the Main Timeline. The first function continues the paused timeline to an event that runs the second function and then restarts the timeline.
    Once again, thanks for your help.

Thanks. This works really well.