[gnome-devel-docs] tutorials <javascript>: Added Gtk.AboutDialog code sample and Mallard page

[Tiffany Antopolski <antopolski src gnome org>]

commit 52091f2ab52fd8dfd6f2ae5fb7583bb83ee4620c
Author: Taryn Fox <jewelfox fursona net>
Date:   Wed May 30 22:54:11 2012 -0400

    tutorials <javascript>: Added Gtk.AboutDialog code sample and Mallard page

 platform-demos/C/aboutdialog.js.page    |   33 +++++++++
 platform-demos/C/samples/aboutdialog.js |  112 +++++++++++++++++++++++++++++++
 2 files changed, 145 insertions(+), 0 deletions(-)
---
diff --git a/platform-demos/C/aboutdialog.js.page b/platform-demos/C/aboutdialog.js.page
new file mode 100644
index 0000000..67d80b3
--- /dev/null
+++ b/platform-demos/C/aboutdialog.js.page
@@ -0,0 +1,33 @@
+<page xmlns="http://projectmallard.org/1.0/";
+      xmlns:xi="http://www.w3.org/2001/XInclude";
+      type="guide" style="task"
+      id="aboutdialog.js">
+  <info>
+    <link type="guide" xref="beginner.js#windows"/>
+    <revision version="0.1" date="2012-05-30" status="draft"/>
+
+    <credit type="author copyright">
+      <name>Taryn Fox</name>
+      <email>jewelfox fursona net</email>
+      <years>2012</years>
+    </credit>
+
+    <desc>Display information about an application</desc>
+  </info>
+
+  <title>AboutDialog</title>
+  <media type="image" mime="image/png" src="media/aboutdialog_GMenu.png"/>
+  <p>A modal dialog window which shows information about an application and its creators. This one is triggered by clicking "About" in the application's menu, which is normally a good place to put it.</p>
+
+<code mime="text/javascript" style="numbered"><xi:include href="samples/aboutdialog.js" parse="text"><xi:fallback/></xi:include></code>
+<p>
+  In this sample we used the following:
+</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.AboutDialog.html";>Gtk.AboutDialog</link></p></item>
+  <item><p><link href="http://www.roojs.com/seed/gir-1.2-gtk-3.0/gjs/Gtk.Application.html";>Gtk.Application</link></p></item>
+  <item><p><link href="http://developer.gnome.org/gtk3/stable/GtkApplicationWindow.html";>Gtk.ApplicationWindow</link></p></item>
+</list>
+</page>
diff --git a/platform-demos/C/samples/aboutdialog.js b/platform-demos/C/samples/aboutdialog.js
new file mode 100644
index 0000000..cbe0409
--- /dev/null
+++ b/platform-demos/C/samples/aboutdialog.js
@@ -0,0 +1,112 @@
+#!/usr/bin/gjs
+
+const Gio = imports.gi.Gio;
+const GLib = imports.gi.GLib;
+const Gtk = imports.gi.Gtk;
+const Lang = imports.lang;
+
+const AboutDialogExample = new Lang.Class ({
+	Name: 'AboutDialog Example',
+
+	// Create the application itself
+        _init: function () {
+   	     this.application = new Gtk.Application ({
+  	          application_id: 'org.example.jsaboutdialog',
+  	          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 creates the menu and builds the UI
+	_onStartup: function () {
+	        this._initMenus();
+		this._buildUI ();
+	},
+
+
+
+
+	// 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: "AboutDialog Example",
+                                                     	     default_height: 250,
+                                                     	     default_width: 350 });
+
+       	 	// Show the window and all child widgets
+       	 	this._window.show_all();
+	},
+
+
+
+	// Create the application menu
+	_initMenus: function() {
+		let menu = new Gio.Menu();
+		menu.append("About", 'app.about');
+		menu.append("Quit",'app.quit');
+		this.application.set_app_menu(menu);
+
+		// Create the "About" menu option and have it call the _showAbout() function
+		let aboutAction = new Gio.SimpleAction ({ name: 'about' });
+		aboutAction.connect('activate', Lang.bind(this,
+			function() {
+				this._showAbout();
+			}));
+		this.application.add_action(aboutAction);
+
+		// Create the "Quit" menu option and have it close the window
+		let quitAction = new Gio.SimpleAction ({ name: 'quit' });
+		quitAction.connect('activate', Lang.bind(this,
+			function() {
+				this._window.destroy();
+			}));
+		this.application.add_action(quitAction);
+	},
+
+
+
+	_showAbout: function() {
+
+		// String arrays of the names of the people involved in the project
+		var authors = ["GNOME Documentation Team"];
+		var documenters = ["GNOME Documentation Team"];
+
+		// Create the About dialog
+		let aboutDialog = new Gtk.AboutDialog({ title: "AboutDialog Example",
+							program_name: "GtkApplication Example",
+							copyright: "Copyright \xa9 2012 GNOME Documentation Team",
+							authors: authors,
+							documenters: documenters,
+							website: "http://developer.gnome.org";,
+							website_label: "GNOME Developer Website" });
+
+		// Attach the About dialog to the window
+		aboutDialog.modal = true;
+		aboutDialog.transient_for = this._window;
+
+		// Show the About dialog
+		aboutDialog.show();
+
+		// Connect the Close button to the destroy signal for the dialog
+		aboutDialog.connect('response', function() {
+			aboutDialog.destroy();
+		});
+
+	}
+
+});
+
+// Run the application
+let app = new AboutDialogExample ();
+app.application.run (ARGV);