6 // compatibilite Ajax : ajouter "this" a "jQuery" pour mieux localiser les actions
7 // et tagger avec cs_done pour eviter de binder plrs fois le meme bloc
8 function glossaire_init() {
9 if(jQuery('span.gl_js', this).length
) {
10 if(!jQuery('#glossOverDiv').length
) {
11 jQuery('body').append('<div id="glossOverDiv" style="position:absolute; display:none; visibility: hidden;"><span class="gl_dl"><span class="gl_dt">TITRE</span><span class="gl_dd">Definition</span></span></div>');
12 gloss_el
= document
.getElementById('glossOverDiv');
13 gloss_dl
= gloss_el
.firstChild
;
14 gloss_dt
= gloss_dl
.firstChild
;
15 gloss_dd
= gloss_dl
.lastChild
;
17 jQuery('span.gl_mot', this).cs_todo().hover(
20 // cas du surligneur (SPIP 2)
21 if(this.firstChild
.className
=="spip_surligne") {
22 this.className
= "gl_mot spip_surligne";
23 this.innerHTML
= this.firstChild
.innerHTML
;
25 gloss_dt
.innerHTML
= $this.parent().children('.gl_js')[0].title
; // titre
26 gloss_dd
.innerHTML
= $this.parent().children('.gl_jst')[0].title
; // definition
27 reg
= $this.css('font-size').match(/^\d\d?(?:\.\d+)?px/);
28 if(reg
) gloss_el
.style
.fontSize
= reg
[0];
30 .css('top', e
.pageY
.toString()+"px")
31 .css('left', e
.pageX
.toString()+"px")
32 .css('font-family', jQuery(this).css('font-family'));
33 gloss_el
.style
.display
= 'block';
34 gloss_el
.style
.visibility
= 'visible';
35 if(typeof jQuery
.fn
.offset
=="function") { // plugin jquery.dimensions disponible a partir de SPIP 2
36 if(1) {///////////////////////// optimisation du placement, encore en test...
37 var $glossOverDiv
= jQuery('#glossOverDiv');
38 var $gloss_dl
= jQuery(gloss_dl
);
39 positionBy
= 'auto'; // Type de positionnement : 'dessus', 'dessous', 'auto', 'mouse' (a tester...)
40 ombre
= 0; // Taille d'une ombre, en pixels (non implemente)
41 decalX
= 2; // decalage entre le glossaire et le lien appelant
42 width
= 180; // largeur totale de #glossOverDiv : definie dans glossaire.css
43 height
= 'auto'; // hauteur totale de #glossOverDiv : 'auto' ou nombre de pixels
44 // initiation verticale
45 var glossHeight
, wHeight
;
46 var linkHeight
= this.offsetHeight
;
47 var defHeight
= isNaN(parseInt(height
, 10)) ? 'auto' : (/\D/g).test(height
) ? height
: height
+ 'px';
48 var sTop
, linkTop
, posY
, mouseY
, baseLine
;
49 sTop
= jQuery(document
).scrollTop();
50 // initiation horizontale
51 var glossWidth
= width
+ ombre
;
52 var linkWidth
= this.offsetWidth
;
53 var linkLeft
, posX
, mouseX
, winWidth
;
54 winWidth
= jQuery(window
).width();
56 linkTop
= posY
= $this.offset().top
;
57 linkLeft
= $this.offset().left
;
60 // securite pour l'instant
61 $glossOverDiv
.css({margin
:'0px'}); $gloss_dl
.css({margin
:'0px'});
62 // calcul de la position horizontale : glossaire au centre du lien
63 posX
= Math
.max(linkLeft
- (glossWidth
-linkWidth
)/2,0);
64 if (positionBy
== 'dessous' || positionBy
== 'dessus') { // glossaire fixe
65 $glossOverDiv
.css({left
: posX
+ 'px'});
67 // au cas ou, glossaire a droite ou a gauche du lien ?
68 posX2
= (linkWidth
> linkLeft
&& linkLeft
> glossWidth
) || (linkLeft
+ linkWidth
+ glossWidth
+ decalX
> winWidth
)
69 ? linkLeft
- glossWidth
- decalX
70 : linkWidth
+ linkLeft
+ decalX
;
72 if (positionBy
== 'mouse' || linkWidth
+ glossWidth
> winWidth
) {
73 posX
= Math
.max(mouseX
- (glossWidth
-linkWidth
)/2,0); // glossaire au centre de la souris
74 /*if (mouseX + 20 + glossWidth > winWidth)
75 posX = (mouseX - glossWidth) >= 0 ? mouseX - glossWidth : mouseX - (glossWidth/2);
79 $glossOverDiv
.css({left
: (posX
> 0 && positionBy
!= 'dessus') ? posX
: (mouseX
+ (glossWidth
/2) > winWidth) ? winWidth/2 - glossWidth
/2 : Math.max(mouseX - (glossWidth/2),0)});
81 // calcul de la position verticale
82 wHeight
= jQuery(window
).height();
83 $glossOverDiv
.css({overflow
: defHeight
== 'auto' ? 'visible' : 'auto', height
: defHeight
});
84 glossHeight
= defHeight
== 'auto' ? Math
.max($gloss_dl
.outerHeight(),$gloss_dl
.height()) : parseInt(defHeight
,10);
87 baseLine
= sTop
+ wHeight
;
88 if (positionBy
== 'dessous') tipY
= posY
+ linkHeight
+ 2; // glossaire fixe sous le lien
89 else if (positionBy
== 'dessus') tipY
= posY
- glossHeight
- 2; // glossaire fixe au-dessus du lien
90 else if ( posX
< mouseX
&& Math
.max(posX
, 0) + glossWidth
> mouseX
) { // glossaire cache le lien
91 if (posY
+ glossHeight
> baseLine
&& mouseY
- sTop
> glossHeight
) {
92 tipY
= posY
- glossHeight
- 2;
94 tipY
= posY
+ linkHeight
+ 2;
96 } else if ( posY
+ glossHeight
> baseLine
) {
97 tipY
= (glossHeight
>= wHeight
) ? sTop
: baseLine
- glossHeight
;
98 } else if ($this.css('display') == 'block' || positionBy
== 'mouse') {
101 tipY
= posY
/*- ombre*/;
103 $glossOverDiv
.css({top
: tipY
+ 'px'});
104 }////////////////////////////////////////
106 } // typeof jQuery.fn.offset=="function"
107 gloss_el
.style
.visibility
= 'visible';
110 gloss_el
.style
.display
= 'none';
111 gloss_el
.style
.visibility
= 'hidden';
115 // accessibilite au clavier
116 if(typeof jQuery
.fn
.offset
=="function") { // plugin jquery.dimensions disponible a partir de SPIP 2
117 jQuery('a.cs_glossaire').focus(
119 legl_mot
= this.firstChild
;
120 gloss_dt
.innerHTML
= jQuery(this).children('.gl_js')[0].title
; // titre
121 gloss_dd
.innerHTML
= jQuery(this).children('.gl_jst')[0].title
; // definition
122 reg
= jQuery(this.firstChild
).css('font-size').match(/^\d\d?(?:\.\d+)?px/);
123 if(reg
) gloss_el
.style
.fontSize
= reg
[0];
124 var result
= jQuery(this).offset({ scroll
: false });
126 .css('top',result
.top
+"px")
127 .css('left', result
.left
+"px")
128 .css('font-family', jQuery(this.firstChild
).css('font-family'));
129 gloss_el
.style
.display
= 'block';
130 gloss_el
.style
.visibility
= 'visible';
133 jQuery('a.cs_glossaire').blur(
135 gloss_el
.style
.display
= 'none';
136 gloss_el
.style
.visibility
= 'hidden';
139 } // typeof jQuery.fn.offset=="function"