general.namespace('SW.Controls');

(function () {

        /**/
        var WeatherChart = SW.Controls.WeatherChart = function(container) {
            this.container = container;
            this.weatherData = [];
        };
        WeatherChart.prototype.constructor = WeatherChart;
        
        
        /* accessor */
        WeatherChart.prototype.getWeatherData = function() {
            return this.weatherData;
        };
        
        /* mutator */
        WeatherChart.prototype.setWeatherData = function(data) {
            this.weatherData = data;
        };
        
        
        /**
         * draws or removes the weather chart depending on the data
         *
         * @return bool  true if there is data, false if not
         */
        WeatherChart.prototype.render = function() {
            var hasData;
            if (this.weatherData.length) {
                var weekContainer = document.createElement("div");
                weekContainer.className = "weather-week-container";
                
                if (this.weatherData[(this.weatherData.length-1)].UrlWeek) {
                    var accuLinkContainer = document.createElement("div");
                    accuLinkContainer.className = "weather-link";
                    accuLinkContainer.innerHTML = '<a href="' + this.weatherData[(this.weatherData.length-1)].UrlWeek + '" target="_blank" title="Get a detailed weather forecast at AccuWeather.com"><img src="/assets/images/weather-by.png" width="150" height="10" border="0" alt="" /></a>';
                    // add accuweather to week container
                    weekContainer.appendChild(accuLinkContainer);
                }
                
                
                var week = this.week = document.createElement("div");
                week.className = "weather-week-chart";
                
                // add days to week
                for (var i=0; i<7; i++) {
                    week.appendChild(this.createDay(this.weatherData[i], i));
                }
                // add details to week
                var br = document.createElement("br");
                br.style.clear = "both";
                week.appendChild(br);
                
                // add week to week container
                weekContainer.appendChild(week);
                // add week container to existing container
                general.replaceAllChildren(this.container, [weekContainer]);
                hasData = true;
            }
            else {
                general.removeAllChildren(this.container);
                hasData = false;
            }
            return hasData;
        };
        
        
        /**
         * creates an DOM element that has all the stuff for one day in it
         * 
         * @param object  the data 
         * @param int  the place number 0-6
         * @return object  DOM element (a div)
         */
        WeatherChart.prototype.createDay = function (dayData, placeNumber) {
            var isFirst = (placeNumber == 0);
            var isLast = (placeNumber == 6);
            
            // if the day doesn't have data
            if ((typeof(dayData) != "object") || (typeof(dayData.MaxTemp) != "number")) {
                // TODO
            }
            else {
                
            }
            
            var me = this;
            
            var dayDetail = this.createDayDetail(dayData, placeNumber);
            this.week.appendChild(dayDetail);
            
            var mouseoverCallback = function (evt) {
                var target = evt.target || evt.srcElement;
                
                
                //if (target === day) {
                    
                //    dayDetail.style.display = "block";
                //}
                
                if (general.isNodeOrChildOf(target, day)) {                
                   dayDetail.style.display = "block";
                }
            };
            
            var mouseoutCallback = function (evt) {            
                var exited = evt.target || evt.srcElement;
                var entered = evt.relatedTarget || evt.toElement;
                
                if (!general.isNodeOrChildOf(entered, day)) {
                    dayDetail.style.display = "none";
                }
            };
                    
            var dayContainer = document.createElement("div");
            dayContainer.className = "weather-day-container";
            
            if (isFirst) {
                dayContainer.className += " weather-day-container-first";
            }
            
            var day = document.createElement("div");
            day.className = "weather-day";
        
            if (isFirst) {
                day.className += " weather-day-first";
            }
            
            if (isLast) {
                day.className += " weather-day-last";
            }
            
            general.addListener(day, 'mouseover', mouseoverCallback);
            general.addListener(day, 'mouseout', mouseoutCallback);
            dayContainer.appendChild(day);
            
            if (dayData.UrlDay) {
                var dayLink = document.createElement("a");
                dayLink.href = dayData.UrlDay;
                dayLink.title = "Click for details at AccuWeather.com";
                dayLink.target = "_blank";
                day.appendChild(dayLink);
            }
            
            var dayImg = document.createElement("img");
            dayImg.src = this.getIconUrl(dayData.IconDay);
            dayImg.width = "52";
            dayImg.height = "40";
            if (dayData.UrlDay) {
                dayLink.appendChild(dayImg);
            }
            else {
                day.appendChild(dayImg);
            }
            
            var dayHigh = document.createElement("div");
            dayHigh.className = "weather-day-high";
            dayHigh.innerHTML = this.getTemperatureString(dayData.MaxTemp);
            day.appendChild(dayHigh);
            
            var dayLow = document.createElement("div");
            dayLow.className = "weather-day-low";
            dayLow.innerHTML = this.getTemperatureString(dayData.MinTemp);
            day.appendChild(dayLow);
            
            var dayHash = document.createElement("div");
            dayHash.className = "weather-day-hash";
            
            if (isFirst) {
                dayHash.className += " weather-day-hash-first";
            }
            if (isLast) {
                dayHash.className += " weather-day-hash-last";
            }
            
            dayContainer.appendChild(dayHash);
            
            var dayLabel = document.createElement("div");
            dayLabel.className = "weather-day-label";
            dayLabel.innerHTML = general.dateFormat(dayData.LocalDateRelevant, "ddd").toUpperCase();
            
            dayContainer.appendChild(dayLabel);
            
            return dayContainer;
        };
        
        
        WeatherChart.prototype.createDayDetail = function (dayData, dayIdx) {
            var dayDetail = document.createElement("div");
            dayDetail.className = "day-detail";
            
            dayDetail.innerHTML = '<div class="day-detail-label"><strong>' + general.dateFormat(dayData.LocalDateRelevant, "ddd").toUpperCase() + '</strong></div>'
        
                + '<div class="day-detail-daytime">'
                +    '<div class="day-detail-time-label day-detail-daytime-label"><strong>Day</strong></div>'
                +    '<div>'
                +        '<div class="day-detail-icon"><img src="' + this.getIconUrl(dayData.IconDay) + '" width="52" height="40" alt="" /></div>'
                +        '<div class="day-detail-temp day-detail-daytime-temp">High<br /><strong>' + this.getTemperatureString(dayData.MaxTemp) + '</strong></div>'
                +        '<div class="day-detail-desc"><strong><span>' + (dayData.ConditionsSummaryDay ? dayData.ConditionsSummaryDay : "") + '</span></strong><br /><span>' + this.getPrecipitationText(dayData.PrecipitationAmountDay) + '</span></div>'
                +    '</div>'
                + '</div>'
                
                + '<div class="day-detail-nighttime">'
                +    '<div class="day-detail-time-label day-detail-nightime-label"><strong>Night</strong></div>'
                +    '<div>'
                +        '<div class="day-detail-icon"><img src="' + this.getIconUrl(dayData.IconNight) + '" width="52" height="40" alt="" /></div>'
                +        '<div class="day-detail-temp day-detail-nighttime-temp">Low<br /><strong>' + this.getTemperatureString(dayData.MinTemp) + '</strong></div>'
                +        '<div class="day-detail-desc"><strong><span>' + (dayData.ConditionsSummaryNight ? dayData.ConditionsSummaryNight : "")  + '</span></strong><br /><span>' + this.getPrecipitationText(dayData.PrecipitationAmountNight) + '</span></div>'
                +    '</div>'
                + '</div>'
                
                + '<div class="day-detail-bottom"><img src="/assets/images/spacer.gif" width="223" height="4" alt="" /></div>';
            
            dayDetail.style.left =  (-77 + (dayIdx * 69)) + "px";
        
            return dayDetail;
        };
        
        
        
        /**
         * creates a string for the user in the correct units
         * 
         * @param int
         * @return string
         */
        WeatherChart.prototype.getTemperatureString = function (celcius) {
            var deg = "?";
            if ((celcius !== null) && (celcius !== "")) {
                if (SWMap.userPrefs.uom == SW.UserPrefs.UOM.METERS) {
                    deg = Math.round(celcius) + "&deg;C";
                }
                else {
                    var far = (celcius * (9.0 / 5.0)) + 32.0;
                    deg = Math.round(far) + "&deg;F";
                }
            }
            return deg;
        }
        
        /**
         * gets url for a weather icon
         * 
         * @param string  the icon from the db
         * @return string  path to icon
         */
        WeatherChart.prototype.getIconUrl = function (icon) {
            if (!icon || (icon.length != 2)) icon = "00";
            return "/assets/images/weather/" + icon + ".gif";
        }
        
        /**
         * gets string for amount of rain
         * 
         * @param string  amount in mm of rain
         * @return string  desc of rain
         */
        WeatherChart.prototype.getPrecipitationText = function (precipAmount) {
            var desc = "";
            if (precipAmount) {
                if (SWMap.userPrefs.uom == SW.UserPrefs.UOM.FEET) {
                    var inches = precipAmount * 0.0393700787;
                    desc = inches.toFixed(2) + " (in) precip";
                }
                else {
                    desc = (precipAmount/10) + " (cm) precip";
                }
            }
            return desc;
        }
    
    

})();