ΙΙ ΙΛ ΧΙΛΚΗ ΕΡΓΑΣΙΑ. Ανάπτυξη όικτυακού /ιόρου για την υλοποίηση των εφαρμογίόν δημόσιας συζήτησης. και συζήτησης /ρηστιόν σε πραγματικό /ρόνο"

Transcript

1 A.T.E.l. ΚΑΒΑΛΑ! ΤΜΗΜΑ ΔΙΑΧΕΙΡΙΣΗ! ΠΛΗΡΟΦΟΡΙΩΝ ΙΙ ΙΛ ΧΙΛΚΗ ΕΡΓΑΣΙΑ Ανάπτυξη όικτυακού /ιόρου για την υλοποίηση των εφαρμογίόν δημόσιας συζήτησης. και συζήτησης /ρηστιόν σε πραγματικό /ρόνο" Ονομα σπουδαστή : Μ ιχαηλίδης Σπάρτακος Επιβλέπων καθηγητής : Μαρδΰρης Βασίλειος ΚΑΒΑΑΑ 2006

2 Α.Τ.Ε.Ι. ΚΑΒΑΛΑΣ ΤΜΗΜΑ ΔΙΑΧΕΙΡΙΣΗΣ ΠΛΗΡΟΦΟΡΙΩΝ Κ α Β α α α. ^ΗΡθ οριο«πτυχιακη ΕΡΓΑΣΙΑ Ανάπτυξη δικτυακού χώρου για την υλοποίηση των εφαρμογών δημόσιας συζήτησης, και συζήτησης χρηστιόν σε πραγματικό χρόνο Όνομα σπουδαστή : Μ ιχαηλίδης Σπάρτακος Επιβλέπων καθηγητής : Μαρδύρης Βασίλειος ΚΑΒΑΑΑ 2006

3 ΕΥΧΑΡΙΣΤΙΕΣ Ολοκληρώνοντας τις σπουδές μου στο Τμήμα Διαχείρισης Πληροφοριών και συγκεκριμένα παρακολουθώντας τα μαθήματα «Διαχείριση Πληροφοριών στο Διαδίκτυο» και «Διαχείριση Βάσεων Δεδομένων στο Διαδίκτυο» προέκυψε το ενδιαφέρον μου για τέτοιου είδους εφαρμογές. Θέλω να ευχαριστήσω τον καθηγητή μου κ. Βασίλειο Μαρδύρη που δέχτηκε να εισηγηθεί την πτυχιακή μου εργασία, τις πολύ χρήσιμες συμβουλές που μου έδωσε κατά τη διάρκεια του εξαμήνου και γενικότερα για τη καλή συνεργασία που είχαμε όλο αυτό το διάστημα. Επίσης θέλω να ευχαριστήσω τους σπουδαστές του Τμήματος Διαχείρισης Πληροφοριών: τον φίλο μου Βασίλειο Ανανιάδη για την βοήθειά του στο κώδικα της εφαρμογής και τον αδελφό μου Αχιλλέα Μιχαηλίδη στη μορφοποίηση (design) της εφαρμογής μου.

4 ΠΕΡΙΕΧΟ Μ ΕΝΑ ΕΙΣΑΓΩΓΗ ΚΕΦΑΛΑΙΟ HTML Τι είναι η HTM L Εκδόσεις HTML Δημιουργία αρχείων HTM L Κατασκευή σελίδων με κώδικα HTM L Το Μοντέλο Αντικειμένων της Δυναμικής HTML ( DHTML ) T C L Τι είναι η T C L Χαρακτηριστικά της T C L Πλεονεκτήματα T C L Λάθη στη T C L Τι συμβαίνει μετά από ενα λάθος Η HTML μέσα σε αρχείο T C L Βάση δεδομένων MySQL Ιστορικά στοιχεία Apache Τι είναι Apache Ιστορικά στοιχεία για την ονομασία Apache CGI Scripting JavaScript Τι είναι η JavaScript Ιστορικά στοιχεία της JavaScript Τοποθέτηση του κώδικα JavaScript... ΚΕΦΑΛΑΙΟ Σχεδιασμός και περιγραφή Βάσης Δεδομένων Δομή της Βάσης Δεδομένων Σχέσεις μεταξύ πινάκων Περιγραφή της Βάσης Δεδομένων Περιγραφή σελίδων και οι τρόποι υλοποίησής τους Σκοπός και λειτουργία Σχεδιασμός σελίδων Κατασκευή της εφαρμογής Περιγραφή σε^δων και του κώδικα ΠΑΡΑΡΤΗΜΑ... ΒΙΒΛΙΟΓΡΑΦΙΑ, INTERNET

5 Ένα από τα σημαντικότερα στάδια στη πορεία ενός σπουδαστή των ΤΕΙ είναι η τπυχιακή του εργασία στην οποία παρουσιάζει την μελέτη που έχει κάνει για ένα συγκεκριμένο θέμα. Η πτυχιακή μου εργασία ασχολείται με μια εφαρμογή που ο σκοπός της είναι να δίνει τη δυνατότητα στους σπουδαστές του τμήματος Διαχείριση Πληροφοριών να επικοινωνούν μεταξύ τους είτε μέσω του ίοτυπι στο οποίο μπορούν να θέσουν ερωτήσεις (απορίες) και να λάβουν τις αντίστοιχες απαντήσεις για κάποιο συγκεκριμένο θέμα, είτε μέσω μιας ζωντανής συνομιλίας μεταξύ τους (chat). Chat σημαίνει να κρατάς μια ζωντανή συζήτηση, χρησιμοποιώντας το πληκτρολόγιο, με άλλα άτομα μέσα στο Internet. Δηλαδή, κάποιος πληκτρολογεί ένα μήνυμα στον υπολογιστή του και άλλα άτομα στο Internet μπορούν να το διαβάσουν στον δικό τους υπολογιστή άμεσα. Μπορείτε δηλαδή να συνομιλήσετε με πολλά άτομα ταυτόχρονα σε ολόκληρο τον κόσμο. Υπάρχουν πολλοί διαθέσιμοι τρόποι να συνομιλήσει κανείς στο Internet, αλλά ο πιο δημοφιλής ονομάζεται IRC (Internet Relay Chat). Κάθε μέρα χιλιάδες άνθρωποι σε όλο τον κόσμο συνομιλούν χρησιμοποιώντας το chat. Επίσης μπορείτε να κάνετε συνομιλία με ένα άτομο ανεξάρτητα. Με το IRC διευκολύνονται οι επικοινωνίες κατά την διάρκεια φυσικών καταστροφών, πολέμων και άλλων κρίσεων. Ατττό παράδειγμα το 1993, κατά την πτώση του Σοβιετικού καθεστώτος, όταν οι ρώσοι ταμπουρώθηκαν μέσα στο κτίριο του κοινοβουλίου, δημιουργήθηκε ένα ειδησεογραφικό κανάλι IRC για την αναμετάδοση των γεγονότων σε πραγματικό χρόνο. Το IRC ακολουθεί το μοντέλο client/server, που σημαίνει ότι πρέπει να υπάρχουν και τα δύο προγράμματα, client και server, για να το χρησιμοποιήσετε. Πολλοί IRC clients υπάρχουν διαθέσιμοι για κάθε τύπο υπολογιστή, οπότε είτε έχετε μηχάνημα με Windows, Unix ή Macintosh θα μπορέσετε να το χρησιμοποιήσετε χωρίς πρόβλημα. Ο δικός σας IRC client επικοινωνεί με έναν IRC server στο Internet. Forum είναι ένας τύπος Bulletin Board και είναι ειδικά διαμορφωμένος χώρος στο internet όπου χρηστές από διάφορα μέρη του κόσμου θέτουν ερωτήσεις για διάφορα θέματα στα οποία έχουν απορίες με σκοπό να λάβουν απαντήσεις από τους άλλους χρήστες του forum. Αυτός ο τρόπος επικοινωνίας θεωρείται πολύ δημοφιλής καθώς όλο και περισσότεροι χρήστες δείχνουν μεγάλο ενδιαφέρον σ αυτό τον τρόπο επικοινωνίας.

6 Η εφαρμογή με την οποία ασχολήθηκα υλοποιεί τους δύο παραπάνω τρόπους επικοινωνίας χρηστών (ίοτυπι και chat) για τους οποίους χρησιμοποίησα (HTML, TCL, το σύστημα διαχείρισης βάσεων δεδομένων MySQL, JavaScript και Apache Server, CGI Scripting).

