var myVoteImg = {};
myVoteImg.init = function() {
    var myThumbs = YAHOO.util.Dom.getElementsByClassName('roundcornerimg');
    myVoteImg.myThumbs = myThumbs;
    myVoteImg.imgCnt = myThumbs.length;
    myVoteImg.curImgId = '';
    myVoteImg.myId=-1;
    myVoteImg.today = myVoteImg.getTodayDate();

    myVoteImg.resizeOuterContainer();
    YAHOO.util.Event.addListener(window, "resize", myVoteImg.resizeOuterContainer);
    YAHOO.util.Event.addListener('voteit', "click", myVoteImg.onClickVote);
    YAHOO.util.Event.addListener('voteit', "mousedown", myVoteImg.onVoteMouseDown);
    YAHOO.util.Event.addListener('voteit', "mouseup", myVoteImg.onVoteMouseUp);
    
    myVoteImg.voteImg = document.getElementById('voteit');
    if (myVoteImg.isVoted()){
      myVoteImg.hideVoteImg();
      var server = '/result/'+myVoteImg.today;
      
      var callback =
      {
        success:myVoteImg.handleVote,
        failure:myVoteImg.handleFailure,
        scope: myVoteImg
      };
      YAHOO.util.Connect.asyncRequest('GET', server, callback);
      //myVoteImg.handleVotedImg(myThumbs);
    }else{
      if (navigator.cookieEnabled){
        myVoteImg.regMouseEvt2EachImg(myThumbs);
      }else{
        myVoteImg.dispCookieDisabledErr();
      }
    }
    //lastly create tips, and set image margin:
    var contextElements = []; 
    for (var i=0;i<myThumbs.length;i++){
        myThumbs[i].id  = 'wrapper_'+i;
        if (myThumbs[i].title && myThumbs[i].title.length > 2){
          contextElements[i]=myThumbs[i].id;
        }else{
          myThumbs[i].title = '';
        }
        myVoteImg.setImgTopBottomMargin(i);
    }    
    myVoteImg.myToolTip=new YAHOO.widget.Tooltip("tt", { context:contextElements } ); 
    myVoteImg.errPanel = new YAHOO.widget.Panel("ErrorPanel", { fixedcenter:true,width:"160px", visible:false, constraintoviewport:true } ); 
    myVoteImg.errPanel.render();
    
    //
    myVoteImg.myOuterTable = document.getElementById('MainContainer');

};

myVoteImg.regMouseEvt2EachImg = function (myThumbs) {
    for (var i=0;i<myThumbs.length;i++){
      YAHOO.util.Event.addListener(myThumbs[i], "mouseover", myVoteImg.onImgMouseOver,myThumbs[i]);
      YAHOO.util.Event.addListener(myThumbs[i], "mouseout", myVoteImg.onImgMouseOut,myThumbs[i]);
    }    
};

myVoteImg.dispCookieDisabledErr = function () {
  var el = document.getElementById('GeneralMsg');
  el.innerHTML = 'Please Enable Cookie to Vote the Top Photo!';
  el.style.display="block";
};


myVoteImg.setImgTopBottomMargin = function (i) {
  var elImg = document.getElementById('image_'+i);
  if (elImg && elImg.height < 200){
    var myMargin =Math.round((210 - elImg.height) / 2);
    elImg.style.marginTop = myMargin + 'px';
    elImg.style.marginBottom = myMargin + 'px';
  }
};
myVoteImg.handleVotedImg = function (myThumbs){
  var j = myVoteImg.getVotedIndex();
  var el = myThumbs[j];
  if (el){
    YAHOO.util.Dom.addClass(el,'votedimg');
  }
};
myVoteImg.resizeOuterContainer = function() {
    
    var myel = document.getElementById('votethumblists');        
    var tw = document.body.clientWidth-120;
    var th = document.body.clientHeight;
    var hCnt = Math.ceil(myVoteImg.imgCnt / 3);
    var tw0 = tw ;
    var wCnt = Math.floor(tw0 / 230); 
    
    if (wCnt < 4 ) wCnt = 3;    
    var leftMargin = 0;
    if (tw < 940 || wCnt == 3) {
         
         if (tw > 710) {
            leftMargin = Math.round((tw - 710) / 2);
         }
         myel.style.marginLeft=leftMargin + 'px';
         myel.style.width='710px';
         
         
         myel.style.height= (hCnt * 290 + 30) + 'px';
         return;   
    }

    hCnt = Math.ceil(myVoteImg.imgCnt / wCnt);
        
    leftMargin = Math.round((tw0 - wCnt * 230 - 50 ) / 2);
    
    if (leftMargin < 0) leftMargin = 0;
    
    myel.style.marginLeft=leftMargin + 'px';
    myel.style.width=(wCnt * 230  + 20) + 'px';
    //console.debug(tw+'__'+wCnt+'--'+leftMargin);
    
    myel.style.height= (hCnt * 260 + 30) + 'px';    
    //myel.style.background='#282828';
};

