/lenasys/trunk

To get this branch, use:
bzr branch http://gegoxaren.bato24.eu/bzr/lenasys/trunk

« back to all changes in this revision

Viewing changes to Widget Library/sliders.js

  • Committer: Gustav Hatvigsson
  • Date: 2013-05-31 06:15:46 UTC
  • mfrom: (90.1.20 lenasys2)
  • Revision ID: gustav.hartvigsson@gmail.com-20130531061546-vj8z28sq375kvghq
Merged Jonsson:s changes:
Fixed the layout on cms index so the arrows and dots marks expanded objects.
Fixed so the course content is sorted by course occasion and not by name

Show diffs side-by-side

added added

removed removed

Lines of Context:
Widget Library/sliders.js
1
 
/* 
2
 
 
3
 
Widget Code!
4
 
 
5
 
*/
6
 
 
7
 
// Fixes css3 for IE
8
 
function attachPIE() {
9
 
        $('*').each(function() {
10
 
                PIE.attach(this);
11
 
        });
12
 
}
13
 
 
14
 
// Creates a demo
15
 
function createDemoSliders() {
16
 
        str = "";
17
 
        str += makePanel(250, 200);
18
 
        str += makeLabel("Slider");
19
 
        str += makeSlider("slider", 1, 2, 7, 4.5, 160, 5);
20
 
        str += makeLabel("Binary");
21
 
        str += makeBinary("binary", 0);
22
 
        str += makePanelEnd();
23
 
        document.getElementById("container").innerHTML = str;
24
 
        attachPIE();
25
 
 
26
 
}
27
 
 
28
 
// Recursive Pos of div in document - should work in most browsers
29
 
function findPos(obj) {
30
 
        var curLeft = curTop = 0;
31
 
        if (obj.offsetParent) {
32
 
                curLeft = obj.offsetLeft
33
 
                curTop = obj.offsetTop
34
 
                while (obj = obj.offsetParent) {
35
 
                        curLeft += obj.offsetLeft
36
 
                        curTop += obj.offsetTop
37
 
                }
38
 
        }
39
 
        return {
40
 
                x:curLeft,
41
 
                y:curTop
42
 
        }
43
 
}
44
 
 
45
 
/*
46
 
 
47
 
ui read widget functions
48
 
 
49
 
*/
50
 
 
51
 
function readSlider(sliderId) {
52
 
        var value = parseFloat(document.getElementById(sliderId + "box").value);
53
 
        if (isNaN(value)) {
54
 
                value = 0.0;
55
 
        }
56
 
        return value;
57
 
}
58
 
 
59
 
function readBinary(binaryId) {
60
 
        lf = document.getElementById(binaryId + "marker").style.left;
61
 
        if (lf == "2px") {
62
 
                return 0;
63
 
        } else {
64
 
                return 1;
65
 
        }
66
 
}
67
 
 
68
 
/*
69
 
 
70
 
ui change widget functions
71
 
 
72
 
*/
73
 
 
74
 
// The idea is to have a few functions like this one and minimum javascript intervention                
75
 
function updateBinary(event, binaryId) {
76
 
        if (mb) {
77
 
                coords = findPos(event.currentTarget);
78
 
                coords.x = event.clientX - coords.x;
79
 
                coords.y = event.clientY - coords.y;
80
 
                if(coords.x > 24) {
81
 
                        document.getElementById(binaryId + "marker").style.left = 20 + "px";                                                                            
82
 
                        document.getElementById(binaryId).style.backgroundColor = "#ddd";                                                                               
83
 
                }else if(coords.x < 16) {
84
 
                        document.getElementById(binaryId + "marker").style.left = 2 + "px";                                                                                                                                             
85
 
                        document.getElementById(binaryId).style.backgroundColor = "#777";                                                                               
86
 
                }
87
 
        }
88
 
}
89
 
 
90
 
// The idea is to have a few functions like this one and minimum javascript intervention                
91
 
function updateSlider(event, kind, min, max, length, sliderId, boxId) {
92
 
        if (mb) {
93
 
                coords = findPos(event.currentTarget);
94
 
                coords.x = event.clientX - coords.x;
95
 
                coords.y = event.clientY - coords.y;
96
 
                cx = coords.x / length;
97
 
                sd = max - min;
98
 
                value = min + (sd * cx);        
99
 
                if (value > max) value = max;
100
 
                if (kind == 0) {
101
 
                        value = Math.round(value);
102
 
                }
103
 
                if (kind == 1) {
104
 
                        value = Math.round(value * 10.0) / 10.0;
105
 
                }
106
 
                if (kind == 2) {
107
 
                        value = Math.round(value * 100.0) / 100.0;
108
 
                }
109
 
                if (kind == 3) {
110
 
                        value = Math.round(value * 1000.0) / 1000.0;
111
 
                }
112
 
                document.getElementById(boxId).value = value;                           
113
 
                document.getElementById(sliderId).style.left = Math.ceil((length) * ((value - min) / sd)) + "px";
114
 
        }
115
 
}
116
 
                
117
 
