Modifies the properties and the contents of the browser's windows

   
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>

  <HEAD>
    <TITLE>JsLib 1.3 - Exemple - fenetres.js</TITLE>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
    <META NAME="Author" CONTENT="Etienne CHEVILLARD">
    <!-- fenetres.js -->
    <SCRIPT TYPE="text/javascript" LANGUAGE="Javascript">
/* fenetres.js
 * Role : modifie les proprietes et le contenu des fenetres du navigateur
 * Projet : JsLib
 * Auteur : Etienne CHEVILLARD (echevillard@users.sourceforge.net)
 * Version : 1.3
 * Creation : 16/09/2002
 * Mise a jour : 23/02/2005
 */

// --- Variables globales ---

// gestion des fenetres
var fntrs_ids=new Array(100);
fntrs_ids[0]="self";
var fntrs_obj=new Array(100);
fntrs_obj[0]=self;
var fntrs_cpt=1;

// --- Fonctions ---

// active la fenetre specifiee en lui donnant le focus
function activerFenetre(id) {
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      if (window.focus) {
        fntrs_obj[i].focus();
        return true;
      } else
        return false;
    }
  }
  return false;
} // fin activerFenetre(id)

// deplace la fenetre specifiee du nombre de pixels specifie
function deplacerFenetreDe(id, px, py) {
  if (isNaN(px)) { px=0; }
  if (isNaN(py)) { py=0; }
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      fntrs_obj[i].moveBy(px,py);
      return true;
    }
  }
  return false;
} // fin deplacerFenetreDe(id, px, py)

// deplace la fenetre specifiee vers les coordonnees specifiees
function deplacerFenetreVers(id, x, y) {
  if ((isNaN(x)) || (parseInt(x)<0)) { x=0; }
  if (parseInt(x)>screen.width) { x=screen.width; }
  if ((isNaN(y)) || (parseInt(y)<0)) { y=0; }
  if (parseInt(y)>screen.height) { y=screen.height; }
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      fntrs_obj[i].moveTo(x,y);
      return true;
    }
  }
  return false;
} // fin deplacerFenetreVers(id, x, y)

// desactive la fenetre en lui enlevant le focus
function desactiverFenetre(id) {
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      if (window.blur) {
        fntrs_obj[i].blur();
        return true;
      } else
        return false;
    }
  }
  return false;
} // fin desactiverFenetre(id)

// modifie les dimensions de la fenetre specifiee
function dimensionsFenetre(id, largeur, hauteur) {
  if ((isNaN(largeur)) || (parseInt(largeur)<10)) { largeur=10; }
  if (parseInt(largeur)>screen.width) { largeur=screen.width; }
  if ((isNaN(hauteur)) || (parseInt(hauteur)<10)) { hauteur=10; }
  if (parseInt(hauteur)>screen.height) { hauteur=screen.height; }
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      fntrs_obj[i].resizeTo(largeur, hauteur);
      return true;
    }
  }
  return false;
}  // fin dimensionsFenetre(id, largeur, hauteur)

// ecrit le code HTML specifie dans une nouvelle fenetre
function ecrireFenetre(id, texte, prop) {
  var fprp;
  if (!texte) { texte="<HTML><BODY></BODY></HTML>"; }
  if (!prop) {
    fprp="toolbar=1,location=1,directories=1,menubar=1,scrollbars=1,resizable=1,status=1";
  } else {
    fprp=prop;
  }
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      fntrs_obj[i]=window.open("about:blank", id, fprp);
      fntrs_obj[i].document.open();
      fntrs_obj[i].document.write(texte);
      fntrs_obj[i].document.close();
      if (window.focus) { fntrs_obj[i].focus(); }
      return true;
    }
  }
  fntrs_ids[fntrs_cpt]=id;
  fntrs_obj[fntrs_cpt]=window.open("about:blank", id, fprp);
  fntrs_obj[fntrs_cpt].document.open();
  fntrs_obj[fntrs_cpt].document.write(texte);
  fntrs_obj[fntrs_cpt].document.close();
  if (window.focus) { fntrs_obj[fntrs_cpt].focus(); }
  fntrs_cpt=fntrs_cpt+1;
  return true;
} // ecrireFenetre(id, texte, prop)

// ecrit le code HTML specifie dans une nouvelle fenetre en mode plein ecran
function ecrirePleinEcran(id, texte) {
  var fprp="fullscreen=1,left=0,top=0,width="+(screen.width-6)+",height="+(screen.height-26);
  ecrireFenetre(id, texte, fprp);
  deplacerFenetreVers(id, 0, 0);
  return true;
}  // fin ecrirePleinEcran(id, texte)

