/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: Erik Wikström
  • Date: 2013-05-29 10:55:55 UTC
  • mto: This revision was merged to the branch mainline in revision 125.
  • Revision ID: wikxen@gmail.com-20130529105555-1d0ky37awursga9v
Added display of statistics in the sidepane

Show diffs side-by-side

added added

removed removed

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