comparison pylons_app/lib/helpers.py @ 292:d7aeae23c56d

tooltip updates, added display layout managment inspired by jQuerys tipsy.
author Marcin Kuzminski <marcin@python-works.com>
date Wed, 23 Jun 2010 18:14:27 +0200
parents 5827c739b0bd
children 68dc70295a76
comparison
equal deleted inserted replaced
291:a61b19036de0 292:d7aeae23c56d
116 //have last commit message 116 //have last commit message
117 myToolTips.contextMouseOverEvent.subscribe( 117 myToolTips.contextMouseOverEvent.subscribe(
118 function(type, args) { 118 function(type, args) {
119 var context = args[0]; 119 var context = args[0];
120 var txt = context.getAttribute('tooltip_title'); 120 var txt = context.getAttribute('tooltip_title');
121 if(txt){ 121 if(txt){
122 this.cfg.config.x.value = 0;
123 this.cfg.config.y.value = 0;
124
125 return true; 122 return true;
126 } 123 }
127 else{ 124 else{
128 return false; 125 return false;
129 } 126 }
131 128
132 129
133 // Set the text for the tooltip just before we display it. Lazy method 130 // Set the text for the tooltip just before we display it. Lazy method
134 myToolTips.contextTriggerEvent.subscribe( 131 myToolTips.contextTriggerEvent.subscribe(
135 function(type, args) { 132 function(type, args) {
133
134
136 var context = args[0]; 135 var context = args[0];
136
137 var txt = context.getAttribute('tooltip_title'); 137 var txt = context.getAttribute('tooltip_title');
138 this.cfg.setProperty("text", txt); 138 this.cfg.setProperty("text", txt);
139 //autocenter 139
140 var w = this.element.clientWidth; 140
141 var h = this.element.clientHeight; 141 // positioning of tooltip
142 var cur_x = this.pageX - (w / 2); 142 var tt_w = this.element.clientWidth;
143 var cur_y = this.pageY - h - 10; 143 var tt_h = this.element.clientHeight;
144 144
145 this.cfg.setProperty("xy",[cur_x,cur_y]); 145 var context_w = context.offsetWidth;
146 var context_h = context.offsetHeight;
147
148 var pos_x = YAHOO.util.Dom.getX(context);
149 var pos_y = YAHOO.util.Dom.getY(context);
150
151 var display_strategy = 'top';
152 var xy_pos= [0,0]
153 switch (display_strategy){
154
155 case 'top':
156 var cur_x = (pos_x+context_w/2)-(tt_w/2);
157 var cur_y = pos_y-tt_h-4;
158 xy_pos = [cur_x,cur_y];
159 break;
160 case 'bottom':
161 var cur_x = (pos_x+context_w/2)-(tt_w/2);
162 var cur_y = pos_y+context_h+4;
163 xy_pos = [cur_x,cur_y];
164 break;
165 case 'left':
166 var cur_x = (pos_x-tt_w-4);
167 var cur_y = pos_y-((tt_h/2)-context_h/2);
168 xy_pos = [cur_x,cur_y];
169 break;
170 case 'right':
171 var cur_x = (pos_x+context_w+4);
172 var cur_y = pos_y-((tt_h/2)-context_h/2);
173 xy_pos = [cur_x,cur_y];
174 break;
175
176 }
177
178 this.cfg.setProperty("xy",xy_pos);
146 179
147 }); 180 });
181
148 //Mouse out 182 //Mouse out
149 myToolTips.contextMouseOutEvent.subscribe( 183 myToolTips.contextMouseOutEvent.subscribe(
150 function(type, args) { 184 function(type, args) {
151 var context = args[0]; 185 var context = args[0];
152 186
153 //console.log(this.cfg.config.x.value);
154 //console.log(this.cfg.config.y.value);
155 //console.log(this.cfg.config.xy.value);
156 //console.log(this.cfg.config);
157 //this.cfg.config.xy = [0,0];
158 //this.cfg.config.xyoffset = [0,0];
159
160
161
162 }); 187 });
163
164 }); 188 });
165 ''' 189 '''
166 return literal(js) 190 return literal(js)
167 191
168 tooltip = _ToolTip() 192 tooltip = _ToolTip()