1 |
dpavlin |
919 |
var gr = { |
2 |
|
|
makeGraphs: function() |
3 |
|
|
{ |
4 |
|
|
var list = document.getElementsByTagName( 'UL' ); |
5 |
|
|
for ( var i in list ) |
6 |
|
|
{ |
7 |
|
|
if ( list[i].className && list[i].className.match( / ?graph ?/ ) ) |
8 |
|
|
{ |
9 |
|
|
this.createGraph( list[i] ); |
10 |
|
|
} |
11 |
|
|
} |
12 |
|
|
|
13 |
|
|
}, |
14 |
|
|
createGraph: function( graphList ) |
15 |
|
|
{ |
16 |
|
|
var listItems = new Array(); |
17 |
|
|
var max = 0; |
18 |
|
|
if ( graphList.listItems ) |
19 |
|
|
{ |
20 |
|
|
listItems = graphList.listItems; |
21 |
|
|
max = graphList.maxValue; |
22 |
|
|
} |
23 |
|
|
else |
24 |
|
|
{ |
25 |
|
|
for ( var x in graphList.childNodes ) |
26 |
|
|
{ |
27 |
|
|
if ( graphList.childNodes[x].nodeName == 'LI' ) |
28 |
|
|
{ |
29 |
|
|
listItems.push(graphList.childNodes[x]); |
30 |
|
|
max = ( max <= Number(this.getVal( graphList.childNodes[x] )) ) ? this.getVal( graphList.childNodes[x] ) : max; |
31 |
|
|
} |
32 |
|
|
} |
33 |
|
|
graphList.listItems = listItems; |
34 |
|
|
graphList.maxValue = max; |
35 |
|
|
} |
36 |
|
|
// For now. |
37 |
|
|
max = max * 1.25; |
38 |
|
|
for ( var x = 1; x < listItems.length; x++ ) |
39 |
|
|
{ |
40 |
|
|
var cur = Number( this.getVal(listItems[x-1]) ); |
41 |
|
|
var nex = Number( this.getVal(listItems[x]) ); |
42 |
|
|
if ( cur <= nex ) |
43 |
|
|
{ |
44 |
|
|
listItems[x-1].style.height = cur+'px'; |
45 |
|
|
listItems[x-1].style.borderTopWidth = (nex - cur)+'px'; |
46 |
|
|
listItems[x-1].style.marginTop = ( max - ( cur + ( nex - cur ) ) ) + 'px'; |
47 |
|
|
} |
48 |
|
|
else |
49 |
|
|
{ |
50 |
|
|
listItems[x-1].style.height = nex+'px'; |
51 |
|
|
listItems[x-1].style.borderTopWidth = (cur - nex)+'px'; |
52 |
|
|
listItems[x-1].style.marginTop = (max - ( nex + ( cur - nex ) ) )+'px'; |
53 |
|
|
listItems[x-1].className = 'down'; |
54 |
|
|
if ( listItems[x-1].valSpan ) |
55 |
|
|
{ |
56 |
|
|
listItems[x-1].valSpan.style.top = -17 - (cur - nex )+ 'px'; |
57 |
|
|
} |
58 |
|
|
} |
59 |
|
|
listItems[x].style.height = nex + 'px'; |
60 |
|
|
listItems[x].style.marginTop = ( max - nex )+'px'; |
61 |
|
|
} |
62 |
|
|
if ( listItems[listItems.length-1].className ) |
63 |
|
|
{ |
64 |
|
|
listItems[listItems.length-1].className = 'last '+listItems[listItems.length-1].className; |
65 |
|
|
} |
66 |
|
|
else |
67 |
|
|
{ |
68 |
|
|
listItems[listItems.length-1].className = 'last'; |
69 |
|
|
} |
70 |
|
|
|
71 |
|
|
graphList.className = graphList.className.replace( /graph/, 'graphon' ); |
72 |
|
|
graphList.onclick = function() { gr.toggleGraph( this ) } |
73 |
|
|
}, |
74 |
|
|
stopGraph: function ( graphList ) |
75 |
|
|
{ |
76 |
|
|
for ( var x in graphList.listItems ) |
77 |
|
|
{ |
78 |
|
|
graphList.listItems[x].style.cssText = ''; |
79 |
|
|
} |
80 |
|
|
graphList.className = graphList.className.replace( /graphon/, 'graph' ); |
81 |
|
|
}, |
82 |
|
|
toggleGraph: function( g ) |
83 |
|
|
{ |
84 |
|
|
if ( g.className.match( / ?graphon ?/ ) ) |
85 |
|
|
{ |
86 |
|
|
gr.stopGraph( g ); |
87 |
|
|
} |
88 |
|
|
else |
89 |
|
|
{ |
90 |
|
|
gr.createGraph( g ); |
91 |
|
|
} |
92 |
|
|
}, |
93 |
|
|
getVal: function ( li ) |
94 |
|
|
{ |
95 |
|
|
if ( li.graphValue ) { return li.graphValue } |
96 |
|
|
var val = 0; |
97 |
|
|
for ( var x in li.childNodes ) |
98 |
|
|
{ |
99 |
|
|
if ( li.childNodes[x].className && li.childNodes[x].className == 'val' ) |
100 |
|
|
{ |
101 |
|
|
val = li.childNodes[x].firstChild.nodeValue; |
102 |
|
|
li.valSpan = li.childNodes[x]; |
103 |
|
|
} |
104 |
|
|
} |
105 |
|
|
|
106 |
|
|
li.graphValue = val; |
107 |
|
|
return val; |
108 |
|
|
} |
109 |
|
|
}; |