function does not exist?

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
daedalus__
DevNet Resident
Posts: 1925
Joined: Thu Feb 09, 2006 4:52 pm

function does not exist?

Post by daedalus__ »

i am sure i had this working the other week but when i came back to it it threw me a silly error.

so i have this.. object..

Code: Select all

 
function Highlighter()
{
    this.colors = new Array();
    this.elements = new Array();
    this.chars = new Array();
    this.interval = null;
    
    // creates a gradient, pretty self explanatory code
    this.CreateGradient = function (start, end, steps)
    {
        for (i = 0; i <= steps; i++)
        {
            this.colors[i] = '#';
            
            for (s = 0; s < 3; s++)
            {
                srgb = parseInt(start.substr(s * 2, 2), 16);
                ergb = parseInt(end.substr(s * 2, 2), 16);
                step = ((ergb - srgb) / steps);
                this.colors[i] += (Math.round(srgb + (step * i))).toString(16);
            }
        }
        
        delete s;
        delete srgb;
        delete ergb;
        delete step;
    }
    
    this.AddElement = function (element)
    {
        if (element.nodeType != 1) {
            return false;
        } else {
            this.elements[this.elements.length] = element; }
    }
    
    this.PrepareElements = function ()
    {
        // for each element in list
        for (i = 0; i < this.elements.length; i++)
        {
            // if element number is greater than 0
            // record length of array to use as index
            (i > 0) ? l = this.chars.length : l = 0;
            
            // for each child node of the selected element
            for (c = 0; c < this.elements[i].childNodes.length; c++)
            {
                // if current child node is a text node
                if (this.elements[i].childNodes[c].nodeType == 3)
                {
                    // chop the texts up and put them in a char array
                    this.elements[i].chars = this.elements[i].childNodes[c].nodeValue.split('');
                    
                    // wrap them in span taggys for stylings
                    for (n = 0; n < this.elements[i].chars.length; n++)
                    {
                        if (this.elements[i].chars[n].match(/\s/) == null)
                        this.elements[i].chars[n] = '<span>' + this.elements[i].chars[n] + '</span>';
                    }
                }
            }
            // replace
            this.elements[i].innerHTML = this.elements[i].chars.join('');
            // make references to span elements
            for (c = 0; c < this.elements[i].childNodes.length; c++)
            {
                if (this.elements[i].childNodes[c].nodeType == 1)
                this.chars[(i > 0) ? l + c : c] = this.elements[i].childNodes[c];
            }
        }
        // toss out the loop variables
        delete n;
        delete c;
        delete i;
        delete l;
    }
    
    this.On = function ()
    {
        i = 0;
        setInterval(function () { this.Increment(i); }, 100);
    }
    
    this.Increment = function ()
    {
        // if c is negative
        // turn it positive
        // 6 5 4 3 2 1 0 1 2 3 4 5 6
        // if the current color is null throw an exception. an error occured earlier in the program.
        if (this.currentColor === null)
            alert('Out of range Exception on variable c: ' + this.currentColor);
            //throw new Exception('colorsCount is null');
 
        // if the current color is less than zero but not null then convert to unsigned integer
        if (this.currentColor < 0)      
            this.currentColor *= -1;
 
        // if the current color is less than or greater than the unsigned value of the color array length
        // then we are out of range so throw an exception
        if (this.currentColor < (this.colors.length * -1) | this.currentColor > this.colors.length)
            alert('Out of range Exception on variable c: ' + this.currentColor);
            //throw new Exception('Out of range Exception on variable "c".');
 
        for (c = 0, pc = (this.colors.length * -1); c <= this.chars.length * 2; c++, pc++)
        {
            if (typeof(this.chars[c - pc]) !== 'undefined')
                this.chars[c - pc].style.colors = this.colors[this.colorsCount];
        }
 
        this.Increment.arguments[0]++;
    }
    
    this.Off = function ()
    {
        clearInterval(this.interval);
    }
}
 
blah blah. so heres the go-code:

Code: Select all

 
    var HL = new Highlighter();
    HL.CreateGradient('dadaff', '8398ef', 6);
    HL.colors[6] = '#37417a';
    
    window.onload = function()
    {
        HL.AddElement(document.getElementsByTagName('h3')[0]);
        HL.AddElement(document.getElementById('note').childNodes[1]);
        HL.PrepareElements();
        setTimeout(function () { HL.On(); }, 2500);
    }
 
well when it runs it tells me that this.Increment does not exist. it does. i looked in firebug! it's there!

so im having a problem with scope i suppose but im lost at this point :|
User avatar
daedalus__
DevNet Resident
Posts: 1925
Joined: Thu Feb 09, 2006 4:52 pm

Re: function does not exist?

Post by daedalus__ »

well i changed it to a literal object and in that function i asked for Highlighter.Increment() instead of this. because this in that instance if the function() in the interval i think. :\
lol
User avatar
kaszu
Forum Regular
Posts: 749
Joined: Wed Jul 19, 2006 7:29 am

Re: function does not exist?

Post by kaszu »

Or

Code: Select all

var self = this;
setInterval(function () { self.Increment(i); }, 100);
setInterval executes function in window context (this refers to window).
User avatar
daedalus__
DevNet Resident
Posts: 1925
Joined: Thu Feb 09, 2006 4:52 pm

Re: function does not exist?

Post by daedalus__ »

yum that looks nicer imo. thanks kaszu.
Post Reply