Κεφάλαιο 3 - Ανάπτυξη και Υλοποίηση της Εφαρμογής
67
3.4.3 Ανάλυση Υλοποίησης Βασικών Λειτουργιών
Οι βασικές λειτουργίες που προσφέρονται επιτρέπουν στον χρήστη την ευκολότερη
ανάλυση των αποτελεσμάτων προσομοίωσης. Οι λειτουργίες αυτές είναι οδηγούμενες από
γεγονότα και ενεργοποιούνται από συγκεκριμένες κινήσεις του χρήστη. Συγκεκριμένα θα
περιγράψουμε παρακάτω την υλοποίηση της χρονικής κλίμακας, της χρονικής μετατόπισης,
της δημιουργίας προσωρινής και μόνιμης σήμανσης επιπλέον πληροφοριών καθώς και την
δυνατότητα λήψης αντιγράφου ως εικόνα.
1.
// Slider's event listener
2. $
(
"#slider_button"
).
mousedown
(
function
(
event
){
3.
if
(
window
.
wave_data
){
4. $
(
'body'
).
on
(
'mousemove'
,
function
(
e
)
{
5.
// Calculate the slider's value
6. offset
=
e
.
pageX
-
$
(
'#slider_main'
).
offset
().
left
-
$
(
'.slider_button'
).
outerWidth
()/
2
;
7. offset
=
Math
.
round
(
offset
);
8.
if
(
offset
<
0
){
offset
=
1
;
}
9.
if
(
offset
>
100
){
offset
=
100
;
}
10.
// move the slider and the info box
11. $
(
"#slider_button"
).
css
(
'left'
,
offset
+
'px'
);
12.
// update the time scale value and redraw the data
13. $
(
"#simulation_zoom"
).
val
(
offset
);
14. draw_wave
(
wave_data
);
15.
// update the info value of the info box
16. $
(
"#slider_info"
).
html
(
offset
+
'%'
);
17.
// prevent default behaviour of mouse drag
18. e
.
preventDefault
();
19.
}).
on
(
'mouseup'
,
function
()
{
20. $
(
'body'
).
unbind
(
"mousemove"
);
21.
});
22.
}
23.
});
Κώδικας 35: waveforms_viewer.js - Αντιμετώπιση γεγονότος για την λειτουργία χρονικής κλίμακας
Η λειτουργία αλλαγής χρονικής κλίμακας ενεργοποιείται με την χρήση ενός ολισθητή
που αντιπροσωπεύει το ποσοστό της κυματομορφής που θα εμφανίζεται. Αρχικά εισάγουμε
ένα γεγονός όπου ενεργοποιείται όταν ο χρήστης πατήσει πάνω στο κουμπί του ολισθητή και
έπειτα, εάν υπάρχουν δεδομένα σημάτων, αντιμετωπίζουμε την κίνηση του ποντικιού και κατά
συνέπεια του ολισθητή (Κώδικας 35, γραμμές 2-4). Στην συνέχεια υπολογίζουμε την θέση του
κουμπιού πάνω στον ολισθητή και την περιορίζουμε σε τιμές από 1 έως 100 (Κώδικας 35,
γραμμές 6-9). Έπειτα κάνουμε την απαραίτητη διόρθωση στην θέση εμφάνισης του κουμπιού,
ανανεώνουμε την τιμή ενός στοιχείου όπου συγκρατεί την τιμή χρονικής κλίμακας,
επανασχεδιάζουμε τις κυματομορφές στην νέα κλίμακα, ανανεώνουμε την τιμή που
εμφανίζεται δίπλα στον ολισθητή και αποτρέπουμε την προκαθορισμένη ενέργεια του
περιηγητή όταν σύρεται το ποντίκι (Κώδικας 35, γραμμές 11-18). Έτσι ολοκληρώνεται η
πρώτη λειτουργία που επιτρέπει την σμίκρυνση ή μεγέθυνση των κυματομορφών και δίνει στον
χρήστη την δυνατότητα εξέτασης των σημάτων με μεγαλύτερη ακρίβεια.