jQuery.event.add(window, 'load', changeResolution);
jQuery.event.add(window, 'resize', changeResolution);

var oldWidth = -1;

function changeResolution() {
  var w = (window.innerWidth > 0) ? window.innerWidth : screen.width;
  var changed = false;

  // > 1280
  if (w > 1280) {
    if (oldWidth <= 1280 || oldWidth == -1) {
      $('body').removeClass('xs');
      $('body').removeClass('s');
      $('body').addClass('l');
      resolutionClass='l';
      changed = true;
    }
  }
  // 0 - 460
  else if (w <= 460) {
    if (oldWidth > 460 || oldWidth == -1) {
      $('body').removeClass('l');
      $('body').removeClass('s');
      $('body').addClass('xs');
      resolutionClass='xs';
      changed = true;
    }
  }
  // 460 - 960
  else if (w <= 960) {
    if (oldWidth > 960 || oldWidth <= 460 || oldWidth == -1) {
      $('body').removeClass('xs');
      $('body').removeClass('l');
      $('body').addClass('s');
      resolutionClass='s';
      changed = true;
    }
  }
  // 960 - 1280
  else {
    if (oldWidth <= 960 || oldWidth > 1280 || oldWidth == -1) {
      $('body').removeClass('l');
      $('body').removeClass('s');
      $('body').removeClass('xs');
      resolutionClass='';
      changed = true;
    }
  }
  
	if (changed) {
	  // set cookie
	  document.cookie = 'resolutionClass='+resolutionClass;

	  // change images
	  $('img').each(function() {
	  	var regex = /wol-([^_]+)_(xs|s|l)?&/;
	  	var result = $(this).attr('src').match(regex);
	  	if (result !== null && result[2] != resolutionClass) {
		  	var replace = 'wol-'+result[1]+'_'+resolutionClass+'&';
				$(this).attr('src', $(this).attr('src').replace(regex, replace));
				$(this).parent().css('height', $(this).height+'px');
	  	}
	  	var regex = /woldata([0-9]{1})?_(xs|s|l)?/;
	  	var result = $(this).attr('src').match(regex);
	  	if (result !== null && result[2] != resolutionClass) {
		  	var replace = 'woldata'+result[1]+'_'+resolutionClass;
				$(this).attr('src', $(this).attr('src').replace(regex, replace));
				$(this).parent().css('height', $(this).height+'px');
	  	}
	  });
	}
  oldWidth = w;
}