function sliderPosition(value, min, max, length) {
118
 
                if (value < min) {
119
 
                        value = min;
120
 
                }
121
 
                if (value > max) {
122
 
                        value = max;
123
 
                }
124
 
                pos = Math.round(((value - min) / (max - min)) * length);
125
 
                return pos;
126
 
}
127
 
 
128
 
function changeSlider(value, sliderId, kind, min, max, length) {
129
 
                value = parseFloat(value);              
130
 
                if (isNaN(value)) {
131
 
                        value = 0.0;
132
 
                }
133
 
                if (value < min) {
134
 
                        value = min;
135
 
                }
136
 
                if (value > max) {
137
 
                        value = max;
138
 
                }
139
 
                if (kind == 0) {
140
 
                        value = Math.round(value);
141
 
                }
142
 
                if (kind == 1) {
143
 
                        value = Math.round(value * 10.0) / 10.0;
144
 
                }
145
 
                if (kind == 2) {
146
 
                        value = Math.round(value * 100.0) / 100.0;
147
 
                }
148
 
                if (kind == 3) {
149
 
                        value = Math.round(value * 1000.0) / 1000.0;
150
 
                }
151
 
                pos = sliderPosition(value, min, max, length);
152
 
                document.getElementById(sliderId + "box").value = value;
153
 
                document.getElementById(sliderId + "marker").style.left = pos + "px";                                                                           
154
 
}
155
 
 
156
 
/*
157
 
 
158
 
ui make widget functions
159
 
 
160
 
*/
161
 
 
162
 
function makeLabel(name) {
163
 
        s = "";
164
 
        s += "<div class='label'>" + name + "</div>";
165
 
        return s;               
166
 
}
167
 
 
168
 
function makePanel(width, height) {
169
 
        s = "";         
170
 
        s += "<div class='panel' style='height: " + height + "px; width: " + width + "px;'>";
171
 
        return s;
172
 
}
173
 
 
174
 
function makePanelEnd() {
175
 
        s = "</div>";
176
 
        return s;               
177
 
}
178
 
 
179
 
function makeSlider(sliderId, kind, minValue, maxValue, midValue, sliderWidth, defaultValue) {
180
 
        s = "";
181
 
        defaultPosition = sliderPosition(defaultValue, minValue, maxValue, sliderWidth);
182
 
        if (defaultValue < minValue) {
183
 
                defaultValue = minValue;
184
 
        }
185
 
        if (defaultValue > maxValue) {
186
 
                defaultValue = maxValue;
187
 
        }                                       
188
 
        s += "<input id='" + sliderId + "box' value='" + defaultValue + "' type='text' class='sliderBox' onBlur='changeSlider(this.value,\"" + sliderId + "\"," + kind + "," + minValue + "," + maxValue + "," + sliderWidth + ");'>";
189
 
        s += "<div id='" + sliderId + "' class='sliderLine' style='width:" + sliderWidth + "px;'";
190
 
        s += " onmousemove='updateSlider(event," + kind + "," + minValue + "," + maxValue + "," + sliderWidth + ",\"" + sliderId + "marker\",\"" + sliderId + "box\");'";
191
 
        s += " onmouseup='updateSlider(event," + kind + "," + minValue + "," + maxValue + "," + sliderWidth + ",\"" + sliderId + "marker\",\"" + sliderId + "box\");'>";
192
 
        s += " <div id='" + sliderId + "marker' class='sliderMarker' style='left:" + defaultPosition + "px;'></div>";
193
 
        s += "</div>";
194
 
        s += "<div class='slidermidValue' style='width:" + sliderWidth + "px;'>" + midValue;
195
 
        s += "<div class='sliderminValue'>" + minValue + "</div>";
196
 
        s += "<div class='slidermaxValue'>" + maxValue + "</div></div>";
197
 
        return s;
198
 
}
199
 
 
200
 
function makeBinary(binaryId, defaultValue) {
201
 
        s = "";
202
 
        if (defaultValue == 1) {
203
 
                defaultPosition = 20;
204
 
                defaultColor = "#ddd";
205
 
        } else {
206
 
                defaultPosition = 2;
207
 
                defaultColor = "#777";
208
 
        }
209
 
        s += "<div id='" + binaryId + "' class='binaryLine' style='background-color:" + defaultColor + ";' onmousemove='updateBinary(event,\"" + binaryId + "\");' onmouseup='updateBinary(event,\"" + binaryId + "\");'>";
210
 
        s += "<div id='" + binaryId + "marker' class='binaryMarker' style='left:" + defaultPosition + "px;'></div>";
211
 
        s += "</div>";
212
 
        return s;
213
 
}
214
 
 
215
 
var mb = 0;
216
 
 
217
 
function mbPress(event) {
218
 
        mb = 1;
219
 
}
220
 
 
221
 
function mbRelease(event) {
222
 
        mb = 0;
223
 
}
 
 
b'\\ No newline at end of file'