function _cwframe() {
  var SwayTimer = 0;
  var SwayDev = 0;
  var SwayDir = 0.5;
  var MaxSway = 10;
  var SwayOn = true;

  var last_rotation = 0;
  var windspeed = 0;
  var winddirindex = 0;
  var windmeter_name = '';
  var useCanvas = !!document.createElement('canvas').getContext;

  this.WriteWindMeter = WriteWindMeter;
  this.ActivateUpdates = ActivateUpdates;
  var updateEvery = 30 * 1000;

  function UpdateWeatherInfo() {
    $.get("/getcurrentweatherinfo",  
      function (xml) {
        $(xml.documentElement.childNodes).each(function() {
          try {
            if (this.nodeName.substring(0, 5) != 'time_')
              $('#' + this.nodeName).html(this.firstChild.data)
            else
              $('#' + this.nodeName).attr("data", this.firstChild.data);
          } catch(e) {};
        });

        temperature_trend = $(xml).find('temperature_trend').text();
        temperature_trend_text = $(xml).find('temperature_trend_text').text();
        pressure_trend = $(xml).find('pressure_trend').text();
        pressure_trend_text = $(xml).find('pressure_trend_text').text();

        windspeed = $(xml).find('windspeed').text();
        winddirindex = $(xml).find('winddirectionindex').text();

        if (windspeed > 0) {
          $('#_winddirection').html($(xml).find('winddirection').text());
          $('#_windspeed').html(windspeed);
        } else {
          $('#_winddirection').html('wind');
          $('#_windspeed').html('stil');
        }

        ChangeTrendImage('temperature_trend_image', temperature_trend, temperature_trend_text);
        ChangeTrendImage('pressure_trend_image', pressure_trend, pressure_trend_text);

        SetWindMeter($(xml).find('iwinddirection').text());
      }
    );
  }

  function ActivateUpdates() {
    UpdateWeatherInfo();
    setInterval(UpdateWeatherInfo, updateEvery);
  }

  function ChangeTrendImage(image, trend, trend_text) {
    e = document.getElementById(image);
    switch (trend) {
      case '-1': e.src = '/images/down_arrow.gif'; break;
      case  '1': e.src = '/images/up_arrow.gif'; break;
      default  : e.src = '/images/stable_arrow.gif';
    }
    e.title = trend_text;
  }

  function Animate() {
    if (windspeed != 0) {
      last_rotation += SwayDev;
      SwayDev = 0;

      rotation = (winddirindex * 22.5 + 180) % 360;
      last_rotation += (rotation - last_rotation) / 10;

      drawDial(last_rotation);
 
      if (Math.abs(last_rotation - rotation) > 1) {
        clearTimeout(SwayTimer);
        AnimateTimer = setTimeout(Animate, 30)
      } else Sway();
    } else Sway();
  }

  function Sway() {
    if (SwayTimer) clearTimeout(SwayTimer);

    if (windspeed != 0) {
      if (Math.abs(SwayDev) >= MaxSway) { 
        SwayDir = -SwayDir;
        SwayDev = MaxSway * ((SwayDev > 0)?1:-1);
      }
    }
    SwayDev += SwayDir;
    SwayDev %= 360;

    if (!SwayOn) SwayDev = 0;

    drawDial(last_rotation + SwayDev);

    if (SwayOn) SwayTimer = setTimeout(Sway, 50);
  }

  function drawDial(angle) {
    var windmeter = document.getElementById('windmeter');
    var context = windmeter.getContext('2d');

    windmeter.width = windmeter.width; // clear canvas
    size = windmeter.width;

    context.fillStyle = "rgb(255,0,0)";
    context.strokeStyle = "rgb(0,0,255)";
    context.translate(size / 2, size / 2);

    context.rotate(angle / 180 * Math.PI);

    context.beginPath();
    context.moveTo(         0, -size / 2 +2);
    context.lineTo( size / 10,  size / 2 -2);
    context.lineTo(         0,  size / 4);
    context.lineTo(-size / 10,  size / 2 -2);
    context.lineTo(         0, -size / 2 +2);
    context.closePath();

    context.stroke();
    context.fill();
  }

  function thisMovie(movieName) {
    return (navigator.appName.indexOf('Microsoft') != -1) ? document.getElementById(movieName) : document.getElementById(movieName).getElementsByTagName("embed")[0];
  }

  function SetWindMeter(winddirection) {
    if (!useCanvas) {
      thisMovie("windmeter").SetVariable("winddirection", winddirection);
    } else {
      Animate();
    }
  }

  function WriteWindMeter(container) {
    if (useCanvas) {
      $('#' + container).html('<a href="/dashboard"><canvas id="windmeter" width="65" height="65"></canvas></a>');
    } else {
      WriteFlashWindMeter(container);
    }
  }
}

var cwframe = new _cwframe();
$(function() {
  cwframe.WriteWindMeter('flash_windmeter');
  setTimeout(cwframe.ActivateUpdates, 500); 
}); // De timeout is nodig voor Firefox