7 ΚΕΦ ΑΛΑΙΟ Τι είναι η HTML; Η HTML είναι το ακρωνύμιο των λέξεων Hyper Text Markup Language (γλώσσα μορφοποίηση υπερκειμένοο) και είναι η βασική γλώσσα δόμηση σελίδων τσυ World Wide Web (ή απλά ιστού; Web). Χρησιμοποιείται για να σημαίνει ένα τμήμα κειμένου και να το κάνει να εμφανίζεται καλύτερα. Επιτρέπει την ενσωμάτωση ήχου και εικόνων στις web σελίδες. Αρχικά είχε κατασκευασθεί με σκοπό μόνο την μορφοποίηση κειμένου, αλλά μεγάλωσε και ενσωμάτωσε σχεδιαστικές τεχνικές κ.α. Η γλώσσα χρησιμοποιεί ένα αριθμό από tags για την μορφοποίηση κειμένου, για την δημιουργία συνδέσμων (links) μετάβασης ανάμεσα των σελίδα, για την εισαγωγή εικόνων, ήχου κ.α. Όταν ένας Web Browser ανοίγει ένα αρχείο HTML τα στοιχεία (tags) μεταφράζονται σε κατάλληλα χαρακτηριστικά με αποτελέσματα στην εμφάνιση και στην λειτουργικότητα της συγκεκριμένης σελίδας. Tag ονομάζουμε μία οδηγία γραμμένη σε HTML, την οποία πρέπει να αναγνωρίσει και ερμηνεύσει ο browser. Τα tags βρίσκονται πάντοτε μεταξύ των συμβόλων < και >. Π.χ. η οδηγία για να γίνει ένα κείμενο bold είναι: <b>to κείμενο που θα είναι bold </b> Εκδόσεις HTML To 1990 ο Tim Berners-Lee από το Cern, το εργαστήριο φυσικής της Γενεύης, δημιούργησε ένα νέο πρωτόκολλο με το οποίο θα μπορούσαν να μεταφέρονται κάθε είδος αρχείων και αντικειμένων μέσα από το Internet. Το πρωτόκολλο αυτό ονομάστηκε HTTP (HyperText Transfer Protocol) και σηματοδότησε την αρχή ταυ WWW όπως το ξέρουμε σήμερα. Οι σελίδες που ήταν η βάση του WWW ήτας γραμμένες στην πρώτη έκδοση της γλώσσα HTML. Το 1994 αναπτύσσεται το πρότυπο HTML 2.0 από ένα διεθνή οργανισμό (Internet Engineering Task Forse). Η επόμενη έκδοση η 3.0 δεν έγινε αποδεκτή από τις Microsoft και Netscape οπότε γρήγορα αντικαταστάθηκε από την έκδοση 3.2 (1996). Η τελευταία περιελάμβανε πολλές από τις σημάνσεις (tags) παυ είχαν εισάγει οι δύο εταιρίες. Η έκδοση 4.0 παρουσιάστηκε τον Ιούνιο του 1997.

8 1.1.3 Δημιουργία αρχείων HTML Η δημιουργία αρχείων HTML είναι πολύ απλή. Αρκεί να τρέξουμε έναν οποιοδήποτε διορθωτή κειμένου text, όπως το Notepad των Windows ή το EditPlus, να γράψουμε τον κώδικα HTML που επιθυμούμε και να το αποθηκεύσουμε (σώσουμε) σε ένα αρχείο με κατάληξη.htm ή.html. Συνήθως αποθηκεύουμε με επέκταση.html όταν θα δημοσιεύσουμε τα αρχεία μας σε διακομιστή Unix. Αντίθετα ο εξυπηρετητής Windows NT καταλαβαίνει τα αρχεία και σαν.htm και σαν.html. Γράφοντας αυτό τον παρακάτω κώδικα και αποθηκεύοντας το με όνομα.html έχουμε δημιουργήσει ένα αρχείο html. <html> <head> </head> <body> </body> </html> Κατασκευή σελίδων με κώδικα HTML Ο χρυσός κανόνας της μηχανικής αναφέρει πως "ό,τι κερδίζουμε σε δρόμο το χάνουμε σε δύναμη". Με άλλα λόγια, αν δεν θέλουμε να χρησιμοποιήσουμε μεγάλη δύναμη, θα πρέπει να καταβάλουμε προσπάθεια για μεγαλύτερο χρονικό διάστημα, ενώ αν θέλουμε να μειώσουμε το χρόνο υλοποίησης θα πρέπει να αφιερώσουμε περισσότερη ισχύ ή πόρους στο έργο. Ανάλογα διλήμματα συναντούμε σε πολλές ανθρώπινες δραστηριότητες και η κατασκευή web σελίδων δεν αποτελεί εξαίρεση μια και η δημιουργία τους μπορεί να επιτευχθεί με δύο πολύ διαφορετικούς τρόπους: Ο εύκολος: Δηλαδή, να χρησιμοποιηθεί ένα αυτόματο πρόγραμμα όπως το Frontpage για να σχεδιαστεί η σελίδα με τρόπο ανάλογο της δημιουργίας ενός εγγράφου στο word. Ο δύσκολος: Δηλαδή, να δημιουργηθούν τα πάντα από το μηδέν με τη χρήση κώδικα HTML. Τα πλεονεκτήματα του εύκολου τρόπου είναι: > Ταχύτητα εκμάθησης - Ο χρήστης μπορεί να δημιουργήσει τις πρώτες του σελίδες μέσα σε μερικές ώρες. > Ταχύτητα λειτουργίας - Ένα site μπορεί να κατασκευαστεί σε πολύ μικρό χρονικό διάστημα.

9 > Ταχύτητα ανανέωσης - Το πρόγραμμα φροντίζει για την αυτόματη ενημέρωση των web σελίδων του server με όλες τις αλλαγές που έχουν γίνει μετά την τελευταία ανανέωση. Τα πλεονεκτήματα του δύσκολου τρόπου είναι: > Σελίδες που φορτώνουν πιο γρήγορα - Τα αυτόματα προγράμματα τοποθετούν συχνά άχρηστο κώδικα που μπερδεύει τον browser και καθυστερεί την εμφάνιση της σελίδας. > Εξυττνότερη σχεδίαση - Μας είναι ευκολότερο να δημιουργήσουμε σελίδες που θα προσαρμόζονται αυτόματα στις ιδιαιτερότητες της οθόνης κάθε χρήστη (π.χ. χρησιμοποιώντας ποσοστά αντί για απόλυτες τιμές στο πλάτος των tables). > Καλύτερος έλεγχος του αποτελέσματος - Κάθε αυτόματο πρόγραμμα αποτελεί ουσιαστικά έναν μεταφραστή που μετατρέπει τη σχεδίαση και τις επιθυμίες μας σε γλώσσα HTML. Καμία μετάφραση όμως δεν είναι άψογη (ειδικά αν γίνεται από υπολογιστή) και πολλά σημαντικά στοιχεία κινδυνεύουν να απαλειφθούν από το τελικό αποτέλεσμα. > Υψηλότερη ευελιξία - Μπορούμε να χρησιμοποιήσουμε το σύνολο των δυνατοτήτων της γλώσσας HTML, ενώ κάθε αυτόματο πρόγραμμα υποστηρίζει μόνο ένα υποσύνολο αυτών. > Ευκολότερη επίλυση προβλημάτων (debugging) - Επειδή κατανοούμε απόλυτα τις ιδιομορφίες και τα χαρακτηριστικά της σελίδας που δημιουργήσαμε, μπορούμε να βρούμε ευκολότερα και να διορθώσουμε τα όποια προβλήματα εμφανιστούν σε αυτήν (π.χ. ασυμβατότητα με κάποιους browsers). > Επέκταση σε άλλα γνωστικά αντικείμενα - Όποιος γνωρίζει κώδικα HTML μπορεί πολύ ευκολότερα να κατανοήσει και να αξιοποιήσει άλλες τεχνολογίες όπως XML, scripting κ.λ.π. Οι περισσότεροι άνθρωποι προτιμούν τα αυτόματα προγράμματα δημιουργίας σελίδων (τον εύκολο τρόπο δηλαδή) επειδή τα πλεονεκτήματά τους είναι προφανή και άμεσης απόδοσης. Τσ γεγονός όμως ότι όλοι οι καλοί επαγγελματίες web designers γνωρίζουν και χρησιμοποιούν τόσο κώδικα όσο και αυτόματα προγράμματα υποδεικνύει τη μεγάλη χρησιμότητα και των δύο προσεγγίσεων.

10 1.1.5 To Μοντέλο Αντικειμένων της Δυναμικής HTML ( DHTML ) Η DHTML είναι ένα όνομα δοσμένο από τη Netscape και τη Microsoft για τη χρήση του μοντέλου αντικειμένων του εγγράφου, των διαδοχικών στυλ των φύλλων και των σεναρίων, για να γίνουν οι ιστοσελίδες πιο αλληλεπιδραστικές. Χρησιμοποιώντας αυτές τις τεχνολογίες οι χρήστες μπορούν να φτιάξουν τις ιστοσελίδες τους έτσι ώστε να αλλάζουν κατά τη χρήση και να αλληλεπιδρούν με χρήστες χωρίς επαναφόρτωση. Η διεθνής εταιρική συνεργασία του παγκόσμιου ιστού επανεξετάζει τις προτάσεις σχετικά με την τυποποίηση του μοντέλου αντικειμένων του εγγράφου, τίποτα δεν έχει ολοκληρωθεί ακόμα. Η Microsoft και η Netscape υποστηρίζουν DHTML στις εκδόσεις 4.0 και μετά με τους αντίστοιχους browsers. Η DHTML περιέχει κυρίως σενάρια και η ιδέα ότι οι συγγραφείς θα έπρεπε να έχουν τη δυνατότητα να προγραμματίζουν αλλαγές στην εμφάνιση της ιστοσελίδας χωρίς επαναφόρτωση είναι μια σημαντική αλλαγή που περιέχει η DHTML. Στην πραγματικότητα οτιδήποτε που δημιουργείται με DHTML θα πρέπει να προστεθεί σενάριο χρησιμοποιώντας JavaScript ή VBScript στις σελίδες. Εάν το κείμενό βασίζεται στη JavaScript ή στη VBScript εξαρτάται από τον χρήστη. Όμως από τότε που η JavaScript υποστηρίζεται από δύο browsers, ενώ η VBScript εκτελείται μόνο στον Internet Explorer θα ήταν πιο εύκολο να χρησιμοποιείται browser συμβατό με τη DHTML όταν χρησιμοποιείται η JavaScript. Δεν υπάρχει τρόπος να εμποδίσει κανείς την αντιγραφή του κώδικά στις HTML σελίδες, συμπεριλαμβανομένου και του κώδικα που σχετίζεται με τη DHTML.

