Graal Forums - Image alpha, waitfor, and loops

Graal Forums (https://forums.graalonline.com/forums/index.php)

- NPC Scripting (https://forums.graalonline.com/forums/forumdisplay.php?f=8)

- - Image alpha, waitfor, and loops (https://forums.graalonline.com/forums/showthread.php?t=134257819)

scriptless

01-31-2010 01:10 AM

Image alpha, waitfor, and loops

Hello, I wanted to start off by explaining what I am trying to accomplish.

I wanted to make a similar effect to the xbox360/ps3 notification system. For those of you who use "ubuntu" you may notice it too, uses a similar effect called "NotifyOSD".

What I am doing here is drawing a polygon, and replacing it with an image. However, I wanted to use GUI's but had several problems. I could not make a semi-transparent black window appear. I was using GuiWindowCtrl, GuiControl, and GuiShowImgCtrl. No sucess, so I turned to polygons.

The problem I am having is that I need the polygon (or gui if anyone can help with that) to fade in/out. I am stumped why this code would not work seeing as it looks correct to me at first glance. Maybe anyone else might have an idea what I am doing wrong.

PHP Code:


		
			
//#CLIENTSIDE
function onCreated() {
  with (findimg(4002) ) {
    this.xy2 = {screenwidth-275,25};
    this.xy = {temp.poly[0]+50, temp.poly[1]+25};
    polygon = {this.xy2[0],this.xy2[1],this.xy2[0]+250,this.xy2[1],this.xy2[0]+250,this.xy2[1]+75,this.xy2[0],this.xy2[1]+75};
    layer = 4;
    red=green=blue=25;
  }
  changeimgcolors(4002,0,0,0,.5);
  with (findimg(4003)) {
    this.xy2 = {screenwidth-215,35};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    text = "scriptless has logged on";
    zoom = .7;
  }
  with (findimg(4004)) {
    this.xy2 = {screenwidth-260,45};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    image = "head1212.png";
    zoom = 1.5;
  }
  changeimgpart( 4004, 0, 64, 32, 32 );
  
  for ( i=0; i<1; i+= .01 ) {
    for ( j=4002; j<4005; j++ ) {
      with (findimg(4002)) { alpha = i/100; }
    }
    waitfor("", "noevent", 0.5);
  }
}

** Edit ***
I was unable to figure out how to change the polygons colors to black so i had to use a black image, stretch it and then change alpha. I know there must be an easier way but it just refused to work for me.
** end edit ***

Thank you in advanced,
scriptless

For solution click here.

ffcmike

01-31-2010 01:16 AM

Quote:

Originally Posted by scriptless (Post 1553312)

PHP Code:


		
			
//#CLIENTSIDE
function onCreated() {
  with (findimg(4002) ) {
    this.xy2 = {screenwidth-275,25};
    this.xy = {temp.poly[0]+50, temp.poly[1]+25};
    polygon = {this.xy2[0],this.xy2[1],this.xy2[0]+250,this.xy2[1],this.xy2[0]+250,this.xy2[1]+75,this.xy2[0],this.xy2[1]+75};
    layer = 4;
    red=green=blue=25;
  }
  changeimgcolors(4002,0,0,0,.5);
  with (findimg(4003)) {
    this.xy2 = {screenwidth-215,35};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    text = "scriptless has logged on";
    zoom = .7;
  }
  with (findimg(4004)) {
    this.xy2 = {screenwidth-260,45};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    image = "head1212.png";
    zoom = 1.5;
  }
  changeimgpart( 4004, 0, 64, 32, 32 );
  
  for ( i=0; i<1; i+= .01 ) {
    for ( j=4002; j<4005; j++ ) {
      with (findimg(4002)) { alpha = i/100; }
    }
    waitfor("", "noevent", 0.5);
  }
}

Thank you in advanced,
scriptless

I'm not sure but I would have thought that this. inside of with(){} would be referencing the provided object or in this case the image object instead of parent script variables, have you tried changing them all to thiso.?

Edit: Doesn't seem to the the case.

scriptless

01-31-2010 01:24 AM

You mean such as

PHP Code:


		
			
with() {
thiso.variable = value;
}

Yes, but only on the

PHP Code:


		
			
with(findimg(j)) { thiso.alpha = i/100; }

Sorry, did not fully explain problem properly. The images all show just fine, the problem is the alpha does not fade in/out, but rather instantly changes to that color. I have done this just last night the exact same way and it worked but using only a single poly (no second for loop). I wonder why it would not work now tho?

P.S. I am on testbed if anyone is curious.

ffcmike

01-31-2010 01:37 AM

Quote:

Originally Posted by scriptless (Post 1553315)

You mean such as

PHP Code:


		
			
with() {

thiso.variable = value;

}

Yes, but only on the

PHP Code:


		
			
with(findimg(j)) { thiso.alpha = i/100; }

Hm well the whole

PHP Code:


		
			
for ( j=4002; j<4005; j++ ) {

part does seem to be unnecessary, as it would always be setting alpha to the same i / 100 value each time.

Alpha also ranges from 0 to 1, so dividing i by 100 would be giving you a value no greater than 0.01, which is near if not invisible,
this loop is also one way only and only occuring when onCreated is called, when it would need to be running over an amount of time.

scriptless

01-31-2010 01:43 AM

The for loop for "j" is to loop through multiple things being drawn on-top of the polygon. I need 1 text, 1 image and the polygon to all fade at the same time. Looping "j" like that lets me set all the alpha on al lthe images to the same so they fade nice and neatly.

As for the i/100. Are you sure? I mean I did it last night, it worked so im confused.

PHP Code:


		
			
Example:
50 / 100 = 50% (0.50)
0 / 100 = 0% (0.00)
100 / 0 = Cannot divide by zero

How do you get I would only have a value of .01 at most? Like I said, it works almost flawlessly. My only problem is it jumps to (i think the minumum) value in the foor loop, and does not increase as the loop increases.

** EDIT
sorry did not notice I had "+= .01", however, this does not solve the problem.

PHP Code:


		
			
//#CLIENTSIDE
function onCreated() {
  with (findimg(4002) ) {
    this.xy2 = {screenwidth-275,25};
    polygon = {this.xy2[0],this.xy2[1],this.xy2[0]+250,this.xy2[1],this.xy2[0]+250,this.xy2[1]+75,this.xy2[0],this.xy2[1]+75};
    layer = 4;
    red=green=blue=25;
  }
  changeimgcolors(4002,0,0,0,.5);
  with (findimg(4003)) {
    this.xy2 = {screenwidth-215,35};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    text = "scriptless has logged on";
    zoom = .7;
  }
  with (findimg(4004)) {
    this.xy2 = {screenwidth-260,45};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    image = "head1212.png";
    zoom = 1.5;
  }
  changeimgpart( 4004, 0, 64, 32, 32 );
  
  for ( i=0; i<1; i+= 0.01) {
    for ( j=4002; j<4005; j++ ) {
      with (findimg(4002)) { alpha = i; }
    }
    waitfor("", "noevent", .1);
    player.chat = i;
  }
}

This seems to make the image invisable. So wither .1 is tooo fast or its not working and seeing how I did test the speed. That is not the problem, tho setting the i=0; i<1; i+= 0.01; seems to effect it if i change i=0 to i=.25; i<.75;

And again, no fade in/out effect, just a alpha that sits there unchanged.

ffcmike

01-31-2010 01:52 AM

Quote:

Originally Posted by scriptless (Post 1553318)

PHP Code:


		
			
Example:

50 / 100 = 50% (0.50)

0 / 100 = 0% (0.00)

100 / 0 = Cannot divide by zero

With

PHP Code:


		
			
for ( i=0; i<1; i+= .01 ) {

"i" would never be greater than 0.99, 0.99 divided by 100 is 0.0099, which is barely anything.

I think you may have been trying to do:

PHP Code:


		
			
with (findimg(j)) { alpha = i/100; }

In order to adjust the Alpha of all the displays at once.

scriptless

01-31-2010 01:56 AM

Yes, to adjust all alpha at once. And thank you for pointing that flaw out but why does it still not work?

Ahh.. and yes findimg(4002)) {} should have been "j" but i used 4002 for easier testing so i could comment j completly out and see if it worked by itself, nope. I know this is possible why is it being so hard right now? I know im not drunk or on drugs so what I am seeing happening is reality.

Might be worth mentioning that when I do player.chat = i; player chat becomes "6" instantly and does not move at all, no sleep() or waitfor() or even schedualedevent() seems to make a difference. Let me try temp.i, maybe?

Okay, thank you for your help. Got it working.

PHP Code:


		
			
//#CLIENTSIDE
function onCreated() {
  with (findimg(4002) ) {
    this.xy2 = {screenwidth-275,25};
    this.xy = {temp.poly[0]+50, temp.poly[1]+25};
    polygon = {this.xy2[0],this.xy2[1],this.xy2[0]+250,this.xy2[1],this.xy2[0]+250,this.xy2[1]+75,this.xy2[0],this.xy2[1]+75};
    layer = 4;
    red=green=blue=25;
  }
  changeimgcolors(4002,0,0,0,.5);
  with (findimg(4003)) {
    this.xy2 = {screenwidth-215,35};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    text = "scriptless has logged on";
    zoom = .7;
  }
  with (findimg(4004)) {
    this.xy2 = {screenwidth-260,45};
    x=this.xy2[0];
    y=this.xy2[1];
    layer = 5;
    image = "head1212.png";
    zoom = 1.5;
  }
  changeimgpart( 4004, 0, 64, 32, 32 );
  
  for ( temp.i=0; temp.i<.60; temp.i += 0.02) {
    for ( j=4002; j<4005; j++ ) {
      with (findimg(j)) { alpha = temp.i; }
    }
    waitfor("", "noevent", 0.05);
    player.chat = temp.i;
  }
}

DustyPorViva

01-31-2010 02:00 AM

Change the mode of the images to 1.

scriptless

01-31-2010 02:04 AM

Quote:

Originally Posted by DustyPorViva (Post 1553326)

Change the mode of the images to 1.

Images including the poly? And dusty, would you happen to know how to draw this using gui's? I have been to the graal bible (much help on gui's) but it just lacks examples. I think the graal bible could be a much more powerfull tool if it were to include more examples. But untill that happens the forums are a nice place to look and I notice you post alot of usefull information dusty.

DustyPorViva

01-31-2010 02:15 AM

Yup. Default images are set to mode 0, which is a light effect. This MAY mean that it won't be properly transparent unless ALL values(red, green, blue) are lowered along with the alpha. Setting it to mode 1 will not only make it properly transparent, but may also fix the problem you're having. It would also explain why you can't use a black polygon, as black for these light effects = transparency mask.

PHP Code:


		
			
function onCreated() {
  with (findimg(200)) {
    // CREATE A BLACK POLYGON AT 0% TRANSPARENCY
    polygon = {0,0,5,0,5,5,0,5};
    mode = 1;
    red = green = blue = 0;
    alpha = 1;
  }
  // FADE IT OUT
  for (temp.i=1;i>0;i-=.1) {
    with (findimg(200)) alpha = i;
    waitfor("", "noevent", 0.05);
  } 
  // FINALIZE BY SETTING IT TO 0 AFTER LOOP AS FAILSAFE
  findimg(200).alpha = 0; 
}

Something like that should work, however I'm not familiar with waitfor so that could possible be causing problems, I'm not sure.

Also, I found: http://wiki.graal.net/index.php/Crea...iControls_List
to have pretty great examples. If you still need help with GUI's though I could post an example.

scriptless

01-31-2010 02:17 AM

Yes, I do need help. I read that profile's can use fillcolor(r,g,b,a); but no clue how to apply that in pratice. I wanted thought, why not GuiControll, use it's own profile, set it to black, and add alpha but that aparently was beyond my comprehension because I failed misarably. Not only that but gui's when closed seem to not reopen for me O_O when I update my script, I think theres a command to show it again tho?

Something else I was looking for was is there a way to use ("-PlayerList") to get information about who just logged in? If not, I guess a simple onActionPlayerOnline() would work but then it has to alert all people. Then my idea was to check if "isBuddy()" and if so, show a notification very much like how the xbox360 and ps3 currently do. I have it set to 2.5 seconds before it fades out might change it to 3 if needed. Will post a video as soon as I figure out just how graal's built-in video works :o

Also I swear I tried that red=green=blue=0; before with no luck but im 100% sure it should have worked. Maybe my pc was bugged. Also, I am running Ubuntu 9.10 since windows crashed on me and I had literally no other cds to install from :(

DustyPorViva

01-31-2010 02:54 AM

I believe it's something like:

new guistuff("test") {
useownprofile = true;
profile.opaque = false;
profile.fillcolor = {255,255,255,255/2}; // GUI's use 0-255 scale for colors
}

test.show(); // will make the gui come back into view.
test.hide(); // will hide it

scriptless

01-31-2010 01:52 PM

Quote:

Originally Posted by DustyPorViva (Post 1553341)

Still did not fill the gui. And I used "GuiControl" instead of "guistuff" because im not sure if "guistuff" would even be valid?? ANd how would "255/2" work? I thought alpha worked on a percentage scale using 0 to 1 and decimals in between?

DustyPorViva

01-31-2010 02:53 PM

Try profile.opaque = false; then

And like the comment says, GUI's use the 0-255 format instead of 0-1. Thus, 255/2 = 50% = .5.

scriptless

01-31-2010 10:57 PM

Quote:

Originally Posted by DustyPorViva (Post 1553379)

Try profile.opaque = false; then

And like the comment says, GUI's use the 0-255 format instead of 0-1. Thus, 255/2 = 50% = .5.

I did try that, and no luck.

cbk1994

01-31-2010 11:04 PM

Quote:

Originally Posted by DustyPorViva (Post 1553379)

Try profile.opaque = false; then

And like the comment says, GUI's use the 0-255 format instead of 0-1. Thus, 255/2 = 50% = .5.

opaque should be true.

scriptless

02-01-2010 12:08 AM

Quote:

Originally Posted by cbk1994 (Post 1553450)

opaque should be true.

Thank's that seemed to work. Why must it be set to true tho? I thought it was the other way around or am I just mis-interpreting what "opaque" actually means?

cbk1994

02-01-2010 01:20 AM

Quote:

Originally Posted by scriptless (Post 1553473)

Thank's that seemed to work. Why must it be set to true tho? I thought it was the other way around or am I just mis-interpreting what "opaque" actually means?

From what I understand "opaque" means to use the fill color defined in the profile rather than the one in the bitmap. It works like this with scrolls and other containers as well.

All times are GMT +2. The time now is 10:32 PM.