Graal Forums
Page 1 of 2 1 2
Show 40 post(s) from this thread on one page

Graal Forums (https://forums.graalonline.com/forums/index.php)
-   NPC Scripting (https://forums.graalonline.com/forums/forumdisplay.php?f=8)
-   -   textdraw fade in screencenter (https://forums.graalonline.com/forums/showthread.php?t=134269878)

Elk 02-24-2015 07:49 AM
textdraw fade in screencenter
 
Okay so I tried making a script that would fade in a text only once if you entered the specified area and after a short while it would automatically fade out without fading in again unless you enter the specified field again, but I guess its too much for me >_<

Could someone help me? I'm really bad with timeout stuff x.x

HTML Code:
//#CLIENTSIDE
function onCreated(){
  dontblock();
  layer = 2;
  onTimeout();
}
function onTimeout(){
  onCheckScreen();
  setTimer(.05);
}
function onCheckScreen() {
  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
    temp.fimg = findimg(375);
    fimg.x = screenwidth / 2;
    fimg.y = screenheight / 2 - 180;
    fimg.text = "Fancy Text Here";
    fimg.layer = 8;
    fimg.zoom = 2;
    fimg.style = "bc";
    fimg.textshadow = true;
    fimg.shadowcolor = {0,0,0};
  }
  else hideimg(375);
}

Restraint 02-26-2015 03:36 PM
Off the top of my head:

You didn't do anything to "fade" it in and "fade" it out as you suggested. The way to do that would be:

>Create the text onCreated, set its alpha to 0 default. Assign it to "this.img"
>Inside a timeout loop:
>>If the player is inside, increase its alpha gradually to 1. This can be done as follows:
PHP Code:
this.img.alpha = min(this.img.alpha + 0.1, 1); 
>>If the player is outside, decrease it gradually to 0 as follows:
PHP Code:
this.img.alpha = max(this.img.alpha - 0.1, 0); 
>>>Note: I am using +/- 0.1 as a placeholder, obviously.

Additionally: I've never created text using that method, so I can't speak to its effectiveness. Is there any reason you skipped the more obvious showText() function?

showText(index, x, y, font, style, text); (??? - may have mixed up the last 3 arg's order)

Can still do something like:

PHP Code:
temp.img = this.img = showText(...);
img.layer = 8; // or changeImgVis(index, 8) // any number over 4 is likely overkill
img.zoom = 2;
etc; 
Final thought: If you aren't using image indices 200 through 374 in that code, you might as well just use index 200. NPC's each have their own, local, image indices (as long as you're 200 or higher).

xAndrewx 02-26-2015 03:52 PM
I personally don't think you can use alpha on text. If you convert the text to an image, you could do this. If it works with text, great. I'm sure it won't though...

HTML Code:
//#CLIENTSIDE
function onCreated(){
  this.dontblock();

  //So I set the image at the start - no need to keep re-drawing it.
  this.fimg = findimg(200);
  with(this.fimg) {
    x = screenwidth / 2;
    y = screenheight / 2 - 180;
    image = "block.png";
    alpha = 0;
    layer = 4;
    zoom = 2;
  }
  this.onTimeout();
}

function onPlayerEnters() {
  this.onCreated();
}

function onTimeout(){
  this.onCheckScreen();
  setTimer(0.05);
}

function onCheckScreen() {
  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
      //If the image alpha is less than one, increase it gradually.
    if (this.fimg.alpha < 1)
      this.fimg.alpha += 0.05;
  } else {
      //If they're not in the area and the alpha is greater than 0, decrease it gradually.
    if (this.fimg.alpha > 0)
      this.fimg.alpha -= 0.05;
  }
}

Elk 02-27-2015 12:50 AM
Quote:
Originally Posted by xAndrewx (Post 1735069)
I personally don't think you can use alpha on text. If you convert the text to an image, you could do this. If it works with text, great. I'm sure it won't though...

HTML Code:
//#CLIENTSIDE
function onCreated(){
  this.dontblock();

  //So I set the image at the start - no need to keep re-drawing it.
  this.fimg = findimg(200);
  with(this.fimg) {
    x = screenwidth / 2;
    y = screenheight / 2 - 180;
    image = "block.png";
    alpha = 0;
    layer = 4;
    zoom = 2;
  }
  this.onTimeout();
}

function onPlayerEnters() {
  this.onCreated();
}

function onTimeout(){
  this.onCheckScreen();
  setTimer(0.05);
}

function onCheckScreen() {
  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
      //If the image alpha is less than one, increase it gradually.
    if (this.fimg.alpha < 1)
      this.fimg.alpha += 0.05;
  } else {
      //If they're not in the area and the alpha is greater than 0, decrease it gradually.
    if (this.fimg.alpha > 0)
      this.fimg.alpha -= 0.05;
  }
}
Thats the exact script im using for my transitional things, i would use it but i dont know of a way to have it fade out after a while and not being called again

i dont want the alpha to be 1 constantly while in the area, it has to just trigger once and fade out until the entire area is touched again basically


the above method works with this.chat but i havent figured out a way to do it with findimg in combination with alpha

Elk 02-27-2015 02:02 AM
Made a GIF of how I'd want it to be :0

https://dl.dropboxusercontent.com/u/...rt/elknoob.gif

khortez 02-27-2015 03:37 AM
Quote:
Originally Posted by xAndrewx (Post 1735069)
I personally don't think you can use alpha on text. If you convert the text to an image, you could do this. If it works with text, great. I'm sure it won't though...

HTML Code:
//#CLIENTSIDE
function onCreated(){
  this.dontblock();

  //So I set the image at the start - no need to keep re-drawing it.
  this.fimg = findimg(200);
  with(this.fimg) {
    x = screenwidth / 2;
    y = screenheight / 2 - 180;
    image = "block.png";
    alpha = 0;
    layer = 4;
    zoom = 2;
  }
  this.onTimeout();
}

function onPlayerEnters() {
  this.onCreated();
}

function onTimeout(){
  this.onCheckScreen();
  setTimer(0.05);
}

function onCheckScreen() {
  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
      //If the image alpha is less than one, increase it gradually.
    if (this.fimg.alpha < 1)
      this.fimg.alpha += 0.05;
  } else {
      //If they're not in the area and the alpha is greater than 0, decrease it gradually.
    if (this.fimg.alpha > 0)
      this.fimg.alpha -= 0.05;
  }
}
you can use alpha on text, i have a mini system on testbed that uses alpha to fade in/fade out for it

Elk 02-27-2015 03:52 AM
changeimgcolors(); seems to be able to affect its transparency, but i still dont get how to make it occur only once like in the pic :<

Restraint 02-27-2015 03:57 AM
Quote:
Originally Posted by khortez (Post 1735083)
you can use alpha on text, i have a mini system on testbed that uses alpha to fade in/fade out for it
Also 100% certain. I've done it before on UN way back in GS1 and the script is still around to this date.

Enter a city on UN for the first time and you'll see a message the top, "Welcome to <Town>!" - it fades in and fades out.

Elk 02-27-2015 04:04 AM
im guessing its just onPlayerEnters though :S

im trying to get it to be more specified for a defined x/y area, hence playerxy in xy

Restraint 02-27-2015 04:22 AM
Quote:
Originally Posted by Elk (Post 1735087)
im guessing its just onPlayerEnters though :S

im trying to get it to be more specified for a defined x/y area, hence playerxy in xy
On UN it's also an X/Y box around the warp-in zone.

You want it to fade in when they enter the space and then fade out on its own, and then not re-fade in until they've EXITED the space and subsequently RE-ENTERED the space. Is that what you're saying?

In that case, you simply set a flag when they enter and unset it when they exit. If the flag is false, make it show the text. If it's true, don't show the text.

You'd still create the text under onCreated and initialize it with an alpha of 0. Then you'd simple do:

PHP Code:
function onTimeOut() {
 checkArea();
 setTimer(0.05);
}
function checkArea() {
 if (/* player in area stuff */) {
  if (!this.showed) { // If the image hasn't been displayed since their last entrance
   this.showed = true; // Flag it as displayed
   onFadeIn(); // Start fading in
  }
 } else {
  if (this.showed) { // If it was displayed already
   this.showed = false; // Unset it, since they're no longer inside
  }
 }
}
function onFadeIn() {
 if (/* player in area stuff */) {
  this.img.alpha += 0.05; // 0.05 is a placeholder, it will take num * 20 seconds to fully fade in, so @ 0.05 it will take 1 second
  if (this.img.alpha < 1) { // If it isn't fully visible yet
   scheduleEvent(0.05, temp.name, nil); // THIS 0.05 is not a placeholder, it is the tick rate of graal - this will "loop" the fade in
  } else {
   onPause(3); // '3' is up to you, it's how long it will appear to "hang," this creates the "pausing"
  }
 } else {
  onFadeOut(); // If the player left the area, stop fading in and start fading out instead
 }
}
function onPause(timeLeft) {
 if (/* Player in area stuff */) {
  if (timeLeft > 0) {
   scheduleEvent(0.05, temp.name, timeLeft - 0.05); // Keep counting down if the player is inside and there's time left to pause.
  } else {
   onFadeOut(); // Once time runs out, fade out
  }
 } else {
  onFadeOut(); // If player isn't still in area, pre-maturely fade out.
 }
}
function onFadeOut() {
 if (/* NOT player in area */) {
  this.img.alpha -= 0.05; // Lower the alpha back down, remember: this 0.05 is a placeholder
  if (this.img.alpha > 0) { // While it's not 0 yet
   scheduleEvent(0.05, temp.name, nil); // Keep looping to decrease it
  }
 } // No need to put an else {} here to check if they re-enter the area. If they re-enter the area, this will fail and onFadeIn() will be called by checkArea()
} 
I haven't tested it, but that's roughly what you're going for, assuming I handled your fringe cases correctly (ie, what you want to happen when the player rapidly enters/exits the area and such like that). There are other ways of doing it if you don't want it to prematurely begin fading out if they exit too soon (ie, you remove onPause() and just change it to a scheduleEvent(3, "fadeOut", nil) call). There are various ways of handling those fringe cases, but this seemed like the most aesthetically appealing at a glance.

EDIT: And if you only want it to happen once EVER then simply don't unset the flag (as I did via the line "this.showed = false;" inside checkArea()). In that scenario you probably don't want the text fading prematurely, even if they walk away from the area, and so you'd do my suggestion in the last paragraph (vis-a-vis removing onPause and changing it to scheduleEvent(3, "fadeOut", nil); )

Elk 02-27-2015 04:58 AM
Gonna try it

is this the correct negation of player xy in xy?

HTML Code:
if (player.x !in |this.x-10,this.x+10| && player.y !in |this.y-5,this.y+5|) {

cbk1994 02-27-2015 05:43 AM
Quote:
Originally Posted by Elk (Post 1735089)
Gonna try it

is this the correct negation of player xy in xy?

HTML Code:
if (player.x !in |this.x-10,this.x+10| && player.y !in |this.y-5,this.y+5|) {
You can't negate in like that, try:

PHP Code:
if (!(player.x in |this.x-10, this.x+10| && player.y in |this.y-5, this.y+5|)) { 
(If you could, you'd probably want to use || instead of && by De Morgan's laws. Unless I'm misinterpreting what you're trying to do.)

Elk 02-27-2015 06:46 AM
Quote:
Originally Posted by cbk1994 (Post 1735091)
(If you could, you'd probably want to use || instead of && by De Morgan's laws. Unless I'm misinterpreting what you're trying to do.)
|| = or
&& = and

player.x != player.y 8-D

Ok now I tried this, but it isnt fading in nor fading out, just permanently onscreen

PHP Code:
//#CLIENTSIDE
function onCreated(){
  dontblock();
  layer = 2;
  temp.fimg = findimg(375);
  fimg.x = screenwidth / 2;
  fimg.y = screenheight / 2 - 180;
  fimg.text = "Era Underground Complex Level 2";
  fimg.layer = 8;
  fimg.zoom = 2;
  fimg.style = "bc";
  fimg.textshadow = true;
  fimg.shadowcolor = {0,0,0};
}
function onTimeOut() {
  checkArea();
  setTimer(0.05);
}
function checkArea() {
  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
    if (!this.showed) { // If the image hasn't been displayed since their last entrance
      this.showed = true; // Flag it as displayed
      onFadeIn(); // Start fading in
    }
  } else {
    if (this.showed) { // If it was displayed already
      this.showed = false; // Unset it, since they're no longer inside
    }
  }
}
function onFadeIn() {
  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
    this.img.alpha += 0.05; // 0.05 is a placeholder, it will take num * 20 seconds to fully fade in, so @ 0.05 it will take 1 second
    if (this.img.alpha < 1) { // If it isn't fully visible yet
      scheduleEvent(0.05, temp.name, nil); // THIS 0.05 is not a placeholder, it is the tick rate of graal - this will "loop" the fade in
    } else {
      onPause(3); // '3' is up to you, it's how long it will appear to "hang," this creates the "pausing"
    }
  } else {
    onFadeOut(); // If the player left the area, stop fading in and start fading out instead
  }
}
function onPause(timeLeft) {
  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
    if (timeLeft > 0) {
      scheduleEvent(0.05, temp.name, timeLeft - 0.05); // Keep counting down if the player is inside and there's time left to pause.
    } else {
      onFadeOut(); // Once time runs out, fade out
    }
  } else {
    onFadeOut(); // If player isn't still in area, pre-maturely fade out.
  }
}
function onFadeOut() {
  if (!(player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|)) {
    this.img.alpha -= 0.05; // Lower the alpha back down, remember: this 0.05 is a placeholder
    if (this.img.alpha > 0) { // While it's not 0 yet
      scheduleEvent(0.05, temp.name, nil); // Keep looping to decrease it
    }
  } // No need to put an else {} here to check if they re-enter the area. If they re-enter the area, this will fail and onFadeIn() will be called by checkArea()
} 

xAndrewx 02-27-2015 03:29 PM
Here ya go

HTML Code:
//#CLIENTSIDE
function onCreated(){
  dontblock();
  layer = 2;
  this.fimg = findimg(200);
  this.fimg.x = screenwidth / 2;
  this.fimg.y = screenheight / 2 - 180;
  this.fimg.text = "Era Underground Complex Level 2";
  this.fimg.layer = 4;
  this.fimg.zoom = 2;
  this.fimg.style = "bc";
  this.fimg.textshadow = true;
  this.fimg.shadowcolor = {0,0,0};
  this.fimg.red = 1;
  this.fimg.green = 0;
  this.fimg.blue = 0;
  this.fimg.alpha = 0;
  setTimer(0.05);
}

function onPlayerEnters() {
  this.onCreated();
}

function onTimeout(){

  if (player.x in |this.x-10,this.x+10| && player.y in |this.y-5,this.y+5|) {
    if (this.text_display == null)
      this.text_display = timevar2 + 5;
  } else {
    this.text_display = null;
  }

  if (this.text_display > timevar2) {
    if (this.fimg.alpha < 1) {
      this.fimg.alpha += 0.05;
    }
  } else {
    if (this.fimg.alpha > 0) {
      this.fimg.alpha -= 0.05;
    }
  }
  setTimer(0.05);
}

Crow 02-27-2015 04:24 PM
Quote:
Originally Posted by xAndrewx (Post 1735069)
I personally don't think you can use alpha on text.
Why would you not be able to do that :oo:


All times are GMT +2. The time now is 11:07 PM.
Page 1 of 2 1 2
Show 40 post(s) from this thread on one page

Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2024, vBulletin Solutions Inc.
Copyright (C) 1998-2019 Toonslab All Rights Reserved.