myVoteImg.onImgMouseOver = function(evt,obj) {
    var myel = YAHOO.util.Event.getTarget(evt);      
    //obj.className='roundcornerimg0';
    
    obj.style.background='#414045';
    var w = obj.offsetLeft;
    var h=obj.offsetTop;
    var w0 = w + 65;
    var h0 = h + 210+myVoteImg.myOuterTable.offsetTop;
    myVoteImg.voteImg.style.display="block";
    myVoteImg.voteImg.style.top=h0 + 'px';
    myVoteImg.voteImg.style.left=w0+ 'px';
    var myCurThumb = YAHOO.util.Dom.getElementsByClassName('myOneThumbImg','img',obj);
    myVoteImg.curImgId = '';
    if (myCurThumb && myCurThumb[0]) {
        myVoteImg.curImgId = myCurThumb[0].id;
    }
};
myVoteImg.onImgMouseOut = function(evt,obj) {
    var myel = YAHOO.util.Event.getTarget(evt);        
    //obj.className='roundcornerimg';
    
    if (!myVoteImg.elementInRegion(obj,evt.pageX,evt.pageY)){
        myVoteImg.voteImg.style.display='none';
        obj.style.background='#000';
        myVoteImg.curImgId = '';
    }
};
myVoteImg.elementInRegion =function (el,x,y){
  if (!el) return false;
  var h0 = myVoteImg.myOuterTable.offsetTop;
  if (x > el.offsetLeft && x < (el.offsetLeft+el.offsetWidth) && 
      y > (h0+el.offsetTop) && y < (h0+el.offsetTop + el.offsetHeight)){
    return true;
  }
  
  return false;
};

myVoteImg.getTodayDate = function(evt) {
  var myDate = document.getElementById('publish_date');
  return myDate.innerHTML;
};
myVoteImg.isVoted =function () {
  var strVal = myVoteImg.readCookie('voted');
  if (!strVal) return false;
  if (strVal.indexOf(myVoteImg.today)>=0){
    //console.debug(strVal);
    return true;
  }
  return false;
};
myVoteImg.getVotedIndex =function () {
  var strVal = myVoteImg.readCookie('voted');
  var retVal = strVal.replace(myVoteImg.today+'/','');
  return parseInt(retVal);
};
myVoteImg.createCookie =function (name,value,days) {
  if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
  }
  else var expires = "";
  document.cookie = name+"="+value+expires+"; path=/";
};

myVoteImg.readCookie =function (name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  }
  return null;
};

myVoteImg.eraseCookie =function (name) {
  createCookie(name,"",-1);
};

myVoteImg.onClickVote = function(evt) {
    //console.debug(myVoteImg.curImgId);
    myVoteImg.myId = myVoteImg.curImgId.replace('image_','');
    var server = '/vote/'+myVoteImg.today+'/'+myVoteImg.myId;
    var callback =
    {
      success:myVoteImg.handleVote,
      failure:myVoteImg.handleFailure,
      scope: myVoteImg
    };
    YAHOO.util.Connect.asyncRequest('GET', server, callback);
};
myVoteImg.onVoteMouseDown = function(evt) {
  myVoteImg.voteImg.style.border='2px';
};
myVoteImg.onVoteMouseUp = function(evt) {
  myVoteImg.voteImg.style.border='';
};
myVoteImg.hideVoteImg=function(){
  myVoteImg.voteImg.style.visibility='hidden';
};

myVoteImg.handleVote=function(o){
    //myVoteImg.processResult(o);
    //console.log(o);
    //first set today's cookie
    if (!o.responseText){
      myVoteImg.handleFailure();
      return;
    }
    if (myVoteImg.myId>=0){
      myVoteImg.createCookie('voted',myVoteImg.today+'/'+myVoteImg.myId,1);
    }
    var myVoteResult ={};
    try {
      myVoteResult=eval('('+o.responseText+')');
    }catch (e){
      myVoteImg.handleFailure();
      return;
    }
     
    //console.debug(myVoteResult);
    myVoteImg.hideVoteImg();
    var maxCnt = 1;
    var i=0;
    for (i in myVoteResult){
      if (maxCnt < myVoteResult[i]) maxCnt = myVoteResult[i];
    }
    //draw bar for each element;
    myVoteImg.handleVotedImg(myVoteImg.myThumbs);
    var myCntBars = YAHOO.util.Dom.getElementsByClassName('votecount');
    for (i=0;i<myCntBars.length;i++){
      var val = myVoteResult[i] / maxCnt;
      myVoteImg.showBar(myCntBars[i],val,i,myVoteResult[i]);
      YAHOO.util.Event.purgeElement(myVoteImg.myThumbs[i]);

    }
};

myVoteImg.handleFailure=function(o){
    // Failure handler
    myVoteImg.errPanel.show();
};

myVoteImg.showBar=function(el,val,i,origVal){
    // val is a value 0 to 1;
    var newW = Math.round(val * 200);
    if (newW < 5 && newW > 0) newW = 5;
    if (newW <1) newW = 0;
    el.style.width= newW + 'px';
    el.style.height = '5px';
    el.style.background='#FF00FF';
    el.style.display='block';
    //
    var elVinfo = document.getElementById('vcnt_'+i);
    if (elVinfo) {
      if (origVal < 2){
        elVinfo.innerHTML = '<b>' + origVal + '</b> <small>vote</small>';
      }else {
        elVinfo.innerHTML = '<b>' + origVal + '</b> <small>votes</small>';
      }
      elVinfo.style.display='block';
    }
};

window.addEventListener(
  "load", 
  function() {
    window.setTimeout(
      myVoteImg.init,
      0
    ); 
  },
  true
); 