<?xml version="1.0" encoding="utf-8"?>
<page xmlns="http://projectmallard.org/1.0/" xmlns:xi="http://www.w3.org/2001/XInclude" type="guide" style="task" id="messagedialog.js" xml:lang="el">
  <info>
  <title type="text">MessageDialog (JavaScript)</title>
    <link type="guide" xref="beginner.js#windows"/>
    <link type="seealso" xref="GtkApplicationWindow.js"/>
    <link type="seealso" xref="gmenu.js"/>
    <link type="seealso" xref="label.js"/>
    <revision version="0.2" date="2012-06-25" status="draft"/>

    <credit type="author copyright">
      <name>Taryn Fox</name>
      <email>jewelfox@fursona.net</email>
      <years>2012</years>
    </credit>

    <desc>Ένα επισυναπτόμενο αναδυόμενο μήνυμα σε ένα παράθυρο</desc>
  </info>

  <title>MessageDialog</title>
  <media type="image" mime="image/png" src="media/messagedialog.png"/>
  <p>Ένας MessageDialog είναι ένας αναγκαστικός διάλογος μηνύματος, που σημαίνει έναν αναδυόμενο στον οποίο πρέπει να απαντήσετε πριν να επιστρέψετε σε ότι κάνατε στο παράθυρο στο οποίο είναι προσαρτημένο. Αυτό μπορεί να προκαλέσει την έκρηξη του κόσμου (ή τουλάχιστον λέει ότι μπορεί). Για να κάνετε το αναδυόμενο να εμφανιστεί όταν εκτελείτε αυτό το δείγμα, πατήστε στο "Message" μέσα στο μενού της εφαρμογής του -- αυτό είναι το μενού που εμφανίζεται όταν πατάτε στο όνομα μιας εφαρμογής στην πάνω αριστερή γωνία της οθόνης, δίπλα στις ενέργειες.</p>
  <note><p>Η διαφορά μεταξύ ενός MessageDialog και ενός <link xref="dialog.js">διαλόγου</link> είναι ότι ο διάλογος μπορεί να περιέχει οποιαδήποτε γραφικά συστατικά και περιεχόμενο θέλετε να βάλετε μέσα, ενώ ένας MessageDialog είναι απλά ένας βολικός τρόπος να κάνετε τα αναδυόμενα να εμφανιστούν με ένα βασικό μήνυμα και κουμπιά.</p></note>
    <links type="section"/>

  <section id="imports">
    <title>Βιβλιοθήκες για εισαγωγή</title>
    <code mime="application/javascript"><![CDATA[
#!/usr/bin/gjs

const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
const Lang = imports.lang;
]]></code>
    <p>Αυτές είναι οι βιβλιοθήκες που χρειαζόμαστε να εισάγουμε αυτήν την εφαρμογή για να εκτελεστεί. Να θυμόσαστε ότι η γραμμή που λέει στο GNOME ότι χρησιμοποιούμε Gjs χρειάζεται πάντοτε να πάει στην αρχή.</p>
  </section>

  <section id="applicationwindow">
    <title>Δημιουργία του παραθύρου εφαρμογής</title>
    <code mime="application/javascript"><![CDATA[
const MessageDialogExample = new Lang.Class ({
    Name: 'MessageDialog Example',

    // Create the application itself
    _init: function () {
        this.application = new Gtk.Application ({
            application_id: 'org.example.jsmessagedialog',
            flags: Gio.ApplicationFlags.FLAGS_NONE });

        // Connect 'activate' and 'startup' signals to the callback functions
        this.application.connect('activate', Lang.bind(this, this._onActivate));
        this.application.connect('startup', Lang.bind(this, this._onStartup));
    },

    // Callback function for 'activate' signal presents windows when active
    _onActivate: function () {
        this._window.present ();
    },

    // Callback function for 'startup' signal initializes menus and builds the UI
    _onStartup: function () {
        this._initMenus();
        this._buildUI ();
    },
]]></code>
    <p>Όλος ο κώδικας για αυτό το παράδειγμα πηγαίνει στην κλάση MessageDialogExample. Ο παραπάνω κώδικας δημιουργεί μια <link href="http://www.roojs.com/seed/gir-1.2-gtk-3.0/gjs/Gtk.Application.html">Gtk.Application</link> για να μπουν μέσα τα γραφικά συστατικά μας και τα παράθυρα.</p>
    <note><p>Πριν καλέσουμε _buildUI για δημιουργία του παραθύρου και των γραφικών συστατικών μέσα του, χρειαζόμαστε να καλέσουμε _initMenus, που λέει στο GNOME να δημιουργήσει το μενού. Μπορούμε να βάλουμε τον ενεργό κώδικα για _initMenus μετά τον κώδικα για _buildUI, αφού δεν πειράζει η σειρά που τα βάλαμε όσο το _initMenus καλείται πρώτο στο _onStartup.</p></note>
    <code mime="application/javascript"><![CDATA[
    // Build the application's UI
    _buildUI: function () {

        // Create the application window
        this._window = new Gtk.ApplicationWindow  ({
            application: this.application,
            window_position: Gtk.WindowPosition.CENTER,
            title: "Gtk.MessageDialog Example",
            default_height: 200,
            default_width: 400 });
]]></code>
    <p>Η συνάρτηση _buildUI είναι εκεί που βάζουμε όλον τον κώδικα για να δημιουργήσουμε τη διεπαφή χρήστη της εφαρμογής. Το πρώτο βήμα δημιουργεί ένα νέο <link xref="GtkApplicationWindow.js">Gtk.ApplicationWindow</link> για να βάλουμε μέσα τα γραφικά συστατικά μας.</p>

    <code mime="application/javascript"><![CDATA[
        // Create a silly warning message and add it to the window
        this.warningLabel = new Gtk.Label ({
            label: "This application goes boom! (Not really.)"});
        this._window.add (this.warningLabel);
]]></code>
    <p>Για αυτό το παράδειγμα, όλο ότι έχουμε στο παράθυρο που εμφανίζεται το αναδυόμενο είναι μια ανόητη προειδοποίηση <link xref="label.js">Label</link>.</p>
  </section>

  <section id="menu">
    <title>Δημιουργία του μενού της εφαρμογής</title>
    <code mime="application/javascript"><![CDATA[
    // Build the application menu, including the button that calls the dialog
    _initMenus: function() {
        let menu = new Gio.Menu();
        menu.append("Message",'app.message');
        menu.append("Quit",'app.quit');
        this.application.set_app_menu(menu);

        // This pops up a MessageDialog when "Message" is clicked in the menu
        let messageAction = new Gio.SimpleAction ({ name: 'message' });
        messageAction.connect('activate', Lang.bind(this,
            function() {
                this._showMessageDialog();
            }));
        this.application.add_action(messageAction);

        // This closes the window when "Quit" is clicked in the menu
        let quitAction = new Gio.SimpleAction ({ name: 'quit' });
        quitAction.connect('activate', Lang.bind(this,
            function() {
                this._window.destroy();
            }));
        this.application.add_action(quitAction);
    },
]]></code>
    <p>Εδώ, κατασκευάζουμε το <link xref="gmenu.js">GMenu</link> όπου θα βάλουμε το κουμπί "Message" που προκαλεί το αναδυόμενο MessageDialog. Το GMenu είναι το μενού που εμφανίζεται όταν πατάς το όνομα της εφαρμογής στην πάνω αριστερή γωνία της οθόνης, δίπλα στο μενού ενέργειες. Το μενού μας έχει μόνο δύο επιλογές: μήνυμα και κλείσιμο.</p>
  </section>

  <section id="messagedialog">
    <title>Δημιουργία του MessageDialog</title>
    <code mime="application/javascript"><![CDATA[
    _showMessageDialog: function () {

        // Create a modal MessageDialog whose parent is the window
        this._messageDialog = new Gtk.MessageDialog ({
            transient_for: this._window,
            modal: true,
            buttons: Gtk.ButtonsType.OK_CANCEL,
            message_type: Gtk.MessageType.WARNING,
            text: "This action will cause the universe to stop existing." });

        this._messageDialog.connect ('response', Lang.bind(this, this._response_cb));
        this._messageDialog.show();
    },
]]></code>
    <p>Για να κάνετε τον MessageDialog μας ένα προσαρτημένο αναδυόμενο στο κύριο παράθυρο, ορίζουμε την αναγκαστική του ιδιότητα σε αληθή και το ορίζουμε να είναι "transient_for" _window. Μετά από αυτό, μπορούμε να ορίσουμε τι είδους κουμπιά έχει και τι είδους μήνυμα είναι (που καθορίζει τι εικονίδιο εμφανίζεται δίπλα στο μήνυμα) και να γραφτεί το κείμενο μέσα του, πριν τη σύνδεση του σήματος του "response" στη συνάρτηση επανάκλησης που το χειρίζεται.</p>
    <note><p>Εδώ υπάρχουν μερικές πηγές για να κάνετε τα δικά σας MessageDialogs:</p>
      <list>
        <item><p><link href="http://developer.gnome.org/gtk3/stable/GtkMessageDialog.html#GtkButtonsType">Λίστα των τύπων κουμπιού</link></p></item>
        <item><p><link href="http://developer.gnome.org/gtk3/stable/GtkMessageDialog.html#GtkMessageType">Λίστα των τύπων μηνύματος</link></p></item>
      </list>
    </note>

    <code mime="application/javascript"><![CDATA[
    // Callback function (aka signal handler) for the response signal
    _response_cb: function (messagedialog, response_id) {

        // A simple switch that changes the main window's label
        switch (response_id) {
            case Gtk.ResponseType.OK:
                this.warningLabel.set_label ("*BOOM*\n");
                break;
            case Gtk.ResponseType.CANCEL:
                this.warningLabel.set_label ("Good choice!\n");
                break;
            case Gtk.ResponseType.DELETE_EVENT:
                this.warningLabel.set_label ("Dialog closed or cancelled.\n");
                break;
        }

        this._messageDialog.destroy();

    }

});
]]></code>
    <p>Αυτή η συνάρτηση παίρνει δύο παραμέτρους, τον MessageDialog και την response_id, και οι δυο τους παρέχονται αυτόματα (δεν χρειάζεται να τις περάσετε αυτόματα σε αυτό για να δουλέψει). Εδώ χρησιμοποιούμε ένα απλό διακόπτη για αλλαγή του κειμένου της "warning label", ανάλογα με το ποια επιλογή διαλέγετε. Η DELETE_EVENT συμβαίνει εάν πατήσετε διαφυγή για να ακυρώσετε τον MessageDialog, αντί να πατήσετε εντάξει ή ακύρωση. Ό,τι και να επιλέξετε, το αναδυόμενο καταστρέφεται κατόπιν.</p>

    <code mime="application/javascript"><![CDATA[
// Run the application
let app = new MessageDialogExample ();
app.application.run (ARGV);
]]></code>
    <p>Τελικά, δημιουργούμε ένα νέο στιγμιότυπο της ολοκληρωμένης κλάσης MessageDialogExample και εκτελούμε την εφαρμογή.</p>
  </section>

  <section id="complete">
    <title>Δείγμα πλήρους κώδικα</title>
<code mime="application/javascript" style="numbered"><xi:include href="samples/messagedialog.js" parse="text"><xi:fallback/></xi:include></code>
  </section>

  <section id="in-depth">
    <title>Τεκμηρίωση σε βάθος</title>
<p>Σε αυτό το παράδειγμα χρησιμοποιήσαμε τα παρακάτω:</p>
<list>
  <item><p><link href="http://developer.gnome.org/gio/unstable/GMenu.html">GMenu</link></p></item>
  <item><p><link href="http://developer.gnome.org/gio/stable/GSimpleAction.html">GSimpleAction</link></p></item>
  <item><p><link href="http://www.roojs.com/seed/gir-1.2-gtk-3.0/gjs/Gtk.Application.html">Εφαρμογή Gtk</link></p></item>
  <item><p><link href="http://developer.gnome.org/gtk3/stable/GtkApplicationWindow.html">Gtk.ApplicationWindow</link></p></item>
  <item><p><link href="http://www.roojs.com/seed/gir-1.2-gtk-3.0/gjs/Gtk.MessageDialog.html">Gtk.MessageDialog</link></p></item>
</list>
  </section>
</page>