// ecrit le code HTML specifie dans une nouvelle fenetre de type popup
function ecrirePopup(id, texte) {
  var fprp="left="+Math.floor((screen.width-250)/2)+",top="+Math.floor((screen.height-190)/2);
  fprp+=",width=250,height=150,status=0,directories=0,toolbar=0";
  fprp+=",location=0,menubar=0,scrollbars=0,resizable=0";
  ecrireFenetre(id, texte, fprp);
  return true;
}  // fin ecrirePopup(id, texte)

// modifie le contenu de la barre d'etat de la fenetre specifiee
function etatFenetre(id, texte) {
  if (!texte) { texte=""; }
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      fntrs_obj[i].defaultStatus=texte;
      fntrs_obj[i].status=texte;
      return true;
    }
  }
  return false;
}  // fin etatFenetre(id, texte)

// ferme la fenetre
function fermerFenetre(id) {
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      if (i==0)
        fntrs_obj[i].opener=top;
      fntrs_obj[i].close();
      fntrs_ids[i]="";
      return true;
    }
  }
  return false;
} // fin fermerFenetre(id)

// ouvre l'URL specifiee dans une fenetre
function ouvrirFenetre(id, url, prop) {
  var fprp;
  if (!url) { url="about:blank"; }
  if (!prop) {
    fprp="toolbar=1,location=1,directories=1,menubar=1,scrollbars=1,resizable=1,status=1";
  } else {
    fprp=prop;
  }
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      fntrs_obj[i]=window.open(url, id, fprp);
      if (window.focus) { fntrs_obj[i].focus(); }
      return true;
    }
  }
  fntrs_ids[fntrs_cpt]=id;
  fntrs_obj[fntrs_cpt]=window.open(url, id, fprp);
  if (window.focus) { fntrs_obj[fntrs_cpt].focus(); }
  fntrs_cpt=fntrs_cpt+1;
  return true;
} // fin ouvrirFenetre(id, url, prop)

// ouvre l'URL specifiee en plein ecran
function ouvrirPleinEcran(id, url) {
  var fprp="fullscreen=1,left=0,top=0,width="+(screen.width-6)+",height="+(screen.height-26);
  ouvrirFenetre(id, url, fprp);
  deplacerFenetreVers(id, 0, 0);
  return true;
}  // fin ouvrirPleinEcran(id, url)

// ouvre l'URL specifiee dans une fenetre de type popup
function ouvrirPopup(id, url) {
  var fprp="left="+Math.floor((screen.width-250)/2)+",top="+Math.floor((screen.height-150)/2);
  fprp+=",width=250,height=150,status=0,directories=0,toolbar=0";
  fprp+=",location=0,menubar=0,scrollbars=0,resizable=0";
  ouvrirFenetre(id, url, fprp);
  return true;
}  // fin ouvrirPopup(id, url)

// redirige la fenetre vers l'URL specifiee
function redirigerFenetre(id, url) {
  if (!url) { url="about:blank"; }
  for (var i=0; i<fntrs_cpt; i++) {
    if (fntrs_ids[i]==id) {
      if (window.location.replace) fntrs_obj[i].location.replace(url);
      else fntrs_obj[i].location.href=url;
      return true;
    }
  }
  return false;
} // fin redirigerFenetre(id, url)

    </SCRIPT>
  </HEAD>

  <BODY>
    <H1>JsLib 1.3</H1>
    <HR>
    <H2>Exemple - fenetres.js</H2>

    <NOSCRIPT>
      <P><I>Erreur : votre navigateur ne reconnait pas le Javascript ou est configur&eacute; pour ne
      pas prendre en compte le code Javascript. Dans ce dernier cas, vous pouvez modifier la
      configuration dans les pr&eacute;f&eacute;rences/options de votre navigateur.</I>
      <HR>
    </NOSCRIPT>

    <FORM ACTION="GET" NAME="f1">
    
      <P>Ouvrir une nouvelle fen&ecirc;tre :<BR>
        <INPUT TYPE="text" NAME="t1" VALUE="http://www.google.fr/" SIZE=50><BR>
        <INPUT TYPE="button" VALUE="Fen&ecirc;tre (fen1)" onClick="ouvrirFenetre('fen1', this.form.t1.value)">
        <INPUT TYPE="button" VALUE="Plein &eacute;cran (ecr1)" onClick="ouvrirPleinEcran('ecr1', this.form.t1.value)">
        <INPUT TYPE="button" VALUE="Popup (pop1)" onClick="ouvrirPopup('pop1', this.form.t1.value)">

      <P>Cr&eacute;er une nouvelle page Web dans une nouvelle fen&ecirc;tre :<BR>
        <TEXTAREA NAME="t2" ROWS=5 COLS=50>
&lt;HTML&gt;
&lt;HEAD&gt;&lt;TITLE&gt;Test&lt;/TITLE&gt;&lt;/HEAD&gt;
&lt;BODY&gt;Page de test&lt;/BODY&gt;
&lt;/HTML&gt;</TEXTAREA><BR>
        <INPUT TYPE="button" VALUE="Fen&ecirc;tre (fen2)" onClick="ecrireFenetre('fen2', this.form.t2.value)">
        <INPUT TYPE="button" VALUE="Plein &eacute;cran (ecr2)" onClick="ecrirePleinEcran('ecr2', this.form.t2.value)">
        <INPUT TYPE="button" VALUE="Popup (pop2)" onClick="ecrirePopup('pop2', this.form.t2.value)">

      <P>Fermer une fen&ecirc;tre :<BR>
        <INPUT TYPE="button" VALUE="Fermer cette fen&ecirc;tre" onClick="fermerFenetre('self')">
        <INPUT TYPE="button" VALUE="Fermer fen1" onClick="fermerFenetre('fen1')">

      <P>Placer une fen&ecirc;tre au premier plan ou &agrave; l'arri&egrave;re-plan (fen 1) :<BR>
        <INPUT TYPE="button" VALUE="Activer fen1" onClick="activerFenetre('fen1')">
        <INPUT TYPE="button" VALUE="D&eacute;sactiver fen1" onClick="desactiverFenetre('fen1')">

      <P>D&eacute;placer une fen&ecirc;tre (fen 1) :<BR>
        <P>Position absolue (coordonn&eacute;es en pixels) :<BR>
          X= <INPUT TYPE="text" NAME="t3" SIZE=5 VALUE="150">
          Y= <INPUT TYPE="text" NAME="t4" SIZE=5 VALUE="150">
          <INPUT TYPE="button" VALUE="D&eacute;placer fen1" onClick="deplacerFenetreVers('fen1', parseInt(this.form.t3.value), parseInt(this.form.t4.value))">
      <TABLE SUMMARY="" BORDER=0 CELLSPACING=0 CELLPADDING=0><TR><TD>
        Position relative (incr&eacute;ment de 10 pixels) :&nbsp;
      </TD><TD ALIGN=CENTER>
        &nbsp;&nbsp;&nbsp;<INPUT TYPE="button" VALUE="Haut" onClick="deplacerFenetreDe('fen1', 0, -10)"><BR>
        <INPUT TYPE="button" VALUE="Gauche" onClick="deplacerFenetreDe('fen1', -10, 0)">
        <INPUT TYPE="button" VALUE="Bas" onClick="deplacerFenetreDe('fen1', 0, 10)">
        <INPUT TYPE="button" VALUE="Droite" onClick="deplacerFenetreDe('fen1', 10, 0)">
      </TD></TR></TABLE>

      <P>Modifier la largeur et la hauteur d'une fen&ecirc;tre (fen1) :<BR>
        <P>Dimensions (en pixels) :&nbsp;<BR>
        Largeur = <INPUT TYPE="text" NAME="t5" SIZE=10 VALUE="400">
        Hauteur = <INPUT TYPE="text" NAME="t6" SIZE=10 VALUE="300">
        <INPUT TYPE="button" VALUE="Redimensionner fen1" onClick="dimensionsFenetre('fen1', parseInt(this.form.t5.value), parseInt(this.form.t6.value))">

      <P>Modifier le contenu de la barre d'&eacute;tat d'une fen&ecirc;tre (fen1) :<BR>
        <INPUT TYPE="text" NAME="t7" VALUE="texte &agrave; placer dans la barre d'&eacute;tat" SIZE=50>
        <INPUT TYPE="button" VALUE="Mettre &agrave; jour fen1" onClick="etatFenetre('fen1', this.form.t7.value)">

      <P>Rediriger une fen&ecirc;tre vers une autre URL (fen1) :<BR>
        <INPUT TYPE="text" NAME="t8" VALUE="http://www.yahoo.fr/" SIZE=50>
        <INPUT TYPE="button" VALUE="Rediriger fen1" onClick="redirigerFenetre('fen1', this.form.t8.value)">

    </FORM>

  </BODY>
</HTML>
Related examples in the same category

1.	Access window properties
2.	Displaying the Associative Properties Area of a Window Object
3.	Change status bar with mouse click
4.	Output tag name from window event to status bar
5.	Change window location
6.	Open a new window and load new page
7.	Set text for windows status bar
8.	References to Window Objects
9.	A Main Window Document
10.	Open a new window with your own options
11.	X/Y Marks the Spot for a popup window (IE)
Modifies the properties and the contents of the browser's windows : Window Properties « Window Browser « JavaScript DHTML

Related examples in the same category
