/**
 * HWeatherMarker constructor.
 *
 * @class Represents a weather marker displaying weather, wind direction, wind
 * speed and temperature.
 *
 * @param {HPointRT90} rt90point RT90 coordinate where marker is positioned.
 * @param {Number} weatherSymbol Weather symbol (1-19).
 * @param {Number} temperature Temperature (displayed rounded).
 * @param {Number} windDirection Wind direction (in degrees).
 * @param {Number} windSpeed Wind speed (displayed rounded).
 *
 * @augments HOverlay
 * @constructor
 */
function HWeatherMarker(rt90point, weatherSymbol, temperature, windDirection, windSpeed) {
    this.rt90point = rt90point;

    var div = document.createElement("div");
    HMapHelpers.applyStyle([div], {
        position: "absolute",
        zIndex: HOverlay.getZIndex(this.rt90point)
    });

    var weatherSymbolImg = document.createElement("img");
    HMapHelpers.applyStyle([weatherSymbolImg], {
        position: "absolute",
        left: "0px",
        top: "0px"
    });

    var windDirectionImg = document.createElement("img");
    HMapHelpers.applyStyle([windDirectionImg], {
        position: "absolute",
        left: "50px",
        top: "50px"
    });

    var windSpeedDiv = document.createElement("div");
    HMapHelpers.applyStyle([windSpeedDiv], {
        position: "absolute",
        left: "30px",
        top: "55px",
        width: "50px",
        fontFamily: "Arial",
        fontSize: "10px"
    });
    
    var temperatureDiv = document.createElement("div");
    HMapHelpers.applyStyle([temperatureDiv], {
        position: "absolute",
        left: "52px",
        top: "36px",
        fontFamily: "Arial",
        fontSize: "14px",
        fontWeight: "bold"
    });

    div.appendChild(weatherSymbolImg);
    div.appendChild(windDirectionImg);
    div.appendChild(windSpeedDiv);
    div.appendChild(temperatureDiv);

    // store references to elements
    this.weatherSymbolImg = weatherSymbolImg;
    this.windDirectionImg = windDirectionImg;
    this.windSpeedDiv = windSpeedDiv;
    this.temperatureDiv = temperatureDiv;

    this.element = div;

    this.setValues(weatherSymbol, temperature, windDirection, windSpeed);
}

// HWeatherMarker inherits from HOverlay.
HWeatherMarker.prototype = new HOverlay();

HWeatherMarker.URL_WEATHER_SYMBOL = 'http://www.hitta.se/Images/Map/Weather/Small/';
HWeatherMarker.URL_WIND_DIRECTION = 'http://www.hitta.se/Images/Map/Weather/';

HWeatherMarker.IMAGE_WIDTH = 110;
HWeatherMarker.IMAGE_HEIGHT = 110;

HWeatherMarker.DIRECTION_WIDTH = 360 / 16;
HWeatherMarker.DIRECTION_SHORT = ['N', 'NNE', 'NE', 'ENE', 'E', 'ESE', 'SE', 'SSE', 'S', 'SSW', 'SW', 'WSW', 'W', 'WNW', 'NW', 'NNW'];
HWeatherMarker.DIRECTION_DESC = [
    'Nord',
    'Nord-nordost',
    'Nordost',
    'Ost-nordost',
    'Ost',
    'Ost-sydost',
    'Sydost',
    'Syd-sydost',
    'Syd',
    'Syd-sydväst',
    'Sydväst',
    'Väst-sydväst',
    'Väst',
    'Väst-nordväst',
    'Nordväst',
    'Nord-nordväst'
];

/**
 * Display settings of weather marker elements depending on weather symbol.
 * (temperature left/top, wind speed left/top, wind direction img left/top)
 * 
 * @constant
 * @private
 */
HWeatherMarker.SYMBOL_SETTINGS = [
    {},
    {tempX: 45, tempY: 36, speedX: 40, speedY: 57, windX: 70, windY: 60}, // 1
    {tempX: 45, tempY: 32, speedX: 30, speedY: 64, windX: 70, windY: 60}, // 2
    {tempX: 60, tempY: 43, speedX: 18, speedY: 56, windX: 70, windY: 60}, // 3
    {tempX: 52, tempY: 33, speedX: 22, speedY: 56, windX: 70, windY: 60}, // 4
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 5
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 6
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 7
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 8
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 9
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 10
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 11
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 12
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 13
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 14
    {tempX: 52, tempY: 36, speedX: 30, speedY: 55, windX: 80, windY: 35}, // 15
    {tempX: 58, tempY: 36, speedX: 32, speedY: 67, windX: 30, windY: 35}, // 16
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 17
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}, // 18
    {tempX: 54, tempY: 25, speedX: 23, speedY: 33, windX: 80, windY: 35}  // 19
];

