Ticket #2395: colorFadeImprovements_v2.patch

File colorFadeImprovements_v2.patch, 11.7 KB (added by Michael, 10 years ago)

Changes suggested by alpha123.

  • binaries/data/mods/public/gui/common/colorFades.js

     
    11/*
    2     DESCRIPTION : Some functions to make colour fades on GUI elements (f.e. used for hero and group icons)
     2    DESCRIPTION : Some functions to make color fades on GUI elements (f.e. used for hero and group icons)
    33    NOTES       :
    44*/
    55
    6 // Used for storing object names of running color fades in order to stop them, if the fade is restarted before the old ended
    7 var g_colorFade = {};
    8 g_colorFade["id"] = {};
    9 g_colorFade["tick"] = {};
     6// Used for storing information about color fades
     7var g_colorFade = {};
    108
    119/**
    12  * starts fading a colour of a GUI object using the sprite argument
    13  * name: name of the object which colour should be faded
    14  * changeInterval: interval in ms when the next colour change should be made
    15  * duration: maximal duration of the complete fade
    16  * colour: RGB + opacity object with keys r,g,b and o
     10 * returns the init RGB color setting
     11 */
     12function getInitColorFadeRGB()
     13{
     14    var rgb = {"r": 0, "g": 0, "b": 0, "o": 100};
     15    return rgb;
     16}
     17
     18/**
     19 * starts fading a color of a GUI object using the sprite argument
     20 * name: name of the object which color should be faded
     21 * tickInterval: interval in ms when the next color change should be made
     22 * duration: maximal duration of the complete fade (if 0 it runs until it is stopped)
    1723 * fun_colorTransform: function which transform the colors;
    18  *                    arguments: [colour object, tickCounter]
     24 *                     arguments: [var data]
     25 * restartAble [optional: if false, the fade can not be restarted; default: true
    1926 * fun_smoothRestart [optional]: a function, which returns a smooth tick counter, if the fade should be started;
    20  *                              arguments: [tickCounter of current fade; not smaller than 1 or it restarts at 0] returns: smooth tick counter value
    21  * tickCounter [optional]: should not be set by hand! - how often the function was called recursively
     27 *                               arguments: [var data]; must return false, if smooth restart was not possible and true, if it was ok
    2228 */
    23 function fadeColour(name, changeInterval, duration, colour, fun_colorTransform, fun_smoothRestart, tickCounter)
     29function startColorFade(name, tickInterval, duration, fun_colorTransform, restartAble, fun_smoothRestart)
    2430{
    2531    // get the overlay
    2632    var overlay = Engine.GetGUIObjectByName(name);
     
    2834        return;
    2935
    3036    // check, if fade overlay was started just now
    31     if (!tickCounter)
     37    if (!isColorFadeRunning(name))
    3238    {
    33         tickCounter = 1;
    3439        overlay.hidden = false;
    35                    
    36         // check, if another animation is running and restart it, if it's the case
    37         if (isColourFadeRunning(name))
    38         {
    39             restartColourFade(name, changeInterval, duration, colour, fun_colorTransform, fun_smoothRestart, g_colorFade.tick[name]);
    40             return;
    41         }
     40        // store the values into a var to make it more flexible (can be changed from every function)
     41        var data = {    "timerId": -1,
     42                        "tickInterval": tickInterval,
     43                        "duration": duration,
     44                        "fun_colorTransform": fun_colorTransform,
     45                        "restartAble": restartAble || restartAble === undefined, //TODO: add default parameter when it is supported (spiderMonkey upgrade #1886)
     46                        "fun_smoothRestart": fun_smoothRestart,
     47                        "tickCounter": 0,
     48                        "justStopAtExternCall": duration == 0,
     49                        "stopFade": false,
     50                        "rgb": getInitColorFadeRGB()
     51                    };
     52        // store it!
     53        g_colorFade[name] = data;
     54
     55        // start with fading
     56        fadeColorTick(name);
    4257    }
     58    else if (restartAble)
     59    {
     60        restartColorFade(name, tickInterval, duration, fun_colorTransform, restartAble, fun_smoothRestart);
     61        return;
     62    }
     63}
     64
     65/**
     66 * makes the color changes in a tick
     67 * name: name of the object which color should be faded
     68 */
     69function fadeColorTick(name)
     70{
     71    // make some checks
     72    if (!isColorFadeRunning(name))
     73        return;
     74       
     75    var overlay = Engine.GetGUIObjectByName(name);
     76    if (!overlay)
     77        return;
     78    var data = g_colorFade[name];
     79       
     80    // change the color
     81    data.fun_colorTransform(data);
    4382   
    44     // get colors
    45     fun_colorTransform(colour, tickCounter);
    46    
    47     // set new colour
    48     overlay.sprite="colour: "+colour.r+" "+colour.g+" "+colour.b+" "+colour.o;
     83    // set new color
     84    var rgb = data.rgb;
     85    overlay.sprite="colour: " + rgb.r + " " + rgb.g + " " + rgb.b + " " + rgb.o;
    4986
    5087    // recusive call, if duration is positive
    51     duration-= changeInterval;
    52     if (duration > 0 && colour.o > 0)
     88    if (!data.stopFade && (data.justStopAtExternCall || data.duration - (data.tickInterval * data.tickCounter) > 0))
    5389    {
    54         var id = setTimeout(function() { fadeColour(name, changeInterval, duration, colour, fun_colorTransform, fun_smoothRestart, ++tickCounter); }, changeInterval);
    55         g_colorFade.id[name] = id;
    56         g_colorFade.tick[name] = tickCounter;
     90        var id = setTimeout(function() { fadeColorTick(name); }, data.tickInterval);
     91        data.timerId = id;
     92        data.tickCounter++;
    5793    }
    5894    else
    5995    {
    6096        overlay.hidden = true;
    61         stopColourFade(name);
     97        stopColorFade(name);
    6298    }
    6399}
    64100
    65 
    66101/**
    67  * checks, if a colour fade on that object is running
    68  * name: name of the object which colour fade should be checked
     102 * checks, if a color fade on that object is running
     103 * name: name of the object which color fade should be checked
    69104 * return: true a running fade was found
    70105 */
    71 function isColourFadeRunning(name)
     106function isColorFadeRunning(name)
    72107{
    73     return name in g_colorFade.id;
     108    return name in g_colorFade;
    74109}
    75110
    76111/**
    77  * stops fading a colour
    78  * name: name of the object which colour fade should be stopped
    79  * hideOverlay: hides the overlay, if true
     112 * stops fading a color
     113 * name: name of the object which color fade should be stopped
     114 * hideOverlay [optional]: hides the overlay, if true [default: true]
    80115 * return: true a running fade was stopped
    81116 */
    82 function stopColourFade(name, hideOverlay)
     117function stopColorFade(name, hideOverlay)
    83118{
    84     // check, if a colour fade is running
    85     if (!isColourFadeRunning(name))
     119    // check, if a color fade is running
     120    if (!isColorFadeRunning(name))
    86121        return false;
    87122
    88123    // delete the timer
    89     clearTimeout(g_colorFade.id[name]);
    90     delete g_colorFade.id[name];
    91     delete g_colorFade.tick[name];
    92    
     124    clearTimeout(g_colorFade[name].timerId);
     125    delete g_colorFade[name];
     126
    93127    // get the overlay and hide it
    94     if (hideOverlay)
     128    if (hideOverlay || hideOverlay === undefined)  //TODO: add default parameter when it is supported (spiderMonkey upgrade #1886)
    95129    {
    96130        var overlay = Engine.GetGUIObjectByName(name);
    97         if(overlay)
     131        if (overlay)
    98132            overlay.hidden = true;
    99133    }
    100134    return true;
     
    101135}
    102136
    103137/**
    104  * restarts a colour fade
    105  * see paramter in fadeColour function
     138 * restarts a color fade
     139 * see paramter in startColorFade function
    106140 */
    107 function restartColourFade(name, changeInterval, duration, colour, fun_colorTransform, fun_smoothRestart, tickCounter)
     141function restartColorFade(name)
    108142{
    109     // check, if a colour fade is running
    110     if (!isColourFadeRunning(name))
     143    // check, if a color fade is running
     144    if (!isColorFadeRunning(name))
    111145        return false;
    112146   
     147    var data = g_colorFade[name];
    113148    // check, if fade can be restarted smoothly
    114     if (fun_smoothRestart)
     149    if (data.fun_smoothRestart)
    115150    {
    116         tickCounter = fun_smoothRestart(colour, tickCounter);
    117         // set new function to existing timer
    118         var fun = function() { fadeColour(name, changeInterval, duration, colour, fun_colorTransform, fun_smoothRestart, tickCounter); };
    119         setNewTimerFunction(g_colorFade.id[name], fun);
     151        // if call was too late
     152        if (!data.fun_smoothRestart(data))
     153        {
     154            data.rgb = getInitColorFadeRGB(); // set RGB start values
     155            data.tickCounter = 0;
     156        }
    120157    }
    121158    // stop it and restart it
    122159    else
    123160    {
    124         stopColourFade(name, true);
    125         fadeColour(name, changeInterval, duration, colour, fun_colorTransform);
     161        stopColorFade(name, false);
     162        startColorFade(name, data.changeInterval, data.duration, data.fun_colorTransform, data.restartAble, data.fun_smoothRestart);
    126163    }
    127164    return true;
    128165}
     
    133170
    134171var g_fadeAttackUnit = {};
    135172g_fadeAttackUnit.blinkingTicks = 50; // how many ticks should first blinking phase be
    136 g_fadeAttackUnit.blinkingChangeInterval = 5; // how often should the colour be changed during the blinking phase
    137 g_fadeAttackUnit.gbColourChangeRate = 3; // how fast should blue and green part of the colour change
     173g_fadeAttackUnit.blinkingChangeInterval = 5; // how often should the color be changed during the blinking phase
     174g_fadeAttackUnit.gbcolorChangeRate = 3; // how fast should blue and green part of the color change
    138175g_fadeAttackUnit.fadeOutStart = 100; // when should the fade out start using the opacity
    139176g_fadeAttackUnit.opacityChangeRate = 3; // how fast should opacity change
    140177
    141 /**
    142  * rgb: colour object with keys r,g,b and o
    143  * tickCounter: how often the fade was executed
    144  */
    145 function colourFade_attackUnit(rgb, tickCounter)
     178function colorFade_attackUnit(data)
    146179{
     180    var rgb = data.rgb;
     181   
     182    // init color
     183    if (data.tickCounter == 0)
     184        rgb.r = 175;
    147185    // blinking
    148     if (tickCounter < g_fadeAttackUnit.blinkingTicks)
     186    if (data.tickCounter < g_fadeAttackUnit.blinkingTicks)
    149187    {
    150188        // slow that process down
    151         if (tickCounter % g_fadeAttackUnit.blinkingChangeInterval != 0)
     189        if (data.tickCounter % g_fadeAttackUnit.blinkingChangeInterval != 0)
    152190            return;
    153191           
    154         rgb.g = rgb.g == 0 ? 255 : rgb.g = 0;
    155         rgb.b = rgb.b == 0 ? 255 : rgb.b = 0;
     192        rgb.g = rgb.g == 0 ? 255 : 0;
    156193    }
    157     // wait a short time and then colour fade from red to grey to nothing
    158     else if ( tickCounter >= g_fadeAttackUnit.blinkingTicks + g_fadeAttackUnit.blinkingChangeInterval)
     194    // wait a short time and then color fade from red to grey to nothing
     195    else if ( data.tickCounter >= g_fadeAttackUnit.blinkingTicks + g_fadeAttackUnit.blinkingChangeInterval)
    159196    {
    160         rgb.g = rgb.g < 255 ? rgb.g += g_fadeAttackUnit.gbColourChangeRate * Math.sqrt(tickCounter - g_fadeAttackUnit.blinkingTicks) : 255;
    161         rgb.b = rgb.g;
     197        rgb.g = rgb.g < 255 ? rgb.g += g_fadeAttackUnit.gbcolorChangeRate * Math.sqrt(data.tickCounter - g_fadeAttackUnit.blinkingTicks) : 255;
    162198       
    163199        // start with fading it out
    164200        if (rgb.g > g_fadeAttackUnit.fadeOutStart)
    165201            rgb.o = rgb.o > g_fadeAttackUnit.opacityChangeRate ? rgb.o -= g_fadeAttackUnit.opacityChangeRate : 0;
     202        // check for end
     203        if (rgb.o == 0)
     204            data.stopFade = true;
    166205    }
     206    rgb.b = rgb.g;
    167207}
    168208
    169 /**
    170  * makes a smooth fade, if the attack on the unit has not stopped yet
    171  * rgb: colour object with keys r,g,b and o
    172  * tickCounter: how often the fade was executed
    173  */
    174 function smoothColourFadeRestart_attackUnit(rgb, tickCounter)
     209function smoothColorFadeRestart_attackUnit(data)
    175210{
    176211    // check, if in blinking phase
    177     if (tickCounter < g_fadeAttackUnit.blinkingTicks)
     212    if (data.tickCounter < g_fadeAttackUnit.blinkingTicks)
    178213    {
    179         // get rgb to current state
    180         for (var i = 1; i <= tickCounter; i++)
    181             colourFade_attackUnit(rgb, i);
    182         // set the tick counter back to start
    183         return (tickCounter % (g_fadeAttackUnit.blinkingChangeInterval * 2)) + 1;
     214        data.tickCounter = data.tickCounter % (g_fadeAttackUnit.blinkingChangeInterval * 2);
     215        return true;
    184216    }
    185     return 1;
     217    return false;
    186218}
    187219
    188220//[END] of hero fade functions
     221 No newline at end of file
  • binaries/data/mods/public/gui/session/session.js

     
    595595    {   
    596596        g_previousHeroHitPoints = heroState.hitpoints;
    597597        // trigger the animation
    598         fadeColour("heroHitOverlay", 100, 10000, {"r": 175,"g": 0,"b": 0,"o": 100}, colourFade_attackUnit, smoothColourFadeRestart_attackUnit);
     598        startColorFade("heroHitOverlay", 100, 0, colorFade_attackUnit, true, smoothColorFadeRestart_attackUnit);
    599599        return;
    600600    }
    601601}