QLsteve Posted December 30, 2020 Share Posted December 30, 2020 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 More sharing options...
QLsteve Posted January 8, 2021 Author Share Posted January 8, 2021 HI, 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 More sharing options...
niche Posted January 8, 2021 Share Posted January 8, 2021 Please post your code using the code tags. Preferably, only the relevant parts. Link to comment Share on other sites More sharing options...
QLsteve Posted January 9, 2021 Author Share Posted January 9, 2021 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). epicycle2.html Link to comment Share on other sites More sharing options...
niche Posted January 11, 2021 Share Posted January 11, 2021 Resend using the code tags. Edit your script down to the relevant parts if it's too long. Link to comment Share on other sites More sharing options...
QLsteve Posted January 12, 2021 Author Share Posted January 12, 2021 epicycle2.html 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 More sharing options...
niche Posted January 12, 2021 Share Posted January 12, 2021 (edited) 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. EDIT: We need to see something with a format like this: <!DOCTYPE html> <html> <head> <style> img { float: right; } </style> </head> <body> <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> </body> </html> Edited January 12, 2021 by niche 1 Link to comment Share on other sites More sharing options...
QLsteve Posted January 14, 2021 Author Share Posted January 14, 2021 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 More sharing options...
niche Posted January 14, 2021 Share Posted January 14, 2021 Read the Guidelines. Link to comment Share on other sites More sharing options...
QLsteve Posted January 15, 2021 Author Share Posted January 15, 2021 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 More sharing options...
dsonesuk Posted January 16, 2021 Share Posted January 16, 2021 The only possibility of achieving this is by using setTimeout, clearTimeout, setInterval, clearInterval and possibly javascript promise to wait for result before moving on or pausing with graphic. Link to comment Share on other sites More sharing options...
QLsteve Posted January 16, 2021 Author Share Posted January 16, 2021 Hi Dsonesuk, Thank you very much for this advice. I will look up 'promise' on the tutorials and try to master that aspect. (I had not encountered the 'promise' keyword in my searches to date). Link to comment Share on other sites More sharing options...
QLsteve Posted January 17, 2021 Author Share Posted January 17, 2021 Hi, 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 More sharing options...
dsonesuk Posted January 17, 2021 Share Posted January 17, 2021 I would imagine it would be browser popup blocking issue. Link to comment Share on other sites More sharing options...
QLsteve Posted January 18, 2021 Author Share Posted January 18, 2021 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 More sharing options...
dsonesuk Posted January 18, 2021 Share Posted January 18, 2021 opening and closing javscript window does not work, if that is what you are attempting, try to create a html modal popup instead . https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_modal_img Link to comment Share on other sites More sharing options...
QLsteve Posted February 2, 2021 Author Share Posted February 2, 2021 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 More sharing options...
Ingolme Posted February 2, 2021 Share Posted February 2, 2021 There is no such function as sleep() in Javascript. Is that something provided by the Node.js environment? Link to comment Share on other sites More sharing options...
dsonesuk Posted February 2, 2021 Share Posted February 2, 2021 Its a function created that uses promise and async/wait to give same result. Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now