/**
 * Set values of weather marker.
 * 
 * @param {Number} weatherSymbol Weather symbol.
 * @param {Number} temperature Temperature (displayed rounded).
 * @param {Number} windDirection Wind direction (in degrees).
 * @param {Number} windSpeed Wind speed (displayed rounded).
 */
HWeatherMarker.prototype.setValues = function(weatherSymbol, temperature, windDirection, windSpeed) {
    // weather symbol
    if (HMapHelpers.isIEVersionBelow(7)) {
        HMapHelpers.applyIEPNGFix(this.weatherSymbolImg, HWeatherMarker.URL_WEATHER_SYMBOL + weatherSymbol + '.png');
    } else {
        this.weatherSymbolImg.src = HWeatherMarker.URL_WEATHER_SYMBOL + weatherSymbol + '.png';
    }

    // wind direction
    var dirInfo = this.getDirectionByDegree(windDirection);
    if (HMapHelpers.isIEVersionBelow(7)) {
        HMapHelpers.applyIEPNGFix(this.windDirectionImg, HWeatherMarker.URL_WIND_DIRECTION + dirInfo.directionShort.toLowerCase() + '.png');
    } else {
        this.windDirectionImg.src = HWeatherMarker.URL_WIND_DIRECTION + dirInfo.directionShort.toLowerCase() + '.png';
    }
    this.windDirectionImg.alt = this.windDirectionImg.title = dirInfo.directionShort;

    HMapHelpers.applyStyle([this.windDirectionImg], {
        left: HWeatherMarker.SYMBOL_SETTINGS[weatherSymbol].windX + "px",
        top: HWeatherMarker.SYMBOL_SETTINGS[weatherSymbol].windY + "px"
    });

    // wind speed
    this.windSpeedDiv.innerHTML = Math.round(windSpeed) + ' m/s';

    HMapHelpers.applyStyle([this.windSpeedDiv], {
        left: HWeatherMarker.SYMBOL_SETTINGS[weatherSymbol].speedX + "px",
        top: HWeatherMarker.SYMBOL_SETTINGS[weatherSymbol].speedY + "px"
    });

    // temperature
    this.temperatureDiv.innerHTML = Math.round(temperature) + '°';

    HMapHelpers.applyStyle([this.temperatureDiv], {
        left: HWeatherMarker.SYMBOL_SETTINGS[weatherSymbol].tempX + "px",
        top: HWeatherMarker.SYMBOL_SETTINGS[weatherSymbol].tempY + "px"
    });
};

/**
 * Get direction information by degree.
 *
 * @param {Number} degree Direction in degrees.
 * @returns {Object}
 */
HWeatherMarker.prototype.getDirectionByDegree = function(degree) {
    // get array index based on degree
    degree = degree + (HWeatherMarker.DIRECTION_WIDTH / 2);
    degree = (degree + 360) % 360;
    degree = Math.floor(degree / HWeatherMarker.DIRECTION_WIDTH);

    return {
        directionShort: HWeatherMarker.DIRECTION_SHORT[degree],
        directionDesc: HWeatherMarker.DIRECTION_DESC[degree]
    };
};

/**
 * Pan marker.
 *
 * @param {Number} dx Delta X movement in pixels to pan.
 * @param {Number} dy Delta Y movement in pixels to pan.
 *
 * @private
 */
HWeatherMarker.prototype.pan = function(dx, dy) {
    this.point.x += dx;
    this.point.y += dy;

    this.element.style.left = this.point.x;
    this.element.style.top = this.point.y;
};

/**
 * Recalculates position of marker.
 *
 * @private
 */
HWeatherMarker.prototype.update = function() {
    this.point = this.hmap.fromRT90toContainerPixel(this.rt90point);

    // offset by anchor position
    this.point.x -= Math.round(HWeatherMarker.IMAGE_WIDTH / 2);
    this.point.y -= Math.round(HWeatherMarker.IMAGE_HEIGHT / 2);

    this.element.style.left = this.point.x;
    this.element.style.top = this.point.y;
};