11 1.2.1 Τι είναι η TCL; Η TCL είναι μια γλώσσα για έλεγχο και επέκταση εφαρμογών. Μας παρέχει μια ποικιλία γενικών προγραμματιστικών λειτουργιών, όπως μεταβλητές, διαδικασίες και δομές ελέγχου. Ο διερμηνέας του (INTERPRETER) είναι μια βιβλιοθήκη από διαδικασίες της C που μπορούν πολύ εύκολα να ενσωματωθούν σε διάφορες εφαρμογές και να τις επεκτείνουν. Αλλά και τα βασικά χαρακτηριστικά του TCL μπορούν να επεκταθούν από μια εφαρμογή. Είναι γλώσσα υψηλού επιπέδου και πιο αφαιρετική σε σχέση με την γλώσσα C και ο ίδιος κώδικας τρέχει σε πλατφόρμες Windows, Linux, Unix, Macintosh. Η TCL ανατπύχθηκε από τον John Ousterhout στο πανεπιστήμιο της Καλιφόρνιας στο Μπέρκλευ Χαρακτηριστικά της TCL Η TCL μας παρέχει τις απαραίτητες δομές και λειτουργίες ώστε να μπορέσουμε να γράψουμε δομημένα προγράμματα, δηλαδή μας παρέχει μεταβλητές, πίνακες, στοιχειοσειρές, τελεστές, λίστες, εκφράσεις, εντολές, συναρτήσεις, διαδικασίες, δομές έλεγχου, αρχεία και χειρισμό λαθών. Κάποια από τα χαρακτηριστικά της είναι τα ακόλουθα: > Είναι δυναμική Script γλώσσα > Παρέχει γρήγορη ανάτπυξη εφαρμογών > Είναι ιδανική "glue language" δηλαδή μπορεί εύκολα να ενσωματωθεί και σε άλλες γλώσσες όπως η C και η > Οι χρήστες δημιουργούν εύκολα εφαρμογές χωρίς να χρειάζεται να εμβαθύνουν σε πολύπλοκα χαρακτηριστικά της γλώσσας Πλεονεκτήματα TCL Τα πλεονεκτήματα του είναι η ταχεία ανάπτυξη εφαρμογών, αφού σε TCL μπορούν να γραφτούν GUI με λιγότερο κώδικα και σε υψηλότερο επίπεδο από ότι σε εργαλεία βασισμένα σε προγραμματισμό C. Το TCL είναι μια διερμηνευμένη γλώσσα, έτσι μπορούν να γραφτούν και να εκτελεστούν εφαρμογές στη στιγμή χωρίς επαναμετάφραση η επανεκκίνηση της εφαρμογής, καθώς επίσης μπορούν στιγμιαία να δοκιμαστούν νέες ιδέες και να διορθωθούν λάθη. Το TCL μπορεί να ενσωματωθεί πολύ εύκολα σε οποιαδήποτε εφαρμογή και να της δώσει καινούργιες δυνατότητες επέκτασης. Είναι μια γλώσσα η οποία μπορεί πολύ εύκολα να ενσωματώσει διαφορετικά πακέτα βιβλιοθηκών με εντολές TCL. Ακόμα τα προγράμματα γραμμένα

12 σε TCL μπορούν να λειτουργήσουν ως μηχανισμός επικοινωνίας σε διάφορες εφαρμογές. Τελευταίο πλεονέκτημα του είναι ότι ο προγραμματιστής μπορεί να ενδυναμώσει και να επεκτείνει τις TCL εφαρμογές του μαθαίνοντας ελάχιστες συγκεκριμένες εντολές που χρησιμοποιούνται στις εφαρμογές αυτές Λάθη στη TCL Όπως έχετε δει προηγούμενα, υπάρχουν πολλά πράγματα που μπορούν να οδηγήσουν σε λάθη στις εντολές Tcl. Τα λάθη μπορούν να εμφανιστούν επειδή μια εντολή δεν υπάρχει ή επειδή δεν λαμβάνει το σωστό αριθμό αρισμάτων ή επειδή τα ορίσματα έχουν λανθασμένη μορφή ή επειδή κάποιο άλλο πρόβλημα εμφανίζεται στην εκτέλεση της εντολής, όπως ένα λάθος σε μια κλήση συστήματος για ένα αρχείο I/O. Στις περισσότερες περιτπώσεις τα λάθη αντιπροσωπεύουν σοβαρά προβλήματα που καθιστούν αδύνατο για την εφαρμογή να ολοκληρώσει το script που επεξεργάζεται. Οι Tcl διευκολύνσεις λάθους προορίζονται να καταστήσουν εύκολο για την εφαρμογή να "ξετυλίξει" την υπό εξέλιξη εργασία και να προβάλει ένα μήνυμα λάθους στο χρήστη που προσδιορίζει τι πήγε στραβά. Πιθανώς ο χρήστης θα διορθώσει το πρόβλημα και θα ξαναδοκιμάσει τη λειτουργία. Τα λάθη είναι απλά ένα παράδειγμα ενός γενικότερου φαινομένου αποκαλούμενου ως εξαιρέσεις. Οι εξαιρέσεις είναι γεγονότα που αναγκάζουν τα scripts να διακοπούν, περιλαμβάνουν τις εντολές break, continue και return καθώς επίσης και τα λάθη.η Tcl επιτρέπει οι εξαιρέσεις να "πιαστούν" από τα scripts έτσι ώστε μόνο μέρος της εργασίας υπό εξέλιξη να "ξετυλίγεται". Μετά το "πιάσιμο" μιας εξαίρεσης το script μπορεί να την αγνοήσει ή να λάβει μέτρα για να την αντιμετωπίσει. Εάν τσ script δεν μπορέσει να την αντιμετωπίσει τότε μπορεί να επανεξετάσει την εξαίρεση Τι συμβαίνει μετά από ένα λάθος; Όταν ένα λάθος Tcl εμφανίζεται η τρέχουσα εντολή διακόπτεται. Εάν αυτή η εντολή είναι μέρος ενός μεγαλύτερου script τότε το script διακότττεται επίσης. Εάν το λάθος εμφανίζεται εκτελώντας μια διαδικασία Tcl, τότε η διαδικασία διακότπεται, μαζί με τη διαδικασία που την κάλεσε, και ούτω καθεξής έως ότου διακοπούν όλες οι ενεργές διαδικασίες.αφότου έχει ξετυλιχτεί κατ' αυτό τον τρόπο όλη η δραστηριότητα Tcl, ο έλεγχας επιστρέφει τελικά στον κώδικα C στην εφαρμογή, μαζί με μια ένδειξη ότι ένα λάθος εμφανίστηκε και ένα μήνυμα περιγράφοντας το λάθος. Εξαρτάται από την εφαρμογή να αποφασίσει πώς να χειριστεί αυτήν την κατάσταση, αλλά οι περισσότερες διαλογικές εφαρμογές θα εμφανίσουν το μήνυμα λάθους για το χρήστη και θα συνεχίσουν να επεξεργάζονται τα δεδομένα των χρηστών. Σε μια ομαδικά - προσανατολισμένη εφαρμογή όπου ο χρήστης δεν μπορεί να δει το μήνυμα λάθους

13 και ρυθμίζει τις μελλοντικές του ενέργειες αναλόγως, η εφαρμογή μπορεί να τυπώσει το μήνυμα λάθους σε ένα αρχείο και να διακοπεί Η HTML μέσα σε αρχείο TCL Αυτός είναι ένα απλό παράδειγμα του κώδικα HTML: <htoil> <head> <title>sample Code</title> </head> <body bgcolor= yellow > </body> </html> Av ενσωματώσουμε τον παραπάνω κώδικα HTML σε ένα αρχείο με κατάληξη *.tcl, τότε θα έχει την παρακάτω μορφή: puts <htoil> puts <head> puts <title>saoiple\ Code</title> puts </head> puts <body\ bgcolor="yellow"> puts Hello\ World puts </body> puts </html> Όπως παρατηρούμε πριν από κάθε γραμμή του κώδικα HTML τοποθετούμε puts και ανάμεσα σε λέξεις με κενά τοποθετούμε το Μ αυτόν τον τρόπο η TCL αναγνωρίζει τον κώδικα HTML.

