//          ________
//          |/\/\/\|
//          | o o  |
//-----oOOO---(_---OOOo---------------------------------------------------------------------------------------
//
// Auteur      : Chanh T.Do [Thoransoft - 2009.01.08]
// Description : fichier contenant les fonctions pour le preview des Div contenant des images ou du texte
// JScript File
//------------------------------------------------------------------------------------------------------------

/**
* @fileOverview
  previewdiv.js [JScript File]: <br>
  Scripts pour afficher les DIV contenant des images ou du texte en preview <br>
  @author: Chanh T.Do [www.thoransoft.com - 2009.01.08] <br>
  Version 1.0 */

divID="preview_template_div";   //ID du div de l'image
var offsetfrommouse=[-80,10];     //image x,y offsets from cursor position in pixels. Enter 0,0 for no offset
var displayduration=0;          //duration in seconds image should remain visible. 0 for always.
var defaultimageheight = 400;   // maximum image size.  Mettre 0 pour aucun offset
var defaultimagewidth = 256;    // maximum image size.
var timer;


/** Fonction permettant d'obtenir le style du div que l'on veut effectuer un preview
    @return object.style */
function gettrailobj()
{
  var e = document.getElementById(divID);
  if (e != undefined) { return e.style; }
  return null;
}


/** Fonction permettant d'obtenir le div que l'on veut effectuer un preview
    @return divElement */
function gettrailobjnostyle()
{
  var e = document.getElementById(divID);
  if (e != undefined) { return e; }
  return null;
}


/** Fonction permettant d'obtenir le body
    @return document.body ou document.Element */
function truebody()
{
  return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}


/** Fonction permettant de cacher le preview div */
function hidetrail()
{
  gettrailobj().display = "none";
  document.onmousemove="";
  gettrailobj().left = "-500px";
  clearTimeout(timer);
}


/** Fonction permettant d'afficher le preview DIV <br>
    NOTE: On peut ajouter plus tard dans cette fonction une animation de chargement
    (pour les grosses images) au besoin.
    @param {string} imgSrc - Attribut SRC de l'image
    @param {string} title - Titre de l'image
    @param {int} width - Largeur de l'image
    @param {int} height - Hauteur de l'image
    @param {int} description - Description de l'image */
function showtrail(imgSrc, title, width, height, description)
{
  var i = imgSrc;
  var t = title;
  var w = width;
  var h = height;
  var d = description;

  //Ajouter une animation au besoin
  timer = setTimeout("show('" + i + "','" + t + "'," + w + "," + h + ",'" + d + "');", 40);
}


/** Fonction permettant d'afficher le l'image dans le preview DIV
    @param {string} imgSrc - Attribut SRC de l'image
    @param {string} title - Titre de l'image
    @param {int} width - Largeur de l'image
    @param {int} height - Hauteur de l'image
    @param {int} description - Description de l'image */
function show(imgSrc, title, width, height, description)
{
  var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth - offsetfrommouse[0];
  var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight);

  if((navigator.userAgent.indexOf("Konqueror")==-1  || navigator.userAgent.indexOf("Firefox")!=-1 ||
     (navigator.userAgent.indexOf("Opera")==-1 && navigator.appVersion.indexOf("MSIE")!=-1)) /*&&
     (docwidth>650 && docheight>500)*/ )
  {
    (width == 0) ? width = defaultimagewidth: '';
    (height == 0) ? height = defaultimageheight: '';
    defaultimageheight = height;
    defaultimagewidth = width;

    document.onmousemove=followmouse;

    var newHTML = '<div>';
    if (title != "") { newHTML += '<h2><b>' + ' ' + title + '</b>' + ' </h2>'; }
    newHTML += '<img src="' + imgSrc + '" alt="" id="imgPrev" ';
    //newHTML += 'style="border-style:solid; border-color:white; border-width:3px; filter:alpha(opacity=0); -moz-opacity:0; opacity:0;">';
    newHTML += 'style="border:3px solid #ffffff;">';
    newHTML += '</div>';

    //Appeller une fonction opacity pour effectuer un fade in de la nouvelle image.
    //Cette fonction est dans le script "/scripts/blendtrans.js"
    //opacity('imgPrev', 0, 100, 1500);

    gettrailobjnostyle().innerHTML = newHTML;
    gettrailobj().display="block";
  }
}


/** Fonction permettant de suivre le preview div à la souris
    @param {event} e - événement de la souris */
function followmouse(e)
{
  var xcoord=offsetfrommouse[0];
  var ycoord=offsetfrommouse[1];
  
  var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15;
  var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight);

  if (typeof e != "undefined")
  {
    if (docwidth - e.pageX < defaultimagewidth + 2*offsetfrommouse[0]) { xcoord = e.pageX - xcoord - defaultimagewidth; /* Move to the left side of the cursor */ }
    else { xcoord += e.pageX; }

    if (docheight - e.pageY < defaultimageheight + 2*offsetfrommouse[1]){ ycoord += e.pageY - Math.max(0,(2*offsetfrommouse[1] + defaultimageheight + e.pageY - docheight - truebody().scrollTop)); }
    else { ycoord += e.pageY; }
  }
  else if (typeof window.event != "undefined")
  {
    if (docwidth - event.clientX < defaultimagewidth + 2*offsetfrommouse[0]){ xcoord = event.clientX + truebody().scrollLeft - xcoord - defaultimagewidth; /* Move to the left side of the cursor */ }
    else { xcoord += truebody().scrollLeft+event.clientX; }

    if (docheight - event.clientY < (defaultimageheight + 2*offsetfrommouse[1])) { ycoord += event.clientY + truebody().scrollTop - Math.max(0,(2*offsetfrommouse[1] + defaultimageheight + event.clientY - docheight)); }
    else { ycoord += truebody().scrollTop + event.clientY; }
  }

  gettrailobj().left=xcoord + "px"
  gettrailobj().top=ycoord + "px"
}


/** Fonction permettant d'afficher un tooltip
    @param {int} width - Largeur du tooltip
    @param {int} height - Hauteur du tooltip
    @param {string} texte - Texte du tooltip */
function ShowTooltip(width, height, texte)
{
  var w = width;
  var h = height;
  var t = texte;

  timer = setTimeout("showme(" + w + "," + h + ",'" + t + "');",40);
}


/** Fonction permettant d'afficher un tooltip
    @param {int} width - Largeur du tooltip
    @param {int} height - Hauteur du tooltip
    @param {string} texte - Texte du tooltip */
function showme(width, height, texte)
{
  var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth - offsetfrommouse[0];
  var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight);

  if ((navigator.userAgent.indexOf("Konqueror")==-1  || navigator.userAgent.indexOf("Firefox")!=-1 || (navigator.userAgent.indexOf("Opera")==-1 && navigator.appVersion.indexOf("MSIE")!=-1)) && (docwidth>650 && docheight>500))
  {
    offsetfrommouse=[0,0];
    defaultimageheight = height + 20;
    defaultimagewidth  = width + 2;
    document.onmousemove=followmouse;

    var newHTML = '<div style="width:'+  width +'px;height:'+ height +'px">' + texte + '<div>';

    gettrailobjnostyle().innerHTML = newHTML;
    gettrailobj().display="block";
  }
}
