// JScript File

function SNToolKit()
{
    var holder = new Object();
    holder.events = new Object();
    this.events = holder.events;
    var IE = false;
    var me = this;
    init();
    this.afterLogin = null;
    
    var confirmAfterLogin = false;
    var redirectAfterLogin = false;
    var cArguments; 
    
    // constructor
    function init()
    {
        // holds even queues
        holder.extraOnload = [];
        holder.events.onAMAXLoad = function(){};
        IE = document.all && true;
        /*if(window.Event && document.captureEvents)
            document.captureEvents(Event.MOUSEMOVE);*/
    }
    
    
    
    
    // Queues and event by adding it to the bottom of the queue.
    this.queueEvent = function (e)
    {
        holder.extraOnload[holder.extraOnload.length] = e;
    }
    
    
    
    // when called, executes each function in the queue in order
    this.executeEvents = function()
    {
        for(i=0; i < holder.extraOnload.length;i++)
            if (holder.extraOnload[i].args!=null) holder.extraOnload[i].fn(holder.extraOnload[i].args);
            else holder.extraOnload[i].fn();
            
            
    }
    
    
    
    
    this.isIE = function()
    {
        return IE;
    }
    
    
    
    
    /**
     * Returns how much the user has scrolled up and down */
    this.getScrollXY = function () {
        var scrOfX = 0, scrOfY = 0;
        if( typeof( window.pageYOffset ) == 'number' )
        {
            //Netscape compliant
            scrOfY = window.pageYOffset;
            scrOfX = window.pageXOffset;
        }
            else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) )
        {
            //DOM compliant
            scrOfY = document.body.scrollTop;
            scrOfX = document.body.scrollLeft;
        }
            else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) )
        {
            //IE6 standards compliant mode
            scrOfY = document.documentElement.scrollTop;
            scrOfX = document.documentElement.scrollLeft;
        }
        return {x:scrOfX, y:scrOfY};
    }
    
    
    
    
    
    // returns a cordinate which has a property called X and
    // another called Y (like  output.X and output.Y)
    this.getMouseXY = function (e) 
    {
        var output={X:0,Y:0};
        if (IE && event) 
        { // grab the x-y pos.s if browser is IE
            output.X = event.clientX + Math.max(document.body.scrollLeft, document.documentElement.scrollLeft);
            output.Y = event.clientY + Math.max(document.body.scrollTop, document.documentElement.scrollTop);
        }
        else if (e)
        {  // grab the x-y pos.s if browser is NS
            output.X = e.pageX;
            output.Y = e.pageY;
        }  
        // catch possible negative values in NS4
        if (output.X < 0) output.X = 0;
        if (output.Y < 0) output.Y = 0; 
    
        return output;

    }  
    
    
    /**
     *Finds the position of element with respect to the top left 
     *corner (0,0) */
    this.findPos = function (obj) 
    {
        var curleft = curtop = 0;
        if (obj.offsetParent) 
        {
            curleft = obj.offsetLeft
            curtop = obj.offsetTop
            while (obj = obj.offsetParent) 
            {
	            curleft += obj.offsetLeft
	            curtop += obj.offsetTop
            }
        }
        if (IE) return {x:curleft + document.body.scrollLeft,y:curtop  + document.body.scrollTop};
        return {x:curleft,y:curtop};
    }
    
    
    
    
    /**
     *Gets the dimensions of a DOM object*/
    this.getDimensions = function(el)
    {
        if (el.offsetWidth)
            if (el.offsetHeight)
                return {width: el.offsetWidth, height: el.offsetHeight};
        var originalVisibility = el.style.visibility;
        var originalPosition = el.style.position;
        el.style.visibility = 'hidden';
        el.style.position = 'absolute';
        el.style.display = '';
        var originalWidth = el.clientWidth;
        var originalHeight = el.clientHeight;
        el.style.display = 'none';
        el.style.position = originalPosition;
        el.style.visibility = originalVisibility;
        return {width: originalWidth, height: originalHeight};
    }
    
    
    /**
     *This function gets the TRUE height and width of a window
     *even if there is an scrollbar; in Firefox, there is not a
     *known way to get the true height of a window that is not
     *style dependant, however this method fixes that bug */
    this.getWindowDimentions = function()
    {
        var myWidth = 0, myHeight = 0;
        if( typeof( window.innerWidth ) == 'number' )
        {
            //Non-IE
            myWidth = window.innerWidth;
            myHeight = window.innerHeight;
        } else if( document.documentElement &&
                  ( document.documentElement.clientWidth ||
                   document.documentElement.clientHeight ) )
        {
            //IE 6+ in 'standards compliant mode'
            myWidth = document.documentElement.clientWidth;
            myHeight = document.documentElement.clientHeight;
        }
            else if( document.body &&
                    ( document.body.clientWidth ||
                     document.body.clientHeight ) )
        {
            //IE 4 compatible
            myWidth = document.body.clientWidth;
            myHeight = document.body.clientHeight;
        }
        var tmp = document.createElement("div");
        document.body.appendChild(tmp);
        myTmpHeight = me.findPos(tmp).y;
        document.body.removeChild(tmp);
        if (parseInt(myTmpHeight) > parseInt(myHeight)) myHeight=myTmpHeight;
        return {width:parseInt(myWidth), height:parseInt(myHeight)};
    }
    
    
    
    
    
    
    // can be used like:
    // getStyle("elementID").diplay = 'none'
    // instead of element.style.display = 'none'
    // however adds support for older browsers
    this.getStyle = function(name)
    {
        if (document.getElementById)
            return document.getElementById(name).style;
        else if (document.all)
            return document.all[name].style;
        else if (document.layers)
            return document.layers[name];
        else 
            return false;
    }

    
    
    
    
    
    
    this.displayElement = function(namestr, mode, b)
    {
        me.getStyle(namestr).display = b ? mode : "none";
    }



    
    
    
    
    // removes all characters that aren't letters or numbers;
    // leaves \w, dash, and email sign however!
    this.alphaNumerizer = function(e)
    {
        return e.replace(/['"\]\[\}\{\)\(\*&\^%\$#@\!`~\+\=><\\\/]/ig,"");
    }
    
    
 
    // returns if {str} looks like a valid url.
    this.checkValidURL = function(str)
    {
        return /(http(s)*:\/\/)*([\w\d]+\.)*[\w\d]+\.[\w\d]{1,7}(\/[\w\d&\=\?])*\/?/ig.test(str);
    }
    
    
    // returns true if email is valid
    this.checkValidEmail = function(str)
    {
        return str.match(/([-_.a-z0-9]+@(([-_a-z0-9]+\.)+([A-Za-z]{2,3}|(([0-9][0-9]?|[0-1][0-9]{2}|[2][0-4][0-9]|[2][5][0-5]))))).*/ig)!=null;
    }
    
    
    // returns a new Date object if {y},{m}, and {d}
    // together make a valid date; else returns null
    this.parseDate = function (y,m,d)
    {
        try 
        {
            var outdate = new Date();
            outdate.setFullYear(y,m,d);
            return m == outdate.getMonth() ? outdate : null;
        }
        catch (ee) { alert(ee.message); return null; }
    }
    
    
    
 
    
    
    /**
    * doesn't return anything but shows a confirmation and
    * executes {fn} which is a function ref
    * while passing {args} as its arguments 
    * (that is the user clicks OK of course)
    *
    * arguments in order:
    * {msg}                 message as string
    * {fn}                  function ref
    * {args}                arguments for {fn}
    * [{closeOnAmax}]       if true, then closed only when next 
    *                       document.toolkit.onAMAXLoad() is called
    *                       otherwise closed as soon as user clicks ok or cancel
    * [{width}]             width
    * [{height}]            height
    */
    this.confirm = function()
    {

        if (document.getElementById("sn_w_confirm"))
            return;
        
        var fn = arguments[1];
        var args = arguments[2];
        
        var closeOnAjax = arguments[3] && true;
        if (arguments[4] != null)
            defaultWidth = parseInt(arguments[4]);
            
        if (arguments[5] != null)
            defaultHeight = parseInt(arguments[5]);
        
        var edv = document.createElement("div");
        
        var bgimg = new Image();
        bgimg.style.position = "absolute";
        bgimg.src = "http://media.supernova.com/images/modules/confirmation-yellowbg.png";
        bgimg.style.width = "244px";
        bgimg.style.height = "175px";
        bgimg.style.top = bgimg.style.left = "0px";
        
        var defaultWidth = parseInt(bgimg.style.width), defaultHeight = parseInt(bgimg.style.height), defaultTextMargin = 25;
        
        edv.className = "sn_confirmationBox";
        edv.style.zIndex = 999;
        edv.style.position = "absolute";
        edv.style.height = defaultHeight+"px";
        edv.style.width = defaultWidth+"px";
        edv.appendChild(bgimg);        
        edv.id = "sn_w_confirm";
        
        txtdv = document.createElement("div");
        var btndv = document.createElement("div");
        txtdv.className = "sn_ConfirmationBoxTextDiv";
        btndv.className = "sn_ConfirmationBoxButtonDiv";
        btndv.style.marginLeft = btndv.style.marginTop = txtdv.style.left = txtdv.style.top = defaultTextMargin + "px";
         
        txtdv.style.width = (defaultWidth - 2*defaultTextMargin - 16) + "px";
        txtdv.style.height = (defaultHeight - 2*defaultTextMargin - 26) + "px";
        var txtstxtdv = document.createTextNode(arguments[0]);
        txtdv.appendChild(txtstxtdv);
        edv.appendChild(txtdv);
        
        
        var inpt1 = document.createElement("input");
        var inpt2 = document.createElement("input");
        inpt1.type = inpt2.type = "image";
        inpt1.className = inpt2.className = "sn_ConfirmationBoxButton";
        inpt1.src = "http://media.supernova.com/images/buttons/ok.jpg";
        inpt2.src = "http://media.supernova.com/images/buttons/cancel.jpg";   
        inpt1.style.width = inpt2.style.width = "55px";
        inpt1.style.height = inpt2.style.height = "18px";
        inpt1.onclick = function () 
        {
            var medv = edv;
            try {txtdv.removeChild(txtstxtdv);}catch(err){}
            txtdv.appendChild(document.createTextNode("Sending request ...")); 
            fn(args); 
            if (closeOnAjax)
            {
                //Quick Fix: just close it right away
                try {document.body.removeChild(medv);}catch(err){}
                //try{ document.removeChild(edv); } catch(err){}
                
                /*
                this.onAMAXLoad= function()
                //document.toolkit.events.onAMAXLoad = function()
                {
                    try {document.body.removeChild(medv);}catch(err){}
                    this.onAMAXLoad = function(){};
                } 
                */
            }
            else
                try{ document.removeChild(edv); } catch(err){}
        }
        inpt2.onclick = function() 
        {
            document.body.removeChild(edv);
        }
        btndv.appendChild(inpt1);
        btndv.appendChild(inpt2);
        btndv.style.width = parseInt(txtdv.style.width) + "px";
        btndv.style.height = parseInt(txtdv.style.height) + "px";
        
        
        edv.appendChild(btndv);
        
        document.body.appendChild(edv);

        me.centerObject(edv);


        
    }
    
    
    
    /**
    * centers a DOM element both horizontally and vertically.
    */
    this.centerObject = function(obj)
    {
        try
        {
            obj.style.left = parseInt(
            (parseInt(document.body.offsetWidth) - parseInt(obj.style.width.replace(/px/,'')))/2) + "px";
            
            //obj.style.top='50px';
            
            //The line above is a fix for the box being covered up by poorly inserted user flash
            //The line below will vertically center it if uncommented
            
            obj.style.top = parseInt(
            (screen.height - parseInt(obj.style.height.replace(/px/,'')))/2 + me.getScrollXY()['y']) + "px";
        }
        catch(err){};
    }
    
    /**
    * centers a DOM element both horizontally and vertically.
    */
    this.centerObjectAtTop = function(obj)
    {
        try
        {
            obj.style.left = parseInt(
            (parseInt(document.body.offsetWidth) - parseInt(obj.style.width.replace(/px/,'')))/2) + "px";
            
            obj.style.top='50px';
            

        }
        catch(err){};
    }
    
    
    
    
    
    /**
    * Two overloads for this function:
    * 1)    document.toolkit.login()
    *       which makes the login box disappear
    * 2)    document.toolkit.login(element [, function_descriptor])
    *       which displays the box with respect to mouse click
    *       The element is simiply the dom element that we want
    *       this login box to show with respect to; function_descriptor is
    *       the reference to a function to call if login
    *       was successfull
    */
    this.login = function()
    {
        var lgnbx = document.getElementById("sn_inline_login");
        var vMargin = 100;
        var hMargin = 100;
        var xOffset = -20;
        var yOffset = 5;
        if(lgnbx!=null)
        {
            lgnbx.style.left = lgnbx.style.top = "-5500px";
            lgnbx.style.display = "none";
            if (!lgnbx || arguments[0]==window || arguments.length == 0) return;
            var cord = me.findPos(arguments[0]);
            var ww = 244;
            var hh = 191;
            
            var bw = parseInt(document.body.offsetWidth);
            var bh = parseInt(document.body.offsetHeight);
            
            if (bw < ww || bh < hh) return;
            var cs = 0;
                
            if (ww + cord.x + hMargin > bw)
                cs = 1;
                
            if (hh + cord.y + vMargin > bh)
                cs = 2;
                
            if (cs == 2 && ww + cord.x + hMargin > bw)
                cs = 3;
            
            for (i = 0; i < 4; i++)
                document.getElementById("sn_ziggy"+(i+1)).style.display = i == cs ? "block" : "none";
            
            lgnbx.style.top = (cs < 2) ? (yOffset + cord.y+25) + "px" : (cord.y - yOffset - hh) + "px" ;
            lgnbx.style.left = (cs % 2 == 0) ? (xOffset + cord.x) + "px" : (cord.x - xOffset - ww) + "px" ;
            lgnbx.style.display = "block";
            me.afterLogin = arguments[1];
        }
    }  
    
    
    /* This method does an inline login.
     * If successful, it then calls confirm in the standard manner
     * Usage is as follows
     *
     * document.toolkit.loginThenConfirm
     * (elementID, message, functionReference, arguments, closeOnAmax)
     */
     
    this.loginThenConfirm = function()
    {
        //Save the arguments that will be passed to confirm box later.
        cArguments = arguments;
        
        //Set the global confirmAfterLogin to true so the inline login knows what to do
        confirmAfterLogin = true;
        
        var lgnbx = document.getElementById("sn_inline_login");
        var vMargin = 100;
        var hMargin = 100;
        var xOffset = -20;
        var yOffset = 5;
        if(lgnbx!=null)
        {
            lgnbx.style.left = lgnbx.style.top = "-5500px";
            lgnbx.style.display = "none";
            if (!lgnbx || arguments[0]==window || arguments.length == 0) return;
            var cord = me.findPos(arguments[0]);
            var ww = 244;
            var hh = 191;
            
            var bw = parseInt(document.body.offsetWidth);
            var bh = parseInt(document.body.offsetHeight);
            
            if (bw < ww || bh < hh) return;
            var cs = 0;
                
            if (ww + cord.x + hMargin > bw)
                cs = 1;
                
            if (hh + cord.y + vMargin > bh)
                cs = 2;
                
            if (cs == 2 && ww + cord.x + hMargin > bw)
                cs = 3;
            
            for (i = 0; i < 4; i++)
                document.getElementById("sn_ziggy"+(i+1)).style.display = i == cs ? "block" : "none";
            
            lgnbx.style.top = (cs < 2) ? (yOffset + cord.y+25) + "px" : (cord.y - yOffset - hh) + "px" ;
            lgnbx.style.left = (cs % 2 == 0) ? (xOffset + cord.x) + "px" : (cord.x - xOffset - ww) + "px" ;
            lgnbx.style.display = "block";
            

        }
    }   
    
     /* This method does an inline login.
     * If successful, it redirects to the specified URL after completion.
     * Usage is as follows
     *
     * document.toolkit.loginThenRedirect
     * (elementID, message, functionReference, arguments, closeOnAmax)
     */
     
    this.loginThenRedirect = function()
    {
        //Save the arguments that will be passed to confirm box later.
        cArguments = arguments;
        redirectAfterLogin = true;
        
        var lgnbx = document.getElementById("sn_inline_login");
        var vMargin = 100;
        var hMargin = 100;
        var xOffset = -20;
        var yOffset = 5;
        if(lgnbx!=null)
        {
            lgnbx.style.left = lgnbx.style.top = "-5500px";
            lgnbx.style.display = "none";
            if (!lgnbx || arguments[0]==window || arguments.length == 0) return;
            var cord = me.findPos(arguments[0]);
            var ww = 244;
            var hh = 191;
            
            var bw = parseInt(document.body.offsetWidth);
            var bh = parseInt(document.body.offsetHeight);
            
            if (bw < ww || bh < hh) return;
            var cs = 0;
                
            if (ww + cord.x + hMargin > bw)
                cs = 1;
                
            if (hh + cord.y + vMargin > bh)
                cs = 2;
                
            if (cs == 2 && ww + cord.x + hMargin > bw)
                cs = 3;
            
            for (i = 0; i < 4; i++)
                document.getElementById("sn_ziggy"+(i+1)).style.display = i == cs ? "block" : "none";
            
            lgnbx.style.top = (cs < 2) ? (yOffset + cord.y+25) + "px" : (cord.y - yOffset - hh) + "px" ;
            lgnbx.style.left = (cs % 2 == 0) ? (xOffset + cord.x) + "px" : (cord.x - xOffset - ww) + "px" ;
            lgnbx.style.display = "block";
            

        }
    }   
    
    
    /**
     *This function is called by the button of the inline login module
     *
     * it takes two arguments:
     *  ef      the id of the email text field element
     *  ep      the id of the pass text field element
     */
    this.inlinelogin = function(ef, pf)
    {
        var etxt = document.getElementById(ef);
        var ptxt = document.getElementById(pf);
        
        
        if (!me.checkValidEmail(etxt.value))
        {
            etxt.style.border = "1px solid red";
            return;
        }
        else
            etxt.style.border = "1px solid #CCCCCC";
        var amax = new AMAX('/App_Info/InlineLogin.aspx', false);
        var skully = '<img src="http://media.supernova.com/images/loneskull.png" width="28" height="18" />';
        amax.onLoad = function()
        {
            if (this.success)
            {
                if(this.data == "ok")
                {
                    if (confirmAfterLogin)
                    {
                        document.toolkit.confirm(cArguments[1], cArguments[2], cArguments[3], cArguments[4]);
                        me.login(); //This is a hack to close the login window
                    }
                    else if (redirectAfterLogin)
                    {
                        location.href=cArguments[1];
                        me.login(); //This is a hack to close the login window
                    }
                    
                    else if (me.afterLogin)
                    {
                        me.afterLogin();
                        me.login();
                    } 
                    else document.location.reload();
                }
                else if (this.data == "ip")
                {
                    document.getElementById("sn_inline_login_msg").innerHTML = skully + "We want to let you in, but you'll need to give us your password.";
                    ptxt.value = "";
                }
                else if (this.data == "iu")
                {
                    document.getElementById("sn_inline_login_msg").innerHTML = skully + "Yep, that username you gave me ain't right!";
                    etxt.value = "";
                }
                else
                {
                    document.getElementById("sn_inline_login_msg").innerHTML = skully + "That info ain't valid, try again!";
                    etxt.value = ptxt.value = "";
                }
            }
        }
        
        amax.send('e='+amax.encode(etxt.value)+'&p='+amax.encode(ptxt.value), 'get');
    }
    
    
    
    
    
    /** use as document.toolkit.dim() to hide the dim
    *   or document.toolkit.dim(width, height, el) to show dim;
    *   the third argument of the second constructur (el) is a
    *   DOM element that will show on top of this dimmed layer;*/
    this.dim = function()
    {
        if (navigator.userAgent.indexOf('MSIE 6') != -1)
        {
            var tmpmichelle = document.getElementsByTagName("select");        
            for (i =0;i < tmpmichelle.length; i++)
            {
                tmpmichelle[i].disabled = arguments.length != 0;
                tmpmichelle[i].style.backgroundColor = arguments.length != 0 ? "#848484" : "#ffffff";
            }
        }
        
        if (arguments.length == 0)
        {
            if (document.getElementById("sn_dimmed"))
                document.body.removeChild(document.getElementById("sn_dimmed"));
            return;
        }
    
        if (arguments.length != 3) return;
        var el = arguments[2];
    
        var dimmer;
        if (document.getElementById("sn_dimmed"))
        {
            dimmer = document.getElementById("sn_dimmed");
        }
        else
        {
            dimmer = document.createElement("div");
            dimmer.id = "sn_dimmed";
        }
        document.body.insertBefore(dimmer, document.body.firstChild);
        dimmer.style.left = dimmer.style.top = "0";
        trnspnt = new Image();
        trnspnt.src = 'http://media.supernova.com/images/modules/screen2.png';
        dimmer.appendChild(trnspnt);
        var dimdim = me.getWindowDimentions();
        trnspnt.style.width = dimdim.width + "px";
        trnspnt.style.height = dimdim.height + "px";
        trnspnt.onclick = function(){document.toolkit.dim();}
        dimmer.appendChild(el);
        el.style.position = "absolute";
        el.style.left = el.style.top = "0";
        me.centerObject(el);
    
    }
    

    /**
     * Takes an optional argument for className
     * so it either creates a new DOM equivalent to <br clear=all />
     * or if given argument X, then it creates <br clear=all class=X />
     */
    this.newClearBr = function()
    {
        var br = document.createElement("br");
        br.setAttribute("clear", "all");
        if (arguments[0]) br.className = arguments[0];
        return br;
    }

}