function uBoard(_boardID,imgRelPath)
{

    this.baordId=_boardID;


    //Zoom
    this.pixelPermm=0.15;

    //width in mm
    this.width=2000;

    //height in mm
    this.height=1500;

    this.minHeight=500;
    this.minWidth=500;

    this.maxHeight=4000;
    this.maxWidth=4000;

    this.color='ff00ff';

    //Logo image names
    this.logoWidth=0;
    this.logoHeight=0;
    this.logoX=1600;
    this.logoY=50;
    this.logoImage='';
    
    this._imgRelPath=imgRelPath||'';
    this._ii=false;
    var obj1=this;
    this.logoOnChange=function(){
        obj1.calcLogoData();
        obj1.onBoardChange(obj1.width,obj1.height,obj1.color,obj1.logoWidth,obj1.logoHeight,obj1.logoX,obj1.logoY,obj1.logoImage);
    };
    this.onBoardChange=function(width,height,color,logoWidth,logoHeight,logoX,logoY,logoImage){};
    
    
    this.init();

    this.onBoardChange(this.width,this.height,this.color,this.logoWidth,this.logoHeight,this.logoX,this.logoY,this.logoImage);

    

     
        

}


uBoard.prototype.init = function()
{
    //Create logo elements
    this.initLogoElements();
    this.changeSize(this.width, this.height);


}


uBoard.prototype.initLogoElements = function()
{
    //Create image object
    if($('#'+this.baordId+'_logo').length==0)
     $('#'+this.baordId).append('<div id="'+this.baordId+'_logo"  style="display:none;position:absolute;width:'+this.inPX(this.logoWidth)+'px;height:'+this.inPX(this.logoHeight)+'px;left:'+this.inPX(this.logoX)+'px;top:'+this.inPX(this.logoY)+'px;" > <img  style="display:block;position:absolute;left:0px;top:0px;" width="100%" height="100%" id="'+this.baordId+'_logo_image"><div class="resize"></div></div>');
 
     this._ii = new $.fn.jqDragResize($('#'+this.baordId+'_logo'),null,'.resize',{container_id:'uboard',onChange:this.logoOnChange});//.jqResize('.resize',{container_id:'uboard',onChange:this.logoOnChange(this)});
     this.changeLogoImage( this.logoImage);
     obj=this;
    $('#'+this.baordId+'_logo img, #'+this.baordId+'_logo,  #'+this.baordId+' ').bind('click',function (){$('#'+obj.baordId+'_logo .resize').hide()});
    $('#'+this.baordId+'_logo img,#'+this.baordId+'_logo').bind('dblclick',function (){$('#'+obj.baordId+'_logo .resize').show()});
     
}

uBoard.prototype.changeLogoImage =function (imgSrc,width,height)
{
   
    this.logoWidth=width||this.logoWidth;
    this.logoHeight=height||this.logoHeight;

    
    if(imgSrc=='')
    {
        $('#'+this.baordId+'_logo').css({'display':'none'});
    }
    else
    {
        

        if(jQuery.browser.msie&&parseInt(jQuery.browser.version.substr(0, 1))<8&&imgSrc.substring(imgSrc.length-3)=='png')
        {
            this._ii._opt.iepng=true;
            $('#'+this.baordId+'_logo').css({'filter':'progid:DXImageTransform.Microsoft.AlphaImageLoader (src=\''+this._imgRelPath+imgSrc+'\',sizingMethod=\'scale\')'});
            $('#'+this.baordId+'_logo img').get(0).src= imgSrc.replace(basename(imgSrc,''),'blank.gif');
        }
        else
        {
            $('#'+this.baordId+'_logo img').get(0).src=this._imgRelPath+imgSrc;
        }
        $('#'+this.baordId+'_logo').css({'display':'block'});
    }

     $('#'+this.baordId+'_logo').css('width',this.inPX(this.logoWidth)+'px');
     $('#'+this.baordId+'_logo').css('height',this.inPX(this.logoHeight)+'px');
    
     this.logoImage= imgSrc;

     this.changeSize(this.width,this.height);
}

uBoard.prototype.calcLogoData = function()
{
    this.logoWidth=this.inmm($('#uboard_logo').width());
    this.logoHeight=this.inmm($('#uboard_logo').height());
    this.logoX=this.inmm($('#uboard_logo').position().left);
    this.logoY=this.inmm($('#uboard_logo').position().top);

}

uBoard.prototype.changeColor = function(hex){
    this.color=hex;
     $('#'+this.baordId).css('background-color','#'+hex);

     this.onBoardChange(this.width,this.height,this.color,this.logoWidth,this.logoHeight,this.logoX,this.logoY,this.logoImage);
}

uBoard.prototype.changeSize = function (width,height)
{
        width=parseFloat(width);
        height=parseFloat(height);
       if(width>this.maxWidth) width=this.maxWidth;
       if(height>this.maxHeight) height=this.maxHeight;
       if(width<this.minWidth) width=this.minWidth;
       if(height<this.minHeight) height=this.minHeight;

       this.width=width;
       this.height=height;

       $('#'+this.baordId).css({'width':this.inPX(width)})
       $('#'+this.baordId).css({'height':this.inPX(height)})

       //Check Logo Size
       if(this.getLogoWidth()> this.getBoardWidth())
           $('#'+this.baordId+'_logo').css({'width':this.inPX(width)});
       if(this.getLogoLeft()+this.getLogoWidth()>this.getBoardWidth())
           $('#'+this.baordId+'_logo').css({'left':this.inPX(this.getBoardWidth()-this.getLogoWidth())})

        if(this.getLogoHeight()> this.getBoardHeight())
           $('#'+this.baordId+'_logo').css({'height':this.inPX(height)});
       if(this.getLogoTop()+this.getLogoHeight()>this.getBoardHeight())
           $('#'+this.baordId+'_logo').css({'top':this.inPX(this.getBoardHeight()-this.getLogoHeight())})

       this.calcLogoData();
       this.onBoardChange(this.width,this.height,this.color,this.logoWidth,this.logoHeight,this.logoX,this.logoY,this.logoImage);
       
}


uBoard.prototype.inPX =function(mm)
{
  return parseInt(mm * this.pixelPermm);
}

uBoard.prototype.inmm =function(Pixel)
{
  return (Pixel / this.pixelPermm);
  
}




uBoard.prototype.getBoardWidth =function(){
    
    return Math.abs(this.inmm($('#'+this.baordId).width())-this.width)<1?this.width:this.inmm($('#'+this.baordId).width());
}
uBoard.prototype.getBoardHeight =function(){
    return Math.abs(this.inmm($('#'+this.baordId).height())-this.height)<1?this.height:this.inmm($('#'+this.baordId).height());
}


uBoard.prototype.getLogoLeft =function(){
    return this.inmm($('#'+this.baordId+'_logo').position().left);
}
uBoard.prototype.getLogoTop =function(){
    return this.inmm($('#'+this.baordId+'_logo').position().top);
}

uBoard.prototype.getLogoWidth =function(){
    return this.inmm($('#'+this.baordId+'_logo').width());
}
uBoard.prototype.getLogoHeight =function(){
    return this.inmm($('#'+this.baordId+'_logo').height());
}



function basename(path, suffix) {
    var b = path.replace(/^.*[\/\\]/g, '');
    if (typeof(suffix) == 'string' && b.substr(b.length-suffix.length) == suffix) {
        b = b.substr(0, b.length-suffix.length);
    }
    return b;
}