14 1.3 Βάση δεδομένων Βάση δεδομένων Database είναι μια συλλογή από δεδομένα, οργανωμένα κατά τέτοιο τρόπο ώστε να μπορούν εύκολα να προσπελαστούν και να διαχειριστούν από τον χρήστη. Εμείς υποστηρίζουμε την MySQL MySQL Η MySQL είναι open source γλώσσα προγραμματισμού, οι οποία συνεργαζόμενη με την TCL, αποτελούν ένα πολύ δυνατό εργαλείο για την κατασκευή δυναμικών website. Μια βάση δεδομένων (database) αποτελείται από έναν ή περισσότερους πίνακες (tables), ο καθένας από τους οποίους περιέχει μια λίστα από κάποια πράγματα. Για μια βάση δεδομένων πελατών (clients), είναι φυσικό να ξεκινήσουμε μ' έναν πίνακα με όνομα clients που θα περιέχει μια λίστα από στοιχεία πελατών. Ο κάθε πίνακας σε μια βάση δεδομένων περιέχει μια ή περισσότερες στήλες (columns) ή πεδία (fields), όπου η κάθε στήλη περιέχει μια συγκεκριμένη πληροφορία για τον κάθε πελάτη που υπάρχει στην βάση δεδομένων (database). Ο πίνακας clients μπορεί να περιέχει στήλες για τον κωδικό ενός πελάτη (ID), για το όνομά του (Name) καθώς και για την ημερομηνία γέννησής του (Date). Για παράδειγμα, ας δούμε τον παρακάτω πίνακα : ID 1 2 Name Αντωνιάδης Παπαδόπουλος Date Εκτός από τις στήλες για το όνομα του πελάτη (Name) και την ημερομηνία γέννησής του (Date), υπάρχει και μια στήλη με όνομα ID, ο σκοπός της οποίας είναι να εκχωρήσει έναν μοναδικό αριθμό στον κάθε πελάτη έτσι ώστε να έχουμε έναν εύκολο τρόπο αναφοράς σ' αυτόν και να μπορούμε να τον ξεχωρίσουμε από τους άλλους πελάτες. Σαν επισκόπηση, το παραπάνω είναι ένας πίνακας τριών στηλών που περιέχει δύο γραμμές ή καταχωρήσεις. Η κάθε γραμμή του πίνακα περιέχει έναν κωδικό (ID) αναγνώρισης του πελάτη, το όνομά του (text) καθώς και την ημερομηνία γέννησής του (date). Με βάση αυτήν την βασική ορολογία, είμαστε έτοιμοι να αρχίσουμε να χρησιμοποιούμε την MySQL.

15 1.3.2 Ιστορικά στοιχεία Η MySQL χρησιμοποιείται από το 1996 αλλά η ιστορία της ξεκινά από το Για 3 συνεχόμενα χρόνια έχει κερδίσει το βραβείο choice Award του Linux Journal Readers. Σήμερα είναι διαθέσιμη με άδεια ανοιχτού κώδικα αλλά επίσης διαθέσιμες και εμπορικές άδειες όταν είναι απαραίτητο. 1.4 Apache Τι είναι Apache; Apache είναι ένας web server. Είναι ένα ανοιχτό λογισμικό πράγμα το οποίο σημαίνει ότι έχουμε πρόσβαση σε όλο τον πηγαίο κώδικα του. Δίνει την δυνατότητα στον χρήστη να δημιουργεί μια εξειδικευμένη έκδοση του server σύμφωνα με τις προτιμήσεις του. Δημιουργία εκτελέσιμων αρχείων του apache από τον πηγαίο κώδικα δίνει την δυνατότητα εύκολης αναβάθμισης στις πιο πρόσφατες εκδόσεις και να εφαρμοστούν γρήγορα οι διορθώσεις για την ασφάλεια. Είναι ένας δυναμικός web server. Περιέχει τα πιο πρόσφατα πρωτόκολλα, παρέχει πλήρη κώδικα, τρέχει σε περιβάλλον (Windows ΝΤ/9χ, Netware 5.x και σε πολλές εκδόσεις του Unix) Ιστορικά στοιχεία για την ονομασία Apache Το όνομα Apache επιλέχθηκε αρχικά από σεβασμό στους Ιθαγενείς Ινδιάνους της Αμερικής (που η φυλή τους είχε την ονομασία αυτή) γνωστών για την υπεροχή τους στη στρατηγική πολέμου και την ανεξάντλητη αντοχή τους. Επίσης το όνομα αποδίδεται στο λογοπαίγνιο Apache is APAtCHy server που βασίζεται σε ένα υπαρκτό κώδικα και σε μια σειρά από patch files CGI Scripting Ο όρος CGI ή Common Gateway Interface είναι πολύ διαδεδομένος στο Web. To CGI αναφέρεται στο τηλεπικοινωνιακό πρωτόκολλο με το οποίο ένας Web server μπορεί να επικοινωνήσει με άλλες εφαρμογές. Για παράδειγμα, μία CGI εφαρμογή, η οποία συνήθως ονομάζεται script, χρησιμοποιείται συχνά επιτρέποντας στους χρήστες του Web να προσπελαύνουν βάσεις δεδομένων ή να παίρνουν πληροφορίες από φόρμες που συμπληρώνουν. Το CGI μπορεί επίσης να χρησιμοποιηθεί για τη δημιουργία agents που θα εκτελούν κάποια καθήκοντα όπως ο έλεγχος ενός Web site για την εύρεση πιθανών

16 "σπασμένων" links. Ουσιαστικά, το CGI αποτελεί ένα πρότυπο με το οποίο ο Web αλληλεπιδρά με εξωτερικές πηγές. Συχνά αυτή η εξωτερική πηγή είναι μία βάση δεδομένων. Πιθανώς να τρέχετε πολλά CGI scripts χωρίς καν να το γνωρίζετε. Για παράδειγμα, αν συμπληρώσατε μία φόρμα μιας Web σελίδας για να εγγραφείτε σε κάποιο site και αργότερα λάβατε μία ειδοποίηση μέσω η οποία να περιέχει το password που μπορείτε να χρησιμοποιήσετε, πιθανώς να έχετε τρέξει ένα CGI script. Σ' αυτή την περίπτωση το CGI script πιθανώς να πήρε τις πληροφορίες που συμπληρώσατε στη φόρμα, να έκανε διάφορες εργασίες με αυτήν, συμπεριλαμβανομένης της αποστολής των πληροφοριών σε μία βάση δεδομένων, της αυτόματης δημιουργίας ενός password και της αποστολής του mail. Συχνά υπάρχει σύγχυση μεταξύ του CGI και των CGI εφαρμογών. Οι CGI εφαρμογές λαμβάνουν δεδομένα από τον server και τα επιστρέφουν μέσω του Common Gateway Interface. Είναι η "είσοδος" μέσω της οποίας ο Web server στέλνει αιτήσεις και η CGI εφαρμογή συλλέγει και επιστρέφει τα δεδομένα. Στο παράδειγμα της παροχής πληροφοριών σε μία Web σελίδα η οποία έχει σχεδιαστεί να δέχεται την είσοδο των χρηστών, το CGI εκτελεί πολλά καθήκοντα. Πρώτα απ' όλα δίνετε κάποιες μοναδικές πληροφορίες - όπως το όνομα ή την ηλεκτρονική σας διεύθυνση - στον server για επεξεργασία. Εν συνεχεία, ο server ανακατευθύνει τις πληροφορίες σε μία CGI εφαρμογή η οποία καλείται από τη φόρμα "submit". Τα CGI scripts ενεργοποιούνται από τον server σε απάντηση μιας HTTP αίτησης από τον client.tελικά μία CGI εφαρμογή μπορεί να στείλει δεδομένα της φόρμας σε ένα άλλο πρόγραμμα όπως μία βάση δεδομένων, να τα αποθηκεύσει σε ένα αρχείο ή να δημιουργήσει ένα μοναδικό HTML έγγραφο σε απάντηση στην αίτηση του χρήστη. Αυτό είναι γνωστό ως αλληλεπιδραστική φόρμα. Ένα CGI script είναι ένα πρόγραμμα το οποίο στο standard output παράγει (σανήθως) HTML κώδικα. Σε κάποιες περιτπώσεις παράγει στο standard output κώδικα GIF αρχείοα (χρησιμοποιείται στην περίτπωση γραφικών counters σελίδων). rraut0 το λόγο αρχικά πρέπει πάντα να τίθεται μια γραμμή προσδιορισμού tou περιεχομένου που θα ακολουθήσει, πχ. Για HTML σελίδα Content-type: text/html Για GIF εικόνα Content-type: image/gif Τα CGI προγράμματα συνήθως αποθηκεύονται σε ένα συγκεκριμένο χώρο. Το directory το οποίο τα περιέχει συνήθως ονομάζεται "cgi-bin". Τα αρχεία που

17 αποθηκεύονται εκεί είναι εκτελέσιμα αρχεία που μπορεί να τα τρέξει ένα UNIX σύστημα. Όταν ο χρήστης κάνει ευάιπίί στη φόρμα, το script λαμβάνει τα δεδομένα της φόρμας σαν ζευγάρια names και values. Τα names είναι αυτά που ορίσαμε στα INPUT tags (ή στα SELECT ή TEXTAREA tags) και οι values είναι ο,τιδήποτε ο χρήστης έγραψε ή επέλεξε. Όλα αυτά γράφονται σε ένα πολύ μεγάλο string που έχει την παρακάτω μορφή name1 =value1 &name2=value2&name3=value3

