var CPoon = Class.create({
  'initialize': function(id, options) {
    this.id = id;
    this.options = {
      'imgPath'     :'./',
      'background'  :'background.png',
      'visage'      :'visage.gif',
      'hands'        : {
        'top'     :'hand_top.gif',
        'bottom'  :'hand_bottom.gif',
        'left'    :'hand_left.gif',
        'right'   :'hand_right.gif'
      }
    };
    Object.extend(this.options, options || {})
    this.container = $(id);
    this.container.style.position = 'absolute';
    this.container.style.width = '100px';
    this.container.style.height = '100px';
    this.container.style.left = '0px';
    this.container.style.top = '0px';
    this.container.innerHTML = '<img src="'+this.options.imgPath+this.options.background+'" class="poon" />'
                              +'<img src="'+this.options.imgPath+this.options.visage+'" class="poon" />'
                              +'<img id="'+this.id+'.hands" src="'+this.options.imgPath+this.options.hands.bottom+'" class="poon" />'
                              +'<div id="'+this.id+'.message" class="poon_message" style="height:100px; left:100px; top:0px;"></div>';
    this.hide();
  },
  'show':function(){
    this.container.style.display='block';
  },
  'hide':function(){
    this.container.style.display='none';
  },
  'switchVisibility':function(){
    if(this.container.style.display=='none'){
      this.show();
    } else {
      this.hise();
    }
  },
  'move':function(position){
    var win = this.getWindowWidthHeight();
    var maxX = win.width-this.container.getWidth();
    var maxY = win.height-this.container.getHeight();
    var oldPosition = {'left':this.container.style.left, 'right':this.container.style.right, 'top':this.container.style.top, 'bottom':this.container.style.bottom};
    var oldStyle = 'position:absolute; width:100px; height:100px;';

    if(position.left){
      if(position.left>=maxX) position.left = maxX;
      if(position.left<=0) position.left = 0;

      if(position.left+parseFloat($(this.id+'.message').style.width)>=maxX) $(this.id+'.message').morph({'left':'-'+parseFloat($(this.id+'.message').style.width)+'px'});
      if(position.left-parseFloat($(this.id+'.message').style.width)<=0) $(this.id+'.message').morph({'left':this.container.getWidth()+'px'});

      position.left = position.left + 'px';
      if(Object.isUndefined(oldPosition.left) || oldPosition.left=='' || oldPosition.left=='0pt') {
        oldPosition.left = (maxX-parseFloat(oldPosition.right))+'px';
      }
      oldStyle += ' left:'+oldPosition.left+';';
    } else if(position.right){
      if(position.right>=maxX) position.right = maxX;
      if(position.right<=0) position.right = 0;

      if(position.right+parseFloat($(this.id+'.message').style.width)>=maxX) $(this.id+'.message').morph({'left':this.container.getWidth()+'px'});
      if(position.right-parseFloat($(this.id+'.message').style.width)<=0) $(this.id+'.message').morph({'left':'-'+parseFloat($(this.id+'.message').style.width)+'px'});

      position.right = position.right + 'px';
      if(Object.isUndefined(oldPosition.right) || oldPosition.right=='' || oldPosition.right=='0pt') {
        oldPosition.right = (maxX-parseFloat(oldPosition.left))+'px';
      }
      oldStyle += ' right:'+oldPosition.right+';';
    }

    if(position.top){
      if(position.top>=maxY) position.top = maxY;
      if(position.top<=0) position.top = 0;

      position.top = position.top + 'px';
      if(Object.isUndefined(oldPosition.top) || oldPosition.top=='' || oldPosition.top=='0pt') {
        oldPosition.top = (maxY-parseFloat(oldPosition.bottom))+'px';
      }
      oldStyle += ' top:'+oldPosition.top+';';
    } else if(position.bottom){
      if(position.bottom>=maxY) position.bottom = maxY;
      if(position.bottom<=0) position.bottom = 0;

      position.bottom = position.bottom + 'px';
      if(Object.isUndefined(oldPosition.bottom) || oldPosition.bottom=='' || oldPosition.bottom=='0pt') {
        oldPosition.bottom = (maxY-parseFloat(oldPosition.top))+'px';
      }
      oldStyle += ' bottom:'+oldPosition.bottom+';';
    }
    
    this.container.style.cssText = oldStyle;
    this.container.morph(position);
  },
  'showHint':function(position, message, options){
    if(options.status){
      $(this.id+'.hands').src = this.options.imgPath+this.options.hands[options.status];
    }
    $(this.id+'.message').innerHTML = message;
    if(message==''){
      $(this.id+'.message').style.display = 'none';
    } else {
      $(this.id+'.message').style.display = 'block';
      if(options.msgWidth)$(this.id+'.message').style.width = options.msgWidth+'px';
      else $(this.id+'.message').style.width = '250px';
    }
    this.move(position);
    this.show();
  },
	'getWindowWidthHeight':function() {
  	var myWidth = 0, myHeight = 0;
  	if(typeof(window.innerWidth) == 'number'){
  		myWidth = window.innerWidth;
  		myHeight = window.innerHeight;
  	} else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)){
  		myWidth = document.documentElement.clientWidth;
  		myHeight = document.documentElement.clientHeight;
  	} else if(document.body && (document.body.clientWidth || document.body.clientHeight)){
  		myWidth = document.body.clientWidth;
  		myHeight = document.body.clientHeight;
  	}

  	return {'width' : parseFloat(myWidth), 'height' : parseFloat(myHeight)};
  }
});
