﻿// JScript File

        /*
            INSTRUCTIONS:
                1. Update RGB values of background colour 
                2. Update RGB values of full strength text colour
                3. Set background on container in CSS to match the specified BG colour (or use a bg image)
        */      


        var txt = "Perth's finest cheesemongers ";
           
          
      
        var delay = 100; //time between changes in colour
        var steps = 10;  //total number of changes for a full cycle
       
        //RGB values of full strength colour  (CUSTOMISE THESE)
        var textColourRed = 119;
        var textColourGreen = 179;
        var textColourBlue = 65;

        //RGB values of background colour (and text colour when text is fully faded out)(CUSTOMISE THESE)
        var bgColourRed = 208;
        var bgColourGreen = 233;
        var bgColourBlue = 191;

        //Set initial colour to bg colour
        var red = bgColourRed;
        var green = bgColourGreen;
        var blue = bgColourBlue;
        
        var rangeRed = 0;
        var rangeGreen = 0;
        var rangeBlue = 0;
        var incrementRed = 0;
        var incrementGreen = 0;
        var incrementBlue = 0;

        if(bgColourRed > textColourRed){
            rangeRed = bgColourRed - textColourRed;
        }else{
            rangeRed = textColourRed - bgColourRed;
 
        }
        incrementRed = Math.round(rangeRed/steps);
        if(bgColourGreen > textColourGreen){
            rangeGreen = bgColourGreen - textColourGreen;
           
        }else{
            rangeGreen = textColourGreen - bgColourGreen;
        }
        incrementGreen = Math.round(rangeGreen/steps);
        if(bgColourBlue > textColourBlue){
             rangeBlue = bgColourBlue - textColourBlue;
        }else{
            rangeBlue = textColourBlue - bgColourBlue;
        }
        incrementBlue = Math.round(rangeBlue/steps);
      
        var gettingBrighter = true;

       
        var first = true;

        var i = 0;
        function changeColour(){
          
            
           var div = document.getElementById('txtBanner');
           div.innerHTML = txt;
            

            var redStr = red.toString(16).toUpperCase();
              var greenStr = green.toString(16).toUpperCase();
            var blueStr = blue.toString(16).toUpperCase();
           if(redStr.length == 1){
                redStr = '0' + redStr;
            }
            if(greenStr.length == 1){
                greenStr = '0' + greenStr;
            }
          
            if(blueStr.length == 1){
                blueStr = '0' + blueStr;
            }
           
       
            var color = '#' + redStr + greenStr + blueStr;
           
            div.style.color=color;
                   
            
            if(gettingBrighter){
                if(i < steps){
                    
                    if(bgColourRed > textColourRed){
                        if(red - incrementRed >= textColourRed){
                            red -= incrementRed;
                        }else{
                            red = textColourRed;
                        }
                    }else{
                       if(red + incrementRed  <= textColourRed){
                           red += incrementRed;
                        }else{
                            red = textColourRed;
                        }
                    }
                    
                    if(bgColourGreen > textColourGreen){
                        if(green - incrementGreen >= textColourGreen){
                            green -= incrementGreen;
                        }else{
                            green = textColourGreen;
                        }
                    }else{
                       if(green + incrementGreen  <= textColourGreen){
                           green += incrementGreen;
                        }else{
                            green = textColourGreen;
                        }
                    }
                     if(bgColourBlue > textColourBlue){
                        if(blue - incrementBlue >= textColourBlue){
                            blue -= incrementBlue;
                        }else{
                            blue = textColourBlue
                        }
                    }else{
                       if(blue + incrementBlue  <= textColourBlue){
                           blue += incrementBlue;
                        }else{
                            blue = textColourBlue;
                        }
                    }
                    i++;
               }else{
                    gettingBrighter = false;
                    i= 0;
               }
            }else{
               
                if(i < steps){
                    if(bgColourRed > textColourRed){
                        if(red + incrementRed <= bgColourRed){
                            red += incrementRed;
                        }else{
                            red = bgColourRed;
                        }
                    }else{
                       if(red - incrementRed >= bgColourRed){
                           
                            red -= incrementRed;
                        }else{
                            red = bgColourRed;
                        }
                    }
                    
                    if(bgColourGreen > textColourGreen){
                        if(green + incrementGreen <= bgColourGreen){
                            green += incrementGreen;
                        }else{
                            green = bgColourGreen;
                        }
                    }else{
                       if(green - incrementGreen >= bgColourGreen){
                            green -= incrementGreen;
                        }else{
                            green = bgColourGreen;
                        }
                    }
                     if(bgColourBlue > textColourBlue){
                        if(blue + incrementBlue <= bgColourBlue){
                            blue += incrementBlue;
                        }else{
                            blue = bgColourBlue;
                        }
                    }else{
                       if(blue - incrementBlue >= bgColourBlue){
                            blue -= incrementBlue;
                        }else{
                            blue = bgColourBlue;
                        }
                    }
                    i++;
               }else{
                    gettingBrighter = true;
                    i = 0;
                               
           
                }
            }

             setTimeout('changeColour()', delay);

        }