18 1.5 JavaScript Τι είναι η JavaScript; Η JavaScript δεν είναι Java και παρόμοια η Java δεν είναι JavaScript. Η JavaScript αναπτύχθηκε ανεξάρτητα από τη Java. Αρχικά ανατπύχθηκε σαν ένα προϊόν που ονομαζόταν LiveScript αλλά μετονομάστηκε όταν η Netscape ανακοίνωσε υποστήριξη για την Java στο Netscape Navigator 2.0. Η JavaScript είναι μια γλώσσα Script που, συνήθως, μεταφράζεται την ώρα εκτέλεσης από ένα μεταγλωττιστή JavaScript μέσα στο πρόγραμμα ανάγνωσης ιστοσελίδων. Ο κώδικας μπορεί να ενσωματωθεί μέσα σε μια HTML σελίδα. Η JavaScript δεν είναι μια καθαρή 100% αντικειμενοστραφής γλώσσα, αν και μπορεί εύκολα να περιγραφεί σαν μια γλώσσα βασισμένη στα αντικείμενα. Η Java είναι καθαρά αντικειμενοστραφής γλώσσα. Η σύνταξη μεταξύ των δύο είναι πολύ παρόμοια αλλά όχι ίδια Ιστορικά στοιχεία της JavaScript Η JavaScript δημιουργήθηκε το 1995 από τον Brendan Eich για να τη χρησιμοποιήσει με τον Netscape Navigator 2. Ο στόχος ήταν να επιτρέπει στο πρόγραμμα ανάγνωσης ιστοσελίδων του πελάτη να δημιουργεί HTML δυναμικά και να εκτελεί κώδικα JavaScript, ώστε ο χρήστης να βλέπει ή να συνδιαλέγεται με την σελίδα Τοποθέτηση του κώδικα JavaScript Που πηγαίνει ο κώδικας JavaScript μέσα στη σελίδα; Αυτή η ερώτηση είναι συνήθως η πρώτη που ρωτά κάποιος όταν συναντάει JavaScript. Η απλή απάντηση είναι ότι η JavaScript πηγαίνει μεταξύ μιας ετικέτας script αρχής και τέλους. Ένα δείγμα JavaScript κώδικα, δείχνει ως εξής: <html><head> <title>sample Code</title> </head> <body> <script language=" JavaScript > <!- - document.write( Hello World ) ; </script> </bodyx/html>

19 Η τοποθέτηση του κώδικα JavaScript εξαρτάται από το τι θέλετε να κάνει ο κώδικας. Αν απλός θέλετε ο κώδικας JavaScript να εκτελεί κάποια επεξεργασία καθώς φορτώνεται η σελiδα τότε η απάντηση είναι να συμπεριλάβετε τον κώδικα JavaScript μεταξύ των στοιχείων script οτο σώμα της σελiδας. Αν ωστόσο, θέλετε να ορίσετε τμήματα από επαναχρησιμοποιήσιμο κώδικα JavaScript που πιθανόν να χρησιμοποιηθεί αρκετές φορές κατά τη διάρκεια ζωής μιας σελίδας, είναι πιο κατάλληλο να τοποθετήσετε τον κώδικα JavaScript σε μια συνάρτηση, μεταξύ ετικετών script στην κορυφή του εγγράφου. Αν θέλετε η JavaScript να αντιδρά σε συμβάντα που ξεκινούν από τον χρήστη, τότε μια άλλη πιθανότητα είναι η τοποθέτηση του κώδικα JavaScript μέσα σε HTML ιδιότητες, σε κατάλληλες HTML ετικέτες.

20 ΚΕΦΑΛΑΙΟ Σχεδιασμός και περιγραφή Βάσης Δεδομένων Για την συγκεκριμένη εφαρμογή χρησιμοποιήθηκε η βάση δεδομένων της MySQL για την καταχώριση των δεδομένων στους πίνακες οι οποίοι περιγράφονται στο κεφάλαιο αυτό Δομή της Βάσης Δεδομένων Η Βάση Δεδομένων που χρησιμοποιήθηκε για την εφαρμογή αυτή, περιέχει τους παρακάτω οκτώ πίνακες: 1. users 2. forum 3. chat 4. answer 5. names 6. names Σχέσεις μεταξύ πινάκων

21 2.1.2 Περιγραφή της Βάσης Δεδομένων password Char(5) Ο πίνακας users περιέχει όλα τα usernames και passwords των σποαδαστών ποα έχοαν δικαίωμα πρόσβασης στην εφαρμογή, δηλαδή για την πρόσβαση tou χρήστη στην εφαρμογή είναι απαραίτητη η αυθεντικοποίηση tou εισάγοντας το username και το password tou, πou είναι είδη καταχωρημένα στο σογκεκριμένο πίνακα. Ο πίνακας users περιλαμβάνει δύο πεδία: username - αποτελείται από μέγιστο αριθμό οχτώ χαρακτήρων και είναι το πεδίο στο οποίο είναι καταχωρημένα το username tou σπouδαστή το οποίο tou έχει δοθεί από το τμήμα της Διαχείρισης Πληροφοριών. password - αποτελείται από μέγιστο αριθμό πέντε χαρακτήρων και είναι το πεδίο στο οποίο είναι καταχωρημένα το password tou σπouδαστή το οποίο tou έχει δοθεί από το τμήμα της Διαχείρισης Πληροφοριών. > Πίνακας forum Field Type NULL Key Default Extra user Char(8) YES NULL math Char(6) YES NULL text Char(199) YES NULL rd Char(3) YES NULL id Char(12) YES NULL Ο πίνακας forum αναφέρεται στο forum της εφαρμογής. Ο σκοπός της δημιοοργίας tou είναι να κρατάει όλες τις πληροφορίες ποα έχοαν σχέση με τις ερωτήσεις που θέτει ο σπουδαστής στο forum.

22 ο πίνακας forum περιλαμβάνει πέντε πεδία: user - αποτελείται από μέγιστο αριθμό οχτώ χαρακτήρων και περιλαμβάνει το username κάθε σπουδαστή που θέλει να θέσει κάποια ερώτηστ math - αποτελείται από μέγιστο αριθμό έξι χαρακτήρων και περιλαμβάνει το value του μαθήματος για το οποίο θέλει να κάνει ερώτηστ) text - αποτελείται από μέγιστο αριθμό 199 χαρακτήρων και περιλαμβάνει το κείμενο (ερώτηση) που πληκτρολογεί ο σπουδαστής rd - αποτελείται από μέγιστο αριθμό τριών χαρακτήρων και περιλαμβάνει το value του θέματος για το οποίο ενδιαφέρεται ο σπουδαστής να θέσει την ερώτηση id - αποτελείται από μέγιστο αριθμό δώδεκα χαρακτήρων και περιλαμβάνει το επιλεγμένο από τον σπουδαστή value του μαθήματος, value του θέματος και έναν αυξανόμενο μετρητή. Το πεδίο αυτό είναι για να συνδέσουμε την ερώτηση με την απάντηση. > Πίνακας chat Field Type NULL Key Default Extra username Char(8) YES NULL text Char(199) YES NULL radio Char(IO) YES NULL Ο πίνακας chat αναφέρεται στο chat της εφαρμογής. Ο σκοπός της δημιουργίας του είναι να κρατάει όλες τις πληροφορίες που έχουν σχέση με την αποστολή και τη λήψη μηνυμάτων μέσα στο chat. Ο πίνακας chat περιλαμβάνει τρία πεδία: username - αποτελείται από μέγιστο αριθμό οχτώ χαρακτήρων και περιλαμβάνει μόνο το username κάθε σπουδαστή που στέλνει ένα κείμενο (μήνυμα) μέσα στο chat room. text - αποτελείται από μέγιστο αριθμό 199 χαρακτήρων και περιλαμβάνει το κείμενο (μήνυμα) που πληκτρολογεί και δέχεται ο σπουδαστής στο chat room, radio - αποτελείται από μέγιστο αριθμό δέκα χαρακτήρων και περιλαμβάνει το username του σπουδαστή στον οποίο θέλουμε να στείλουμε ένα private μήνυμα, δηλαδή να το βλέπει μόνο ο επιλεγμένος σπουδαστής.

23 Πίνακας answer user "text Char(199) O πίνακας answer αναφέρεται στο forum της εφαρμογής. Ο σκοπός της δημιουργίας του είναι να κρατάει όλες τις πληροφορίες που έχουν σχέση με τις απαντήσεις του σπουδαστή για κάποια συγκεκριμένη ερώτηση που επέλεξε στο forum. Ο πίνακας answer περιλαμβάνει τρία πεδία: id - αποτελείται από μέγιστο αριθμό δώδεκα χαρακτήρων και περιλαμβάνει το είδη υπάρχον id της επιλεγμένης ερώτησης από το πίνακα forum. Ο σκοπός αυτού του πεδίου είναι να συνδυάζει την ερώτηση με την αντίστοιχη απάντηση. user - αποτελείται από μέγιστο αριθμό οχτώ χαρακτήρων και περιλαμβάνει το username κάθε σπουδαστή που θέλει να δώσει την απάντησή του σε κάποια ερώτηση. text - αποτελείται από μέγιστο αριθμό 199 χαρακτήρων και περιλαμβάνει το κείμενο (απάντηση) που πληκτρολογεί ο σπουδαστής. > Πίνακας names Field Type NULL Key Default Extra name Char(8) YES NULL Ο πίνακας names αναφέρεται στο chat της εφαρμογής. Ο σκοπός της δημιουργίας του είναι να κρατάει όλα τα username των σπουδαστών που βρίσκονται on-line στο chat room. Με την έξοδο κάποιου σπουδαστή ταυτόχρονα σβήνεται και το username του από τον πίνακα. Ο πίνακας names περιλαμβάνει ένα πεδίο: name - αποτελείται από μέγιστο αριθμό οχτώ χαρακτήρων και ο σκοπός του είναι να στέλνει στο chat room τα username των σπουδαστών που βρίσκονται on-line εκείνη τη στιγμή.

