Jump to content

Generate images without refresh

Recommended Posts

So I'm working on an avatar system and I run into this problem. I'm using GD to generate the image, which is in it's own separate php file. In another file is where the image is called. I want it to where the user can use dropdowns to change the different layers on the image without having to reload the page every time. I mean the long way, like having the options saved in the database and the page is refreshed with a button click; showing the changes. If I did this it would write to the database every time the user tries something else, and I assume that's not good for performance. I just can't figure out a way to get the user's input from one file and have it affect the image generation file. Here's my setup if it helps:

  1. Image_generate.php: Separate images (used as layers) are merged into one image.
  2. Avatar.php: On the avatar creation page, the created image is displayed with html img src. A dropdown box saves the user's choice to the database when they hit 'submit'.
  3. That's it. The two can't talk to each other. Attempting database calls from image_generate.php gives a broken image; so even if I do save choices to the database, I can't seem to use it as a variable.
Link to comment
Share on other sites

AJAX! ;) Which is what The Dark Lord is describing. AJAX to the PHP page that generates the image. Whenever the user uses a dropdown, call the PHP page using AJAX, and update the image without having to refresh the page the user is on. Another option, if you want to go deeper into JS, is to preview using just Javascript and only process the image with PHP when the user finalizes/saves their avatar. Since Javascript can do much of the same image manipulation as PHP. That can help save some processing. Pretty certain you can even use the ever popular jQuery library to help do it all.

If you need more direction, I think I still have some old testing scripts I could send you as an example.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...