Tips.implement({  
  changeHTML: function(element)
  {        
    if($defined($(element.id+'_info')))
      $(element.id+'_info').replaces(this.container)      
  }
})

function init_tooltips()
{
  a = $$('.tooltip')
  a.each(function(tip)
  {          
    var CustomTips = new Tips(tip,{ onShow:function(tip){
      //var fx = new Fx.Morph(tip,{duration:200,})      
      //fx.set({'opacity':1})
      //fx.start({'height':[0,60],'width':[0,160],'opacity':[0,1]})
      var fx = new Fx.Tween(tip,{duration:150});
      fx.start('opacity','0','1')
    },
    onHide: function(tip){
      //var fx = new Fx.Morph(tip,{duration:300})      
      //fx.set({'opacity':1})
      //fx.start({'height':[60,0],'width':[160,0]})
      var fx = new Fx.Tween(tip,{duration:150});
      fx.start('opacity','1','0')        
    }        
    });                        
    CustomTips.changeHTML(tip)        
    tip.addEvent('mouseover',function()
    {
      tip.addClass('selected');            
    })
    tip.addEvent('mouseout',function()
    {
      tip.removeClass('selected')
    })
  })      
}

function init_color_picker(root)
{
  var loading = $('loading');
  var buttons = $('color_buttons').getChildren();
  var colorized_house = $('colorized_house');
  var sel_index = 8;
  root = root || false;
  //init color picker over state
  var myImages = 
  new Asset.images(['/images/beige_o.gif', '/images/blue_o.gif','/images/clay_o.gif','/images/gray_o.gif','/images/green_o.gif',
                    '/images/peach_o.gif','/images/sand_color_o.gif','/images/white_o.gif', '/images/wicker_o.gif']);

  buttons.each(function(button,index)
  {        
    button.addEvent('click',function(e)
    {                              
      e.preventDefault()
      
      var path = '/images/' + button.id+'_house.jpg';
      var fx = new Fx.Tween(loading,{duration:200,transition: Fx.Transitions.Cubic.easeIn})
      fx.start('opacity','0','1')    
      buttons[sel_index].removeClass('selected')
      button.addClass('selected')         
      sel_index = index
      var house_image = new Asset.image(path, {
      onload: function()
      {
        var el = new Element('div',{'class':'house','styles':
        {
          'opacity':'0',
          'background':'url('+path+') 0 0 no-repeat',
          'top':'0',
          'left':'0'
        },'id':'colorized_house'})                      
        colorized_house.empty();     
        el.inject(colorized_house);                    
        var elem_fx = new Fx.Tween(el,{ 
        onComplete:function()
        {
          colorized_house.setStyle('background','url('+path+') 0 0 no-repeat')                        
        },duration:500});        
        elem_fx.start('opacity','0','1')
        fxclose = new Fx.Tween(loading,{duration:200})        
        fxclose.start('opacity','0');
      }});
    })    
  })
}