24 Πίνακας names2 Char(8) Key O πίνακας names2 αναφέρεται στο fonjm της εφαρμογής. Ο σκοπός της δημιουργίας του είναι να κρατάει όλα τα υβθπιαπιβ των σπουδαστών που βρίσκονται στο ίογυπι. Ο πίνακας naoies2 περιλαμβάνει ένα πεδίο: name - αποτελείται από μέγιστο αριθμό οχτώ χαρακτήρων και ο σκοπός του είναι να κρατάει τα username των σπουδαστών που καταχωρούν κείμενο (ερώτηση ή απάντηση), δηλαδή από το πεδίο αυτό στέλνεται στο forum το username κάθε αποστολέα κειμένου, ούτως ώστε να μπορούνε να βλέπουμε ποίος είναι ο αποστολέας κάθε ερώτησης ή απάντησης. > Πίνακας ί Field Type NULL Key Default Extra math Char(7) YES NULL id int YES NULL Ο πίνακας i αναφέρεται στο forum της εφαρμογής. Ο σκοπός της δημιουργίας του είναι να παίρνει από τον πίνακα forum και συγκεκριμένα από το πεδίο id τον αυξανόμενο μετρητή (counter) +1, δηλαδή π.χ. αν ο τελευταίος συνδυασμός στο πεδίο id του πίνακα forum είναι algo-a-35 (που σημαίνει μάθημα - Αλγοριθμοποίηση, θέμα - Εξεταστική, 35'' ερώτηση), τότε στο πεδίο id αυτού του πίνακα θα καταχωρηθεί ο αριθμός 36. Ο αριθμός αυτός θα χρησιμοποιηθεί στην επόμενη καταχώρηση ερώτησης για το συγκεκριμένο μάθημα και θέμα. Ο πίνακας i περιλαμβάνει δύο πεδία: math - αποτελείται από μέγιστο αριθμό επτά χαρακτήρων και ο σκοπός του είναι να κρατάει όλους τους συνδυασμούς μαθήματος - θέματος. id - είναι τύπου integer και ο σκοπός του όπως αναφέρεται και στο παραπάνω παράδειγμα είναι να κρατάει τον τελευταίο +1 αριθμό από το πεδίο id του πίνακα forum για κάθε συνδυασμό μαθήματος - θέματος.

25 Πίνακας mname Ο πίνακας mname αναφέρεται στο forum της εφαρμογής. Ο σκοπός της δημιουργίας του είναι βοηθητικός. Περιέχει όλα τα ονόματα των μαθημάτων γραμμένα με ελληνικούς χαρακτήρες και τους κωδικούς των μαθημάτων. Π.χ. ( algo ΑΛΓΟΡΥΘΜΟΠΟΙΗΣΗ ) Μ αυτό τον τρόπο μπορούμε να εμφανίσουμε στην σελίδα μας μετά από την επιλογή του μαθήματος και του θέματος, για τον οποίο ενδιαφερόμαστε, το μήνυμα : «ΣΧΟΛΙΑ ΠΟΥ ΑΦΟΡΟΥΝ ΤΟ ΜΑΘΗΜΑ ΑΛΓΟΡΥΘΜΟΠΟΙΗΣΗ» Ο πίνακας i περιλαμβάνει δύο πεδία: nick - αποτελείται από μέγιστο αριθμό τεσσάρων χαρακτήρων, και περιέχει τους κωδικούς των μαθημάτων. onoma - αποτελείται από μέγιστο αριθμό πενήντα χαρακτήρων, και περιέχει τα ονόματα των μαθημάτων που είναι γραμμένα με ελληνικούς χαρακτήρες.

26 2.2 Περιγραφή σελίδων και οι τρόποι υλοποίησής τους Σκοπός και λειτουργία Ο σκοπός της εφαρμογής είναι να δίνεται η δυνατότητα σε όλους τους σπουδαστές του τμήματος Διαχείρισης Πληροφοριών να έχουν πρόσβαση σε έναν ηλεκτρονικό χώρο συνάντησης, ανταλλαγής απόψεων, ενημέρωσης για διάςκτρα θέματα που έχουν σχέση με το τμήμα. Η λειτουργία της εφαρμογής απαιτεί απαραίτητα την εισαγωγή ενός usernaoie και password που διαθέτει κάθε σπουδαστής του τμήματος Διαχείρισης Πληροφοριών, πριν του δοθεί η πρόσβαση είτε στο forum, είτε στο chat της εφαρμογής. Στο forum ο σπουδαστής έχει την δυνατότητα να θέτει διάφορα ερωτήματα για θέματα που τον ενδιαφέρουν και που έχουν σχέση με το τμήμα, ενώ στο chat room μπορεί να συμμετέχει σε μια on-line συζήτηση με τους άλλους σπουδαστές που είναι επίσης on-line στο chat room Σχεδιασμός σελίδων Η εξωτερική εμφάνιση, δηλαδή το περιβάλλον κάθε ιστοσελίδας παίζει πολύ σημαντικό ρόλο για την όλη εικόνα της εφαρμογής. Η επιλογή των χρωμάτων που θα χρησιμοποιηθούν θα πρέπει να είναι προσεκτική και να συνδυάζονται μεταξύ τους ούτως ώστε να μην κουράζουν τα μάτια των επισκετπών της ιστοσελίδας. Στην παρούσα εφαρμογή χρησιμοποίησα αποχρώσεις δύο χρωμάτων, του μπλε και του γκρι. Επίσης για την γρήγορη φόρτωση των σελίδων καλό είναι να αποφεύγεται η χρησιμοποίηση μεγάλων εικόνων και εικόνων με κατάληξη *.bmp. Όλη η εφαρμογή μου περιέχει εικόνες με κατάληξη *.jpg. Για όλη την εφαρμογή η γραμματοσειρά που επιλέχθηκε είναι η Tahoma με μέγεθος γραμμάτων 9, εκτός από κάποιες περιπτώσεις οπού χρειάστηκε αλλαγή μεγέθους για καλύτερη εμφάνιση Κατασκευή της εφαρμογής Για την κατασκευή της εφαρμογής χρησιμοποιήθηκαν: > Γλώσσα προγραμματισμού TCL > Βάση Δεδομένων MySQL > Apache Server > HTML > JavaScript > Photoshop CS2 H σύνταξη του κώδικα έγινε στο EditPlus και στο Coffee HTML Editor 2006.

27 2.2.4 Περιγραφή σελίδων και του κώδικα Παρακάτω θα παρουσιαστούν και θα σχολιαστούν όλες οι σελίδες της εφαρμογής και τα σημαντικότερα κομμάτια του κώδικα. Η εφαρμογή μου χωρίζεται σε δύο τμήματα, το foruoi και το chat. Υπάρχει μια αρχική σελίδα index.htoil στην οποία επιλέγουμε πια από τις δύο εφαρμογές θέλουμε να επισκεφθούμε. Ο ^,. β. Β. # Λ, Ο" *- Ooivimwiic<atio t T L.,,, Centei* index.html Ανάλυση του κώδικα index.html <form action="../cgi-bin/login.tcl" method=''post"> <table align="center"> <tr> <td> <input type="submit" name="f value="forum"> <td> <input type="submit" name="c" value="char'> </table> </form> Σ' αυτό το κομμάτι κώδικα της σελίδας index.html βλέπουμε δύο κουμπιά FORUM" και CHAT και είναι τύπου submit, τα οποία βρίσκονται μέσα σε μια φόρμα που πατώντας τα μας συνδέει με την σελίδα login.tcl.

28 > Οι σελίδες του forum Η πρώτη σελίδα του forum ονομάζεται login.tcl όπου ο σπουδαστής καλείται να συμπληρώσει στη φόρμα που του εμφανίζεται το username και το password του για να μπει στο forum. login.tcl Ανάλυση του κώδικα login.tcl puts <form\ action="auth2.td"\ method= 'post > puts <table> puts <td>username: puts <td><input\ type="text"\ name="u"> <td>password: puts <td><input\ type="password"\ name="p"><br> <td\ colspan="2"\ align="center"><input\ type="submit"\ value="login"> </form> Σ aut0 TO κομμάτι κώδικα φτιάχνοαμε δύο text box τα οποία είναι για το username και το password και ένα κοαμπί Login" τύποα submit το οποίο μας σονδέει με τη σελίδα auth2.tcl.

29 Μετά την εισαγωγή του username και του password και πατώντας το κουμπί "Login η σελίδα αυτή όπως ανέφερα οδηγεί στην επόμενη σελίδα που ονομάζεται authz.tcl η οποία μπορεί να εμφανιστεί σε δύο μορφές ανάλογα με το αν ο σπουδαστής έχει καταχωρήσει σωστά ή λανθασμένα τα στοιχεία. Σε περίπτωση λανθασμένης εισαγωγής εμφανίζεται η παρακάτω σελίδα. auth2.tcl Ανάλυση του κώδικα auth2.tcl (σε περίπτωση λανθασυένης εισονωγήο puts <form\ action="auth2.tcl \ method="post"> puls <table> puts <td>username: puts <td><input\ type="text"\ name="u"> <td>password: puts <td><input\ type="password"\ name="p ><br> <td\ colspan="2"\ align="center"><input\ type="submit"\ value="login"> </form> puts <font\ color="red"\ size="3"\ face=tahoma>authentication\ Emor\ Try\ Again!!!

