Pxxo_Widget_Decorator_Flybox

Ce décorateur peut encapsuler un widget visuellement dans une fenêtre volante que l'on peut déplacée, réduire, …

• Exemple d'utilisation en ligne
• Installer

Ce décorateur est utilisé dans le Showcase. Il est également utilisé dans le Pxxo_Widget_RSS_Flybox comme l'illustre la capture d'écran ci-dessous, et dans Pxxo_Widget_Window

Autre exemple :

Ici on génére un formulaire possédant une zone de saisie de type WYSIWYG qu'on rend “draggable”.

require_once 'Pxxo/Widget/Decorator/Flybox.php';
require_once 'Pxxo/Widget/Form.php';
require_once 'Pxxo/Widget/Input.php';
 
// on génére pour l'exemple un formulaire ayant un champ WYSIWYG
$p = array();
$p['inputs'] = array();
$p['inputs'][] = array('type'  => 'Wysiwyg',
	        'id'    => 'test1',
	        'width'  => 500,
	        'height' => 150,
	        'theme'  => 'office2003');
$obj1 = new Pxxo_Widget_Form($p);
 
// on applique au formulaire le décorateur Flybox
$obj1->addDecorator( new Pxxo_Widget_Decorator_Flybox( array('label'=>'Editeur WYSIWYG','width'=>'520px','height'=>'280px') ) );
 
$obj1->main();
$obj1->dump();

On peut avoir le besoin de cacher une fenêtre volante lors de sa création et ne l'afficher que sur une action précise de l'utilisateur tel qu'un clic ou un survol sur un lien, une image, un bouton , … Pour cela, il faut renseigner le paramètre “visible” à false au constructeur du décorateur. Le décorateur va mettre à disposition une fonction javascript qui se nomme DaD_toggle et prend un unique paramètre : l'oid (cf. paramètre).

Exemple :

...
<img src="<?php echo $chars_png;?>" alt="Caractères accentués et symboles" style="border: none;"
   onclick="DaD_toggle('<?php echo $this->oid ?>');return false;"
/>
...

Cette exemple met en oeuvre une image cliquable qui fera apparaître la fênetre volante dont l'oid vaut $this→oid si celle-ci est cachée et réciproquement la cachera si celle-ci est visible.

Passe la flybox en positionnement absolu sans en changer sa position dans le layout de la page.

Positionne la flybox aux coordonnées passées en paramètres.

Positionne la flybox aux coordonnées passées en paramètres.

Positionne la flybox aux coordonnées passées en paramètres.

Règle le zindex de la flybox.

Cache la zone “paramètrage” générée par le widget décoré si celle-ci existe.

Affiche la zone “paramètrage” générée par le widget décoré si celle-ci existe.

Affiche ou cache la fenêtre volante selon son état.

Affiche ou cache la fenêtre volante modale selon son état. Cette fonction est à utilisée à la place de DaD_toggle(…) pour l'usage de fenêtre modale.

Affiche la fenêtre volante.

Affiche la fenêtre volante modale. Cette fonction est à utilisée à la place de DaD_show(…) pour l'usage de fenêtre modale.

Cache la fenêtre volante.

Cache la fenêtre volante modale. Cette fonction est à utilisée à la place de DaD_hide(…) pour l'usage de fenêtre modale.

Retourne la valeur calculée à partir de l'oid de l'id du container de la flybox.

/* * Retourne la valeur calculée à partir de l'oid de l'id de la div utilisée en mode modal pour rendre inaccesible l'arriere plan * * @param p_id String correspond à l'oid passé en paramètre du decorateur ou le ClassID si celui-ci n'est pas renseigné */

Retourne la valeur calculée à partir de l'oid de l'id de la div utilisée en mode modal pour rendre inaccesible l'arriere plan

/** * Renvoie la taille de la page courante ainsi que la taille de la zone cliente du navigateur */

Renvoie la taille de la page courante ainsi que la taille de la zone cliente du navigateur.

Retour ⇒ Array(pageWidth,pageHeight,windowWidth,windowHeight)