author | Dan |
Sun, 24 Aug 2008 12:42:50 -0400 | |
changeset 706 | 397954f99873 |
parent 582 | a38876c0793c |
child 740 | 098e744df928 |
permissions | -rw-r--r-- |
1 | 1 |
// Sliding drawers on the sidebar |
2 |
||
3 |
// our global vars |
|
4 |
// the delay between the slide in/out, and a little inertia |
|
5 |
||
6 |
var sliders_initted = false; |
|
7 |
||
582
a38876c0793c
Majorly reworked Javascript runtime stuff to use on-demand loading.
Dan
parents:
362
diff
changeset
|
8 |
var initSliders = function() |
1 | 9 |
{ |
10 |
sliders_initted = true; |
|
57
b354deeaa4c4
Vastly improved compatibility with older versions of IE, particularly 5.0, through the use of a kill switch that turns off all AJAX functions
Dan
parents:
1
diff
changeset
|
11 |
if ( KILL_SWITCH ) |
b354deeaa4c4
Vastly improved compatibility with older versions of IE, particularly 5.0, through the use of a kill switch that turns off all AJAX functions
Dan
parents:
1
diff
changeset
|
12 |
return false; |
1 | 13 |
// detect whether the user has ie or not, how we get the height is different |
14 |
var useragent = navigator.userAgent.toLowerCase(); |
|
15 |
var ie = ((useragent.indexOf('msie') != -1) && (useragent.indexOf('opera') == -1) && (useragent.indexOf('webtv') == -1)); |
|
16 |
||
17 |
if(ie) |
|
18 |
return; |
|
19 |
||
20 |
var divs = getElementsByClassName(document, "div", "slideblock"); |
|
21 |
||
22 |
for(var i=0; i<divs.length; i++) |
|
23 |
{ |
|
24 |
// set a unique id for this slider |
|
25 |
divs[i].metaid = i; |
|
26 |
||
27 |
// get the original height |
|
28 |
var baseheight = (ie) ? divs[i].offsetHeight + "px" : document.defaultView.getComputedStyle(divs[i], null).getPropertyValue('height', null); |
|
29 |
||
30 |
// use cookies to toggle whether to display it or not |
|
31 |
var id = ( divs[i].parentNode.firstChild.nextSibling ) ? divs[i].parentNode.firstChild.nextSibling.firstChild : divs[i].parentNode.parentNode.firstChild.nextSibling.firstChild; |
|
32 |
||
362
02d315d1cc58
Started localization on User CP. Localized pagination, password strength, and various other small widgets. Fixed bug in path manager causing return of fullpage from get_page_id_from_url() even when namespace is Special.
Dan
parents:
57
diff
changeset
|
33 |
if ( !id.nextSibling ) |
02d315d1cc58
Started localization on User CP. Localized pagination, password strength, and various other small widgets. Fixed bug in path manager causing return of fullpage from get_page_id_from_url() even when namespace is Special.
Dan
parents:
57
diff
changeset
|
34 |
return; |
02d315d1cc58
Started localization on User CP. Localized pagination, password strength, and various other small widgets. Fixed bug in path manager causing return of fullpage from get_page_id_from_url() even when namespace is Special.
Dan
parents:
57
diff
changeset
|
35 |
|
1 | 36 |
if(id.innerHTML || id.nextSibling.length < 1) id = id.innerHTML; |
37 |
else id = id.nextSibling.innerHTML; // Gecko fix |
|
38 |
||
39 |
var cookieName = 'mdgSliderState_'+i; // id.replace(' ', '_'); |
|
40 |
//alert(cookieName + ': ' + readCookie(cookieName)); |
|
41 |
if(readCookie(cookieName)=='closed') |
|
42 |
{ |
|
43 |
divs[i].style.display = "none"; |
|
44 |
} |
|
45 |
else |
|
46 |
{ |
|
47 |
divs[i].style.display = "block"; |
|
48 |
} |
|
49 |
||
50 |
// "save" our div height, because once it's display is set to none we can't get the original height again |
|
51 |
var d = new div(); |
|
52 |
d.el = divs[i]; |
|
53 |
d.ht = baseheight.substring(0, baseheight.indexOf("p")); |
|
54 |
||
55 |
// store our saved version |
|
56 |
divheights[i] = d; |
|
57 |
} |
|
58 |
} |
|
59 |
||
582
a38876c0793c
Majorly reworked Javascript runtime stuff to use on-demand loading.
Dan
parents:
362
diff
changeset
|
60 |
addOnloadHook(initSliders); |
a38876c0793c
Majorly reworked Javascript runtime stuff to use on-demand loading.
Dan
parents:
362
diff
changeset
|
61 |
|
1 | 62 |
// this is one of our divs, it just has a DOM reference to the element and the original height |
63 |
function div(_el, _ht) |
|
64 |
{ |
|
65 |
this.el = _el; |
|
66 |
this.ht = _ht; |
|
67 |
} |
|
68 |
||
69 |
function toggle(t) |
|
70 |
{ |
|
71 |
if(IE) |
|
72 |
return false; |
|
57
b354deeaa4c4
Vastly improved compatibility with older versions of IE, particularly 5.0, through the use of a kill switch that turns off all AJAX functions
Dan
parents:
1
diff
changeset
|
73 |
if ( KILL_SWITCH ) |
b354deeaa4c4
Vastly improved compatibility with older versions of IE, particularly 5.0, through the use of a kill switch that turns off all AJAX functions
Dan
parents:
1
diff
changeset
|
74 |
return false; |
1 | 75 |
if ( !sliders_initted ) |
76 |
initSliders(); |
|
77 |
// reset our inertia base and interval |
|
78 |
inertiabase = inertiabaseoriginal; |
|
79 |
clearInterval(slideinterval); |
|
80 |
||
81 |
// get our block |
|
82 |
block = t.parentNode.nextSibling; |
|
83 |
||
84 |
// for mozilla, it doesn't like whitespace between elements |
|
85 |
if(block.className == undefined) |
|
86 |
block = t.parentNode.nextSibling.nextSibling; |
|
87 |
||
88 |
if(block.style.display == "none") |
|
89 |
{ |
|
90 |
block.style.display = "block"; |
|
91 |
block.style.height = "1px"; |
|
92 |
||
93 |
// our goal and current height |
|
94 |
targetheight = divheight(block); |
|
95 |
heightnow = 1; |
|
96 |
||
97 |
// remember toggled state |
|
98 |
cookieName = 'mdgSliderState_'+block.metaid; // t.innerHTML.replace(' ', '_'); |
|
99 |
createCookie(cookieName, 'open', 3650); |
|
100 |
||
101 |
// our interval |
|
102 |
slideinterval = setInterval(slideout, slideintervalinc); |
|
103 |
} |
|
104 |
else |
|
105 |
{ |
|
106 |
// our goal and current height |
|
107 |
targetheight = 1; |
|
108 |
heightnow = divheight(block); |
|
109 |
||
110 |
// remember toggled state |
|
111 |
cookieName = 'mdgSliderState_'+block.metaid; // t.innerHTML.replace(' ', '_'); |
|
112 |
createCookie(cookieName, 'closed', 3650); |
|
113 |
||
114 |
// our interval |
|
115 |
slideinterval = setInterval(slidein, slideintervalinc); |
|
116 |
} |
|
117 |
} |
|
118 |
||
119 |
// this is our slidein function the interval uses, it keeps subtracting |
|
120 |
// from the height till it's 1px then it hides it |
|
121 |
function slidein() |
|
122 |
{ |
|
123 |
if(heightnow > targetheight) |
|
124 |
{ |
|
125 |
// reduce the height by intertiabase * inertiainc |
|
126 |
heightnow -= inertiabase; |
|
127 |
||
128 |
// increase the intertiabase by the amount to keep it changing |
|
129 |
inertiabase += inertiainc; |
|
130 |
||
131 |
// it's possible to exceed the height we want so we use a ternary - (condition) ? when true : when false; |
|
132 |
block.style.height = (heightnow > 1) ? heightnow + "px" : targetheight + "px"; |
|
133 |
} |
|
134 |
else |
|
135 |
{ |
|
136 |
// finished, so hide the div properly and kill the interval |
|
137 |
clearInterval(slideinterval); |
|
138 |
block.style.display = "none"; |
|
139 |
} |
|
140 |
} |
|
141 |
||
142 |
// this is the function our slideout interval uses, it keeps adding |
|
143 |
// to the height till it's fully displayed |
|
144 |
function slideout() |
|
145 |
{ |
|
146 |
block.style.display = 'block'; |
|
147 |
if(heightnow < targetheight) |
|
148 |
{ |
|
149 |
// increases the height by the inertia stuff |
|
150 |
heightnow += inertiabase; |
|
151 |
||
152 |
// increase the inertia stuff |
|
153 |
inertiabase += inertiainc; |
|
154 |
||
155 |
// it's possible to exceed the height we want so we use a ternary - (condition) ? when true : when false; |
|
156 |
block.style.height = (heightnow < targetheight) ? heightnow + "px" : targetheight + "px"; |
|
157 |
||
158 |
} |
|
159 |
else |
|
160 |
{ |
|
161 |
// finished, so make sure the height is what it's meant to be (inertia can make it off a little) |
|
162 |
// then kill the interval |
|
163 |
clearInterval(slideinterval); |
|
164 |
block.style.height = targetheight + "px"; |
|
165 |
} |
|
166 |
} |
|
167 |
||
168 |
// returns the height of the div from our array of such things |
|
169 |
function divheight(d) |
|
170 |
{ |
|
171 |
for(var i=0; i<divheights.length; i++) |
|
172 |
{ |
|
173 |
if(divheights[i].el == d) |
|
174 |
{ |
|
175 |
return divheights[i].ht; |
|
176 |
} |
|
177 |
} |
|
178 |
} |
|
179 |
||
180 |
/* |
|
181 |
the getElementsByClassName function I pilfered from this guy. It's |
|
182 |
a useful function that'll return any/all tags with a specific css class. |
|
183 |
||
184 |
Written by Jonathan Snook, http://www.snook.ca/jonathan |
|
185 |
Add-ons by Robert Nyman, http://www.robertnyman.com |
|
186 |
||
187 |
Modified to match all elements that match the class name plus an integer after the name |
|
188 |
This is used in Enano to allow sliding sidebar widgets that use their own CSS |
|
189 |
*/ |
|
190 |
function getElementsByClassName(oElm, strTagName, strClassName) |
|
191 |
{ |
|
192 |
// first it gets all of the specified tags |
|
193 |
var arrElements = (strTagName == "*" && document.all) ? document.all : oElm.getElementsByTagName(strTagName); |
|
194 |
||
195 |
// then it sets up an array that'll hold the results |
|
196 |
var arrReturnElements = new Array(); |
|
197 |
||
198 |
// some regex stuff you don't need to worry about |
|
199 |
strClassName = strClassName.replace(/\-/g, "\\-"); |
|
200 |
||
201 |
var oRegExp = new RegExp("(^|\\s)" + strClassName + "([0-9]*)(\\s|$)"); |
|
202 |
var oElement; |
|
203 |
||
204 |
// now it iterates through the elements it grabbed above |
|
205 |
for(var i=0; i<arrElements.length; i++) |
|
206 |
{ |
|
207 |
oElement = arrElements[i]; |
|
208 |
||
209 |
// if the class matches what we're looking for it ads to the results array |
|
210 |
if(oElement.className.match(oRegExp)) |
|
211 |
{ |
|
212 |
arrReturnElements.push(oElement); |
|
213 |
} |
|
214 |
} |
|
215 |
||
216 |
// then it kicks the results back to us |
|
217 |
return (arrReturnElements) |
|
218 |
} |
|
219 |