/*
  depends on: mootools with Ajax - option included
*/

function msg(msg,id,type){
  //new div element, displaying failure case
  var msgDiv = new Element('div');
  msgDiv.id = 'errordiv_'+id;
  msgDiv.injectInside($E('body'));
  msgDiv.setStyle('position','absolute');
  msgDiv.setStyle('top','10px');
  msgDiv.setStyle('left','10px');
  if(type === 'error'){
   msgDiv.setStyle('background-color','#FF0000');
  } else if(type === 'msg') {
   msgDiv.setStyle('background-color','#0000FF');
  }
  msgDiv.setStyle('color','#fff');
  msgDiv.setStyle('fontWeight','bold');
  var errorStartDuration = 500;
  var errorEndDuration   = 500;
  var myEffects = new Fx.Styles(msgDiv, {
   duration:errorStartDuration,
   transition: Fx.Transitions.linear,
   onComplete: function(){
   }
  }); 
  myEffects.start({
    'height': [0, 40],
    'width': [0, 100]
  }).chain(function(){
         msgDiv.appendText(msg);
         (function(){msgDiv.setText('')}).delay(3000);
         this.start.delay(3000, this, {
		         'width': [100, 0],
		         'height': [40, 0]         
	       });
         (function(){msgDiv.remove()}).delay(3500);
  });
}

function doAjax(url,target){
  var ajax = new Ajax(url, {method: 'get', update: target}).request();
}

function getContentFadeIn(url,id){
   var img = $ES('img',id);
   var ajax = new Ajax(url, {
      method:  'get',
      update:  $(id),
      evalScripts: true,
      onRequest: function() {
        var myFx = new Fx.Style($(id), 'opacity').hide();
        myFx.options.duration = 600;
        myFx.start(0,1);         
      },
      onComplete: function(){
      }
  });
/*
   $('refer_image_temp').style('display','');

Idea: saving the current image to temporary space and then on the new
ajax request, getting it from the temp space, putting it to its place and then
doing the 
*/
//         $(id).effect('opacity').start(0);
//      onFailure: function(){ msg('Toiming ebaġnnestus!',id,'error') }
//         $(id).effect('opacity').start(1);
  ajax.request();
}


window.addEvent('domready', function(){
  $$('div#ref_thumbs img').each(function(e){
    var fade = new Fx.Style(e, 'opacity', {wait:false,duration:250});
    fade.set(.7);
    e.addEvent('mouseover', function(){
      fade.start(1);
    });
    e.addEvent('mouseout', function(){
      fade.start(.7);
    });
  });
});