30 Είναι ακριβώς ο ίδιος κώδικας όπως της προηγούμενης σελίδας με τη διαφορά ότι αν ο σπουδαστής έχει δώσει λάθος στοιχεία, τότε θα εμφανιστεί η σελίδα στην οποία παρατηρούμε το αντίστοιχο μήνυμα λάθους εισαγωγής στοιχείων. Σε περίπτωση σωστής εισαγωγής του username και του password όπου πλέον ο σπουδαστής είναι στο forum θα εμφανιστεί η παρακάτω σελίδα στην οποία μπορεί να επιλέξει το εξάμηνο προς συζήτηση. Ανάλυση του κώδικα auth2.tcl (σε περίπτωση σωστήο εισανωνήζ) set X [read stdin] set u [lindex [split [lindex [split $x &] 0] =] 1] set p [lindex [split [lindex [split $x &] 1] =] 1] set X [sql "select username,password from users where (usemame='$u') && (password='$p')"] if {[lindex [lindex $x 0] 0]!=""} { sql insert into names2(name) values('$u')" Στο παραπάνω κώδικα γίνεται καταχώριση στη μεταβλητή υ και στη μεταβλητή ρ" το username και το password αντίστοιχα και στη συνέχεια καταχωρούνται στη μεταβλητή χ το username και το password από τον πίνακα users μετά από έλεγχο - σύγκριση των μεταβλητών "υ" και ρ με τα αντίστοιχα πεδία του πίνακα users.

31 Στη συνέχεια το περιεχόμενο της μεταβλητής υ που είναι το username του σπουδαστή καταχωρείται στο πίνακα names2 στο πεδίο name. puts <form\ action="forum,tcl"\ method="post"> puts <table\ align="center \ border=1\ bordercolor="lightblue"> <td> puts <center> puts <select\ name="math"> puts <option\ value="a">a\ ΕΞΑΜΗΝΟ puts <option\ value="b > B\ ΕΞΑΜΗΝΟ puts <option\ value="c"> Γ\ ΕΞΑΜΗΝΟ puts <option\ value="d"> Δ\ ΕΞΑΜΗΝΟ puts <option\ value=''e > E\ ΕΞΑΜΗΝΟ puts <option\ value="st"> ΣΤ\ ΕΞΑΜΗΝΟ puts <option\ value="z"> Z\ ΕΞΑΜΗΝΟ puts <option\ value="ptuxeio">npi'xiakh\ ΕΡΓΑΣΙΑ puts <option\ value= praktiki">npaktikh\ ΕΡΓΑΣΙΑ puts <option\ value="proairetika">npoaipetika\ ΜΑΘΗΜΑΤΑ puts </select> <td\ bgcolor="lightblue"> puts <center> puts <input\ type="hidden"\ name="user"\ value="$u > puts <input\ type="submit"\ value="\ OK\ "> Στο παραπάνω κώδικα γίνεται η επιλογή του εξαμήνου από την λίστα, που το κάθε εξάμηνο έχει την δική του τιμή (π.χ. value="a') η οποία θα χρησιμοποιηθεί στην επόμενη σελίδα forum.tcl που οδηγεί σ αυτήν πατώντας το κουμπί ΟΚ που είναι τύπου submit. Επιλέγοντας το εξάμηνο και πατώντας το κουμπί ΟΚ" μεταφερόμαστε στη σελίδα forum.tcl όπου μπορούμε να διαλέξουμε το μάθημα του επιλεγμένου εξαμήνου και ένα από τα πέντε θέματα για τα οποία θέλουμε να θέσουμε ή να λάβουμε ερώτηση ή απάντηση αντίστοιχα. Παρακάτω εμφανίζεται η μορφή αυτής της σελίδας.

32 forum.tcl Ανάλυση του κώδικα forum.tcl set X [split [read stdin] &] set semester [lindex [split [lindex $x 0] =] 1] set u [lindex [split [lindex $x 1] =] 1] Στις παραπάνω τρεις γραμμές κώδικα παipvouμε από ΤΓιν προηγούμενη osai5a το value του επιλεγμένου εξάμήνου το οποίο καταχωρείται στη μεταβλητή semester και το username του σπουδαστή το οποίο καταχωρείται στη μεταβλητή υ. if {$semester=="a"} { puts <form\ action="emfanisi.td"\ method="post"> puts <table\ align="center"><tr> puts <td><font\ color="darkcyan"><b>ma0hmata</b></font> puts <td><select\ name="math"> puts <option\ value="algo">aaropi0monoihih puts <option\ value="domi">aomhmenoi\ ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ puts <option\ ν3ΐυο="οι^ίτ">εκφραση\ KAI\ ΕΠΙΚΟΙΝΩΝΙΑ puts <option\ value="mati">ma0hmatika\ ΣΤΗ\ ΔΙΟΙΚΗΣΗ puts <option\ value="oiko">oikonomikh puts <option\ value="plir">nahpocpopikh\ ΣΤΗ\ ΔΙΟΙΚΗΣΗ puts </select>

33 <tdxfont\ color="darkcyan"><b>0emata</b></font> puts <td><input\ checked\ type="radio"\ name="n value= a">eeetαστικη <td> puts <td><input\ type="radio \ name="n value="b">ka0hrhtei <td> puts <td><input\ type="radio"\ name="n value="c">npooaoi <td> puts <td><input\ type= radio"\ name="r"\ value="d">nporpamma <td> puts <td><input\ type="radio"\ name="r \ value="e">ixoaia\ ΓΕΝΙΚΑ puts <br><br> <td><input\ type="hidden"\ name="user"\ value="$u"> <td><input\ type="hidden \ name="n value="0"> <td\ cx)lspan=2\ align="center"><input\ type="submit"\ value= OK "> O παραπάνω κώδικας υλοποιεί μια λίστα με τα μαθήματα του Α εξαμήνου (αντίστοιχα γίνεται και για τα υπόλοιπα εξάμηνα) και πέντε επιλογές θεμάτων για τα οποία θέλει ο σπουδαστής να συζητήσει. Επίσης ένα κουμπί Ό Κ τύπου submit το οποίο μεταφέρει στη σελίδα emfanisi.tcl. Ανάλογα γίνεται και για τα υπόλοιπα εξάμηνα, δηλαδή αν ο σπουδαστής επέλεγε το Β' εξάμηνο, τότε το κουμπί Ό Κ" θα τον μετέφερε στη σελίδα emfanisib.tcl. Ας υποθέσουμε ότι ο σπουδαστής έχει επιλέξει το Α' εξάμηνο το οποίο θα τον μεταφέρει στη σελίδα emfanisi.tcl. Ο ρόλος αυτής της σελίδας είναι μικρός αλλά σημαντικός. Μόλις φορτωθεί η σελίδα, αυτόματα μετά από δέκατα του δευτερολέπτου μεταφέρεται στην σελίδα Aexamino.tcl. Ουσιαστικά γίνεται μια αυτόματη ανανέωση της σελίδας για να εμφανιστούν όλες οι καταχωρημένες ερωτήσεις και απαντήσεις που έχουν γίνει μέχρι εκείνη τη στιγμή. Ανάλυση του κώδικα emfanisi.tcl puts <form\ name="a"\ action=''aexamino.td"\ method= post > puts <SCRIPT\ LANGUAGE="JavaScript"> puts var\ t\ =\ setlnterval(''document.a.smg.value='a'\;document.a.submit()\;n,100\)\; puts </SCRIPT>

34 Σ αυτό το κομμάτι κώδικα έχουμε ένα script της γλώσσας JavaScript το οποίο καλεί σε δέκατα του δευτερολέτπου τη φόρμα με το όνομα a" και ένα κουμπί τύπου hidden με όνομα smg και value="a που μας μεταφέρει στη επόμενη σελίδα Aexamino.tcl. Η σελίδα Aexamino.tcl έχει τρεις μορφές. Η πρώτη είναι η σελίδα όπου ο σπουδαστής μπορεί να δει όλες τις ερωτήσεις και τις απαντήσεις που αφορούν το συγκεκριμένο εξάμηνο και μπορεί να εισάγει την δική του ερώτηση μέσω του πλαισίου εισαγωγής κειμένου. Ανάλυση του κώδικα Aexamino.tcl (πρώτη υορφή) set ί [sql "select id from i where math='$math$r'"] sql "insert into forum(user,math,text,rd,id) values('$user','$math', $text, $rd,'$math\- $rd\-$i')" sql "update i set id='[incr i]' where math=='$math$rd"' Στο παραπάνω κώδικα γίνεται η καταχώρηση όλων των στοιχείων στο πίνακα forum και επίσης ανανεώνεται το πεδίο id του πίνακα i το οποίο μετά την καταχώρηση στο πίνακα forum αυξάνει το i του πεδίου id κατά ένα.

35 set y [sql "select * from forum where math='$math && rd='$rd"t foreach {tmp} $y { set user [lindex $tmp 0] set math [lindex $tmp 1] set text [lindex $tmp 2] set rd [lindex $tmp 3] set id [lindex $tmp 4] if{$text!=""}{ puts <td\ bgcolor=ίightgreyλ width="40"><b>$user</b> puts <td\ background="../forumline.bmp"><b>$text</b> Στο παραπάνω κώδικα εισάγεται στη μεταβλητή y όλες οι ερωτήσεις ποα έχουν καταχωρηθεί για κάποιο μάθημα και θέμα που επέλεξε πριν ο σπουδαστής και εμφανίζεται στη σελίδα τα username των σπουδαστών και οι ερωτήσεις που έχουν καταχωρήσει. set ζ [sql "select * from answer where id='$id"'] foreach {temp} $z { set id1 [lindex $tmp 0] set user! [lindex $temp 1] set text1 [lindex $temp 2] if {$text1!=""}{ puts <td\ bgcolor="white"\ width="40"><b>$user1 </b> puts <td\ bgcolor="white">-\ $text1 Στο παραπάνω κώδικα γίνεται η καταχώρηση στη μεταβλητή ζ όλες οι απαντήσεις που έχουν ως id το id των ερωτήσεων από τον πίνακα forum, ώστε να γίνεται ο σωστός συνδυασμός ερωτήσεων - απαντήσεων στη σελίδα που εμφανίζεται, δηλαδή η κάθε απάντηση να εμφανίζεται ακριβώς από κάτω της ερώτησης για την οποία έχουν δώσει απαντήσεις οι σπουδαστές. Η δεύτερη μορφή της σελίδας είναι όταν ο σπουδαστής θέλει να απαντήσει σε κάποια από τις ερωτήσεις πατώντας το κουμπί ΑΠΑΝΤΗΣΗ που θα του εμφανίσει μόνο τις ερωτήσεις και ένα πλαίσιο εισαγωγής κειμένου για να καταχωρήσει την απάντησή του.

36 Ανάλυση του κώδικα Aexamino.tcl (δεύτερη υορφη) puts <form\ action="kataxorisi.tcn method=''post"> puts <input\ type="hidden"\ name="math"\ value= $math"> puts <input\ type="hidden"\ name=''r"\ value="$rd > puts <input\ type="hidden"\ name="us8r"\ value= $user > puts <input\ type="text"\ name=''text"\ size="120"> set i [sql "select id from i where math='$math$r'"] puts <input\ type="submit"\ name="input \ valuer ΑΠΑΝΤΗΣΗ > sql "insert into forum(user,math,text,rd,id) values('$user,'$math','$text','$rd','$math\- $rd\-$i')" set y [sql "select * from forum where math='$math && rd- $rd ] Με TO παραπάνω κώδικα γίνεται ri επιλογή όλων των ερωτήσεων που αφορούν κάποιο συγκεκριμένο μάθημα και θέμα του εξαμήνου. Μετά την καταχώριση της απάντησης από τον σπουδαστή για κάποια από τις εμφανιζόμενες ερωτήσεις και πατώντας το κουμπί ΑΠΑΝΤΗΣΗ'' που είναι τύπου submit" μεταφέρεται στη σελίδα kataxorisi.tcl την οποία θα αναλύσουμε στη συνέχεια.

37 foreach {tmp} $y { set user [lindex $tmp 0] set math [lindex $tmp 1] set text [lindex $tmp 2] set rd [lindex $tmp 3] set id [lindex [split $tmp -] 2] if{$text!=""}{ puts <input\ type="radio"\ checked\ name="aprad^ value="$math\-$rd\-$id"> puts <b>$user</b> puts <b>$text</b> incr id } } Με TO παραπάνω κώδικα yivctai η εμφάνιση όλων των ερωτήσεων και των σποαδαστών που τις καταχώρησαν όπως φα^εται και στην εικόνα Aexamino.tcl (δεύτερη μορφή). Η τρίτη και η τελεuταiα μορφή της σελiδας Aexamino.tcl εμφανίζεται όταν πατήσει ο σπουδαστής το κουμπί "BACK" για να μεταφερθεί στη κεντρική σελίδα επιλογής εξαμήνων η οποία είναι ίδια με την auth2.tcl.

38 Όπως ανέφερα και πιο πάνω μετά την πληκτρολόγηση της απάντησης για κάποια επιλεγμένη ερώτηση και πατώντας το κουμπί ΑΠΑΝΤΗΣΗ" μεταφέρεται στη σελίδα Κ3ΐ3χοπ3ί.ΙσΙ η οποία στην ουσία είναι μια βοηθητική σελίδα και εμφανίζεται μόνο για κάποια δέκατα του δευτερολέτπου και αυτόματα μεταφέρεται στη σελίδα Ασχβιπίηο.ίοΙ στην οποία πλέον θα εμφανιστούν όλες οι προηγούμενες ερωτήσεις και απαντήσεις συν την καινούργια απάντηση. Όλα τα παραπάνω αφορούσαν το Α εξάμηνο, παρομοίως γίνεται και με τα υπόλοιπα εξάμηνα. Στο σημείο αυτό έχει ολοκληρωθεί όλη η παρουσίαση του Forum. > Οι σελίδες του chat Η πρώτη σελίδα του ch3t ονομάζεται Ιοςίη.ΙοΙ όπου ο σπουδαστής καλείται να συμπληρώσει στη φόρμα που του εμφανίζεται το username και το password του για να μπει στο chat. Ανάλυση του κώδικα Ιοαίη.ώΙ puts <form\ actίon= auth.tcπ method="post"> puts <table> puts <td>username: puts <td><input\ type="text"\ name="u"> <td>password:

39 puts <td><input\ type="password"\ name=''p"><br> <td\ colspan="2"\ align="center"><input\ type="submit"\ value="login"> </form> Σ αυτό TO κομμάτι κώδικα φτιάχνουμε δύο text box τα οποία είναι για το username και το password και ένα κουμπί "Login" τύπου submit το οποίο μας συνδέει με τη σελίδα auth.tcl. Μετά την εισαγωγή του username και του password και πατώντας το κουμπί Login η σελίδα αυτή όπως ανέφερα οδηγεί στην επόμενη σελίδα που ονομάζεται auth.tcl η οποία μπορεί να εμφανιστεί σε δύο μορφές ανάλογα με το αν ο σπουδαστής έχει καταχωρήσει σωστά ή λανθασμένα τα στοιχεία. Σε περίτπωση λανθασμένης εισαγωγής εμφανίζεται η παρακάτω σελίδα. LJ- * -... S 'A m.'-kaf "R o a 1 SP auth.tcl Ανάλυση του κώδικα auth.tcl ίσε περίπτωση λανθασυένης εισαγωγής) puts <form\ action=''auth.tcl''\ method="post"> puts <table><tr> puts <td>username: puts <td><input\ type="text"\ name="u > <td>password: puts <td><input\ type="password"\ name="p"><br> <td\ colspan="2"\ align="center"><input\ type="submit"\ value="login"> </form>

40 puts <font\ color="red^ size="3^ face=tahoma>authentication\ ErroiA Try\ Again!!! Είναι ακριβώς ο ίδιος κώδικας όπως της προηγούμενης σελίδας με τη διαφορά ότι αν ο σπουδαστής έχει δώσει λάθος στοιχεία, τότε θα εμφανιστεί η σελίδα στην οποία παρατηρούμε το αντίστοιχο μήνυμα λάθους εισαγωγής στοιχείων. Σε περίπτωση σωστής εισαγωγής του username και του password από τον σπουδαστή θα μεταφερθεί στη σελίδα auth.tcl η οποία είναι βοηθητική και εμφανίζεται για κάποια δέκατα του δευτερολέπτου και αυτόματα μεταφέρεται στη σελίδα chat.tcl όπου πλέον ο σπουδαστής βρίσκεται στο chat room. Ανάλυση του κώδικα auth.tcl Παρακάτω βλέπετε ένα κομμάτι κώδικα όπου ένα script της γλώσσας JavaScript καλεί αυτόματα ένα κουμπί τύπου hidden σε δέκατα του δευτερολέτπου το οποίο μας μεταφέρει στη σελίδα chat.tcl. puts <form\ name="ch"\ action="chat.tcr\ method="post"> puts <SCRIPT\ LANGUAGE="JavaScript"> puts var\t\ =\ setlnterval ("document.ch.smg.value='a \;document.ch.submit() \;\"\,100\)\: puts </SCRIPT> puts <input\ type="hidden"\ name="smg"\ value="a">

41 Στη παραπάνω εικόνα βλέπουμε τον χρήστης με username spmichai που μπήκε στο chat και μαζί του βρίσκονται και άλλοι δύο χρήστες, ο achmίcha και ο vaananί. Και οι τρεις έχουν τη δυνατότητα να ανταλλάξουν μεταξύ τους μηνύματα. Τα μηνύματα που μπορούν να στείλουν οι χρήστες είναι δύο μορφών, μηνύματα που θα τα βλέπουν όλοι οι παραβρισκόμενοι στο chat και μηνύματα προς έναν, δηλαδή θα τα βλέπει μόνο αυτός τον οποίο έχει επιλέξει ο χρήστης (στη προκειμένη περίτττωση ο spmίchaί ) πατώντας το ταάίο button που βρίσκεται μπροστά από κάθε username στη λίστα. Στη παραπάνω εικόνα βλέπουμε να έχουν σταλεί δύο μηνύματα από τους χρήστες achmίcha και vaanani" τα οποία μπορούν να τα βλέπουν όλοι όσοι βρίσκονται στο chat. Παρακάτω βλέπουμε ο χρήστης spmichaί να έχει στείλει ένα ιδιωτικό μήνυμα προς τον χρήστη νααηαηί ο οποίος θα το δει στη μορφή: spmίchaί: νασηαηί> PIGES STO MATHIMA?" ενώ ο χρήστης achmίcha δε θα το δει το συγκεκριμένο μήνυμα. i t l l\a\ R o o i chat.tcl Ανάλυση του κώδικα chat.tcl sql "insert into chat(username,text) values('$h','$a')" sql "delete from chat where text="" set s [sql "select * from chat"] set name [sql "select DISTINCT name from names order by name"] foreach {tmp} $s {