Jump to content

Pausing graphics ?


Recommended Posts

I am just getting started in JavaScript, and am trying to convert programs written in BASIC into JavaScript.

In a program to display 'arabesque' graphics, BASIC allows PAUSES between displayed sequences, each calculated within nested loops.

My attempts to do this in JavaScript have failed, as FireFox will not pause except by using 'prompt' or 'alert' to show intermediate images.

Chrome will not display the graphics at all in this case, as the screen is all blank. (My aim is to display arabesques on PCs, tablets or smartphones....)

I have tried using setInterval and setTimeout, which will cause delays, but DO NOT show graphics as they are calculated.

Does JavaScript have a capability to pause and show graphics output within nested loops?



Link to comment
Share on other sites

  • 2 weeks later...


It has been suggested that I try asynchronous functions, but I  have not yet fully mastered that technique.

Timeouts do pause code, but do NOT force graphics to be shown on screen as they are calculated.....

 Should I post my code on the forum, in as much as it works so far ?

 Any suggestions would be greatly appreciated.      



Link to comment
Share on other sites

Hi Niche,

Thank you for replying to my plea for help.

I attatch the complete file which will run on a PC under Firefox, but unfortunately not Chrome.

The program was originally written in BASIC. The guts of it are in the core() function, called  on line 93.

I would hope to be able to implement a short pause of graphics drawing on lines 94 and 121.

on lines 97-100, the alert() needs to be got rid of, as on my smartphone the popup hides the graphics....

M waits() function does pause the program, but I can find no way to pause the graphics, other than by using alert() or prompt() !

There must surely be a simple JavaScript function to pause graphics drawing ?

Hope you can help, as many BASIC programs depend on graphics pauses....

(This one is just a simple program  to get me started on JavaScript).



Link to comment
Share on other sites



Hi Niche,

Hope I have done it right this time, using the     code  <>     symbol above.

Please refer to my posting of   sat 01:07  for details of the relevant section needing attention.

I would be very grateful if you could advise, as this problem is totally blocking any further projects I have in mind.

Many thanks for your interventions.




Link to comment
Share on other sites

Nope.  Not yet.  

Paste the actual text of your code using the code tags.  That will make your code visible in your post.  You keep posting the file.

It's usually always very bad practice to click a button connected to a file from an unknown source.

We want to see your work an a completely SAFE environment.

Please post the text, not the file, using the <> tags.  IF IT'S TOO LONG, edit out the irrelevant parts. 


We need to see something with a format like this:

<!DOCTYPE html>
img {
  float: right;
<h1>The float Property</h1>

<p>In this example, the image will float to the right in the text, and the text in the paragraph will wrap around the image.</p>

<p><img src="pineapple.jpg" alt="Pineapple" style="width:170px;height:170px;margin-left:15px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus imperdiet, nulla et dictum interdum.</p>



Edited by niche
  • Like 1
Link to comment
Share on other sites

Hi Niche,

<< It's usually always very bad practice to click a button connected to a file from an unknown source. >>

Yes, that is why I always use proprietary checking software to guard against the risk...

I've neen exchanging files frequently since the '80s, and never seen a hint of a virus yet...

Best Regards,

QL Steve. 

Link to comment
Share on other sites

Yes, I have read the guidelines.

Perhaps this is the moment to present my problem in a different way :

The BASIC language allows you to PAUSE any graphics you are in the process of calculating and drawing on screen.

Is there an equivalent JavaScript function ?  If not is it possible to write code to do so ?

Having scoured the tutoriel sections, I have found nothing suitable as of yet. 

Please feel free to examine the code in a text editor, if you are suspicious of dodgy code...

The code works perfectly well in BASIC, and under at least one PC browser in JavaScript.

Without a suitable equivalent function, JavaScript cannot be my language of choice.

I have spent many months developing a very big Javascript program, which has also had to be cancelled for a different incompatibility reason.

If anyone has solved the issue already, I would be very pleased to read of it.


Link to comment
Share on other sites


I have managed to pause graphics output by OPENing a minor window, then using a delay.  (This first dumps graphics to the main window).

So the program now runs fine under Firefox on my PC, but under Chrome the graphics window is not shown at all ! ( And IE just dithers...).

On my SmartPhone, the graphics window opens, but the minor window is blocked....

Are these JavaScript quirks, or browser problems ?

Many thanks for past encouragement..... I feel I am now getting somewhere.




Link to comment
Share on other sites

Chrome can be tweaked to allow specific pop-ups, but the defaults are in fact ok !

Yet in Chrome, OPENing tiny windows would appear to CLOSE  the main 'canvas' window used for graphics output ? So nothing gets drawn..

Yet FireFox manages everything OK, so the problem is not with JavaScript ?

I have tried various settings surrounding open & close, but which make no difference.

Do I need to re-open the canvas (ctx.) window every time I call the pop-up ?






Link to comment
Share on other sites

  • 3 weeks later...

Hi Everybody,

My problem has been solved by a friendly JavaScript user :

The equivalent of the BASIC 'Pause' keyword is the sleep() function ! This could perhaps be made clear in the tutorial ?  

The epicycle2.html code now runs fine on PC and smartphone, under FireFox, Chrome and IE !

Now I can get back to work on my learning curve....

Many thanks for your suggestions.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...