LiveCode Forums.

Posted: **Thu Aug 26, 2010 6:43 pm**

Here is what I need to do. I have 2 windows. Both contain identical 640x580 image areas. In window 1 the image is visible. in window 2 the image is covered by a black fog. In window 1 I need to be able to mouse over areas to erase the fog in the corresponding areas of window 2. The only way I have found to accomplish this objective, is to create a grid of 5 pixel x 5 pixel rectangles to cover both image areas. Each rectangle in image 1 has a mouse over script to make the corresponding rectangle in image 2 invisible. I have tested the mouse over script, and it works, and I am about to write a script that will create my grids on the full scale. However, before I do I was wondering if anyone knew of an easier way to accomplish this goal with less memory requirements.

Posted: **Thu Aug 26, 2010 11:03 pm**

Hi magice,

I gave it a try and if I understand correctly what you want I have a little different solution.
I made a stack with a substack, on each is the same image. I overlay the images with 2 images of the same size, one on the visible image the blendlevel is set to 65 and is pretty transparent but can be set to 100 to be completely transparent.
the other image is overlaid with a grey image, what I figure is supposed to be fog.
Now I use the eraser tool on the visible image (which works on the transparent overlayed image) and set the alphadate of the "fog" overlay image. This takes the fog away.
Since I wanted to try it on the image size you mentioned the stack is 1 Mb which is more then the 256 KB allowed here. So I posted a zipped stack
http://berndniggemann.on-rev.com/fog/
the file is "noFog.rev.zip"
Anyway have a look and tell us if it is what you had in mind.

regards
Bernd

Posted: **Fri Aug 27, 2010 2:07 am**

That is exactly the effect i need. And that is very close to how I started working on this problem. Where I run into problems using that method is after it is saved to a stand alone program. I cant figure out how to include the eraser tool into the stand alone.

Posted: **Fri Aug 27, 2010 7:50 am**

For the erase tool, see the "tool" property entry in the Rev Dictionary. You can also set the tool property with the "choose" command.

@Bernd: If they gave out awards here for generosity you'd be the top nominee. This must be the 50th time I've seen you craft an example stack for one of the posters here. That's really cool of you to take the time to be so helpful to so many. As they say here in California, Dude, you rock.

Posted: **Fri Aug 27, 2010 8:25 am**

magice,
when building the standalone choose to include brushes in the settings (and whatever else you need), it did not work when I let Rev choose automatically.

@ Richhard
Thank you. For me it is often easier to build a stack then to explain in detail.

regards
Bernd

Posted: **Fri Aug 27, 2010 6:11 pm**

You guys are the best. If I had thought to ask how to include the eraser tool 2 months ago I would have saved myself a lot of frustrarion. Now let me throw a monkey wrench into the scenario. This app is to be used with a a rear projection. So, the second "fogged" image needs to be inverted. Worst case scenario, I can invert the image before loading it. However this makes it harder for the user. Is there an easy way to inverted the image in the fogged window, as well as the fog.

Posted: **Fri Aug 27, 2010 6:25 pm**

Hi magice,

check the "ink" property of objects in the docs (Rev dictionary)
and experiment a bit to get used to them.

EDIT!
Looks like I eventually misunderstood "inverted" in your posting?
Maybe "flip horizontal" or "flip vertical" is what you need?
Check the docs for "flip"

Best

Klaus

Posted: **Fri Aug 27, 2010 9:07 pm**

Hi magice,
as Klaus pointed out the flipping is easy.

Suppose you flipped your images in the "inverted" stack,both of them and you wanted to use the approach I used transferring just the alphaData of the image the eraser works on you can do your "inverted" thing like this.
replace the code in the fog stack image "iWipe"

Code: Select all

   lock screen
   flip  image  "iFog" of card 1 of stack "fog" horizontal
   set the alphaData of image "iFog" of card 1 of stack "fog"  to the alphaData of image "iWipe" of stack "noFog" -- the old code
   flip  image  "iFog" of card 1 of stack "fog" horizontal
   unlock screen

replacing what I commented as old code. You have to flip twice to set the alphadata into the correct location. It slows down each cycle by about 50%. Depending on your computer it might be fast enough / or not.
See how it goes. On my machine it is acceptable, but noticeable. (for Richard who likes benchmarks

) old version about 80 milliseconds for the the transfer of the alphadata, 2-flip version 110-120 milliseconds.

Now let me throw a monkey wrench into the scenario

Any more monkey wrenches coming this way?

regards
Bernd

Posted: **Fri Aug 27, 2010 11:36 pm**

magice,
coming to think of it:
dont you set the beamer to rear projection, i.e. the beamer flips the projected image? That would eliminate all the hoopla of flipping the images.

regards
Bernd

Posted: **Sat Aug 28, 2010 2:30 am**

actually the more expensive ones do, however this program is to be used with a gaming table. It is made to project maps from below and this software is designed to reveal small parts of the map at a time (as players explore). I have designed and built this table with the intention of marketing them at role playing game cons. (Dragon con, comic con etc.). Since with any product it is in the best interest of the manufacturer to reduce manufacturing costs, i use a very inexpensive micro projector that does not have the ability to reverse the image. of course there are much more advanced software packages that can be purchased and used with the projection table, but I wanted to include something simple with literally no learning curve that people can pick up and start using right out of the box. thanks to you I think I will be able to pull off exactly what I am after.

Posted: **Sat Aug 28, 2010 10:37 am**

magice,

I see, so speed is not of a major concern to you and for your project the roughly 6 frames per second is ok.

good luck.

regards
Bernd

Posted: **Mon Aug 30, 2010 12:18 am**

magice,
I was unhappy about the speed so I benchmarked and tested again. As it turns out my clever idea to just set the alphaData slowed things down compared to setting the whole image. Saves on one flip too (15 msecs). Now it is a lot more fluid and should be ok on slower computers too. Just take your "fog" image and put it into the first stack on which you do the erasing. Set the blendlevel to what you like. name it "iWipe" as in the example, than replace the previous followMe script of the image:

Code: Select all

on followMe
   if the mouse is up then
      choose browser tool
      exit followMe
   end if
   lock screen
   put the mouseLoc into tNewLoc
   if tNewLoc <> sLastLoc then
      drag from sLastLoc to tNewLoc
      --put the milliseconds into tStart
   else
      click at tNewLoc
   end if
   set the text of image "iFog" of card 1 of stack "fog"  to the text of image "iWipe" of stack "noFog"
   flip  image  "iFog" of card 1 of stack "fog" horizontal
   unlock screen
   
   put tNewLoc into sLastLoc
   if "followMe" is not in the pendingMessages then
      send followMe to me in 5 milliseconds
   end if
end followMe

it now uses less then half the time it used to.
And I noticed if you start erasing in a part of the image that already has been erased the image does not get the mouseDown message because ther is nothing in the image that catches it.
I have put this script into the card of the "eraser" stack = noFog

Code: Select all

on mouseDown
   if the target contains "iOrig" then 
      send mouseDown to image "iWipe"
   else
      pass mouseDown
   end if
end mouseDown

this of course has to be adapted to the names you choose to give your images. It catches the mouseDowns that have not been processed, test whether the sender (target) was the image Below the iWipe image and sends a mouseDown to the iWipe image.
if you want the restore function to work you would have to enable the store buttons and save the images in unaltered state. I disabled those buttons since I tend to accidentally hit them...

I think this will improve the user experience a lot.
regard
Bernd

Posted: **Mon Aug 30, 2010 1:08 pm**

Thank you that is a big improvement. One more question though. I noticed that you saved the "fog" image as a custom property of the main stack. How did you do that? Normally in situations like that I have referenced external files and included them in the build. I like your way much better as there is no file that can accidentally be deleted.

Posted: **Mon Aug 30, 2010 1:46 pm**

magice,

I noticed that you saved the "fog" image as a custom property of the main stack. How did you do that?

Custom properties can come in handy in many situations. You create one by just saying:

Code: Select all

set the cCustomProperty of anyObjectOfChoice to the text of image NameOfImage

This creates the custom property on the fly. You can store anything in custom properties among other binary data like in images. They are saved with your stack and are persistent that way. In a standalone they would be read only since you can not save changes to standalones. In your case if the fog is always the same it would be very well feasible. Look at the script of the two greyed out buttons (disabled) they set the custom property to whatever the images look like at the moment.
code of button "bStoreFog"

Code: Select all

on mouseUp
   set the cFog of this card to the text of image "iFog"
end mouseUp

so I set a custom property of the card. But you can just as well set the custom property of a stack or substack. Just remember where you put it...

Normally in situations like that I have referenced external files and included them in the build

Watch out, you can not operate on externally referenced images like on not externally referenced images. E.g. the eraser will not work. The trick is to make the image "local" by issuing:

Code: Select all

set the imageData of myRefImage to the imageData of myRefImage

, looks funny but effectively makes a referenced image a local image. And with that you can do what you want.
You could also import the images via Menu File->Import As Control->Image File... This creates a local image that you can work on.
I hope this helps a little
regards
Bernd

Posted: **Wed Sep 01, 2010 8:40 am**

Ok I have been fighting with this for 2 days. I inserted the new script, and it is much faster. However now my fog is bright yellow. I have figured out that that is because the iWipe of the noFog stack is the same yellow when opaque. I also figured out that the iWipe gets it's color from the ciWipe custom property. So, I have been trying to change the ciWipe to black, but am having no luck. This is what I have been doing. I create a new image. I set the source to an all black 640x480 jpg file. This image is placed on the noFog stack and named iBlack. I create a button with the following script:

Code: Select all

on mouseUp
   set the ciWipe of this card to the text of image "iBlack"
end mouseUp

Unfortunately, what i get, is no more fog at all. I notice that on the custom properties cFog and ciWipe as you created them, the property contents shows a text interpretation of the image data. After running my script the property content is empty. This, I assume means that my image is not being copied into the custom properties. I am sure I am just making a noob mistake, but I can't figure out for the life of me what it is. Any ideas?

LiveCode Forums.

Is there an easier way?

Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?

Re: Is there an easier way?