77004011c58e78af6aedd1c74176ce57202be539
[plewww.git] / planetlab / includes / plc_toggles.php
1 <?php
2
3   // $Id$
4
5 require_once 'prototype.php';
6
7 drupal_set_html_head('
8 <script type="text/javascript" src="/planetlab/js/plc_toggles.js"></script>
9 <link href="/planetlab/css/plc_toggles.css" rel="stylesheet" type="text/css" />
10 ');
11
12 // This is for creating an area that users can hide and show
13 // It is logically made of 3 parts:
14 // (*) area is what gets hidden and shown
15 // (*) trigger is the area that can be clicked for toggling
16 // (*) image contains a visual indication of the current status
17 // 
18 // constructor needs 
19 // (*) id:      an 'id', used for naming the three parts
20 // (*) trigger: the html text for the trigger
21 // (*) options: a hash that can define
22 //      - trigger-tagname : to be used instead of <span> for wrapping the trigger
23 //      - trigger-bubble : might not work if trigger-tagname is redefined
24 //      - init-hidden : start hidden rather than visible
25 // 
26 // methods are as follows
27 // (*) trigger_html (): return the html code for the trigger
28 // (*) image_html ():   returns the html code for the image
29 // (*) area_start ():   because we have too many places where php 'prints' code instead 
30 // (*) area_end():        of returning it, we do not expect the code for the area to be passed
31 //                        so these methods can be used to delimit the area in question
32
33 class PlcToggle {
34   // mandatory
35   var $id;
36
37   function PlcToggle ($id,$trigger,$options=NULL) {
38     $this->id = $id;
39     $this->trigger=$trigger;
40     if ( ! $options ) $options = array();
41     if (array_key_exists ('start-visible',$options)) {
42       $options['start-hidden'] = ! $options['start-visible'];
43       unset ($options['start-visible']);
44     }
45     $this->options = $options;
46   }
47
48   // the simple, usual way to use it :
49   // a container that contains the switch and the area in sequence
50   function start ()             { print $this->start_html(); }
51   function start_html () {
52     $html = "";
53     $html .= $this->container_start();
54     $html .= $this->trigger_html();
55     $html .= $this->area_start_html();
56     return $html;
57   }
58
59   function end ()               { print $this->end_html(); }
60   function end_html () {
61     $html = "";
62     $html .= $this->area_end_html();
63     $html .= $this->container_end();
64     return $html;
65   }
66
67
68   // create two images that get shown/hidden - could not find a better way to do it
69   function image_html () {
70     $html="";
71     if ( ! $this->options['start-hidden'])      { $x1=""; $x2=" style='display:none'"; }
72     else                                        { $x2=""; $x1=" style='display:none'"; }
73     $image_id=$this->id_name('image-visible');
74     $html .= "<img id=$image_id class='plc-toggle-visible' src='/planetlab/icons/toggle-visible.png'$x1>";
75     $image_id=$this->id_name('image-hidden');
76     $html .= "<img id=$image_id class='plc-toggle-hidden' src='/planetlab/icons/toggle-hidden.png'$x2>";
77     return $html;
78   }
79
80   function trigger ()           { print $this->trigger_html(); }
81   function trigger_html () {
82     $trigger_id=$this->id_name('trigger');
83     if (array_key_exists ('trigger-tagname',$this->options)) $tagname=$this->options['trigger-tagname'];
84     if (array_key_exists ('trigger-bubble',$this->options)) $bubble=$this->options['trigger-bubble'];
85     if (empty($tagname)) $tagname="span";
86     
87     $html="<$tagname";
88     $html .= " id=$trigger_id";
89     $html .= " class=plc-toggle-trigger";
90     if ($bubble) $html .= " title='$bubble'";
91     $html .= " onclick=\"plc_toggle('$this->id')\"";
92     $html .= ">";
93     $html .= $this->image_html();
94     $html .= $this->trigger;
95     $html .= "</$tagname>";
96     return $html;
97   }
98
99   function area_start () { print $this->area_start_html(); }
100   function area_start_html () {
101     $area_id=$this->id_name('area');
102     $html="";
103     $html .= "<div";
104     $html .= " class=plc-toggle-area";
105     $html .= " id=$area_id";
106     if ($this->options['start-hidden']) $html .= " style='display:none'";
107     $html .= ">";
108     return $html;
109   }
110
111   function area_end () { print $this->area_end_html(); }
112   function area_end_html () {
113     return "</div>";
114   }
115
116   /* if desired, you can embed the whole (trigger+area) in another div for visual effects */
117   function container_start ()           { print $this->container_start_html(); }
118   function container_start_html ()      { 
119     $html="<div class='plc-toggle-container'";
120     $id=$this->id_name('container');
121     $html .= " id='$id'";
122     $html .= ">";
123     return $html;
124   }
125
126   function container_end ()             { print $this->container_end_html(); }
127   function container_end_html ()        { return "</div>"; }
128
129   // build id names
130   function id_name ($zonename) { return "toggle-$zonename-$this->id"; }
131
132 }
133
134 ?>