[gnome-devel-docs] demos: Give JS samples the same treatment
- From: Florian Müllner <fmuellner src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-devel-docs] demos: Give JS samples the same treatment
- Date: Mon, 4 Dec 2017 19:32:03 +0000 (UTC)
commit bc2b4a14ca9ac295dc9ee578f8dd30e73b23e9fd
Author: Florian Müllner <fmuellner gnome org>
Date: Sat Nov 25 00:50:57 2017 +0100
demos: Give JS samples the same treatment
After updating the tour to use modern javascript patterns and coding
style, go through all provided samples and update them to use arrow
notation, Function.prototype.bind() and ES6 classes.
https://bugzilla.gnome.org/show_bug.cgi?id=791111
platform-demos/C/02_welcome_to_the_grid.js.page | 28 +++---
platform-demos/C/03_getting_the_signal.js.page | 40 ++++----
platform-demos/C/checkbutton.js.page | 33 +++---
platform-demos/C/combobox.js.page | 38 ++++----
platform-demos/C/samples/02_welcome_to_the_grid.js | 27 +++---
.../C/samples/03_getting_the_signal_01.js | 37 +++----
.../C/samples/03_getting_the_signal_02.js | 37 +++----
.../C/samples/03_getting_the_signal_03.js | 37 +++----
.../C/samples/03_getting_the_signal_04.js | 37 +++----
platform-demos/C/samples/GtkApplicationWindow.js | 32 +++---
platform-demos/C/samples/aboutdialog.js | 54 +++++------
platform-demos/C/samples/button.js | 46 +++++-----
platform-demos/C/samples/buttonbox.js | 46 +++++----
platform-demos/C/samples/checkbutton.js | 40 ++++----
platform-demos/C/samples/colorbutton.js | 39 ++++----
platform-demos/C/samples/combobox.js | 46 ++++-----
platform-demos/C/samples/comboboxtext.js | 45 ++++-----
platform-demos/C/samples/dialog.js | 54 +++++-----
platform-demos/C/samples/entry.js | 46 ++++-----
platform-demos/C/samples/fontchooserwidget.js | 33 +++---
platform-demos/C/samples/gmenu.js | 57 +++++------
platform-demos/C/samples/grid.js | 51 +++++-----
platform-demos/C/samples/hello-in-js/hello-world | 26 +++---
platform-demos/C/samples/hellognome.js | 32 +++---
platform-demos/C/samples/image.js | 97 +++++++++----------
platform-demos/C/samples/label.js | 65 ++++++------
platform-demos/C/samples/linkbutton.js | 40 ++++----
platform-demos/C/samples/menubutton.js | 67 ++++++-------
platform-demos/C/samples/messagedialog.js | 76 ++++++---------
platform-demos/C/samples/paned.js | 27 +++---
platform-demos/C/samples/progressbar.js | 50 +++++-----
platform-demos/C/samples/radiobutton.js | 58 +++++-------
platform-demos/C/samples/scale.js | 44 ++++-----
platform-demos/C/samples/scrolledwindow.js | 46 +++++----
platform-demos/C/samples/spinbutton.js | 45 ++++-----
platform-demos/C/samples/spinner.js | 52 +++++------
platform-demos/C/samples/statusbar.js | 60 +++++-------
platform-demos/C/samples/switch.js | 85 +++++++----------
platform-demos/C/samples/textview.js | 46 ++++-----
platform-demos/C/samples/togglebutton.js | 41 ++++-----
platform-demos/C/samples/toolbar.js | 103 +++++++++-----------
platform-demos/C/samples/tooltip.js | 83 +++++++++--------
.../C/samples/treeview_simple_liststore.js | 48 ++++------
platform-demos/C/samples/window.js | 36 +++----
44 files changed, 978 insertions(+), 1152 deletions(-)
---
diff --git a/platform-demos/C/02_welcome_to_the_grid.js.page b/platform-demos/C/02_welcome_to_the_grid.js.page
index 6f73f24..3f29276 100644
--- a/platform-demos/C/02_welcome_to_the_grid.js.page
+++ b/platform-demos/C/02_welcome_to_the_grid.js.page
@@ -43,40 +43,38 @@
<code mime="application/javascript"><![CDATA[
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
]]></code>
- <p>This part always goes at the start of your code. Depending on what you'll be doing with it, you may
want to declare more imports here. What we're writing today is pretty basic, so these are all we need; Gtk
for the widgets, and Lang so we can use Lang.bind to connect our application's activate and startup signals
to the requisite functions.</p>
+ <p>This part always goes at the start of your code. Depending on what you'll be doing with it, you may
want to declare more imports here. What we're writing today is pretty basic, so these are all we need; Gtk
for the widgets, using the stable '3.0' API.</p>
<p>Speaking of which:</p>
<code mime="application/javascript"><![CDATA[
-const WelcomeToTheGrid = new Lang.Class({
- Name: 'Welcome to the Grid',
-
+class WelcomeToTheGrid {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
+ _onStartup() {
this._buildUI ();
- },
+ }
]]></code>
<p>This is the start of the application itself, and the _init function which creates it. It tells
_buildUI to create an ApplicationWindow, which we're going to call _window, and it tells our window to
present itself whenever needed.</p>
<p>This part, again, is pretty much copy-and-paste, but you always want to give your application a
unique name.</p>
<code mime="application/javascript"><![CDATA[
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -137,7 +135,7 @@ const WelcomeToTheGrid = new Lang.Class({
this._window.show_all();
}
-});
+};
// Run the application
let app = new WelcomeToTheGrid ();
diff --git a/platform-demos/C/03_getting_the_signal.js.page b/platform-demos/C/03_getting_the_signal.js.page
index 9ee6d87..4b108fa 100644
--- a/platform-demos/C/03_getting_the_signal.js.page
+++ b/platform-demos/C/03_getting_the_signal.js.page
@@ -42,35 +42,33 @@
<code mime="application/javascript"><![CDATA[
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
// We start out with 0 cookies
var cookies = 0;
-const GettingTheSignal = new Lang.Class({
- Name: 'Getting the Signal',
-
+class GettingTheSignal {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
+ _onStartup() {
this._buildUI ();
- },
+ }
]]></code>
- <p>Take a look at the part that uses our application's connect method and Lang.bind, to connect its
activate and startup signals to the functions that present the window and build the UI. We're going to do the
same thing with our Button when we get to it, except that we're going to connect its "clicked" signal
instead.</p>
+ <p>Take a look at the part that uses our application's connect method and bind, to connect its activate
and startup signals to the functions that present the window and build the UI. We're going to do the same
thing with our Button when we get to it, except that we're going to connect its "clicked" signal instead.</p>
</section>
<section id="button">
@@ -79,7 +77,7 @@ const GettingTheSignal = new Lang.Class({
<p>As usual, we'll put all the code to create our Button and other widgets inside the _buildUI function,
which is called when the application starts up.</p>
<code mime="application/javascript"><![CDATA[
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
]]></code>
<p>First, we create the window itself:</p>
@@ -106,7 +104,7 @@ const GettingTheSignal = new Lang.Class({
this._cookieButton = new Gtk.Button ({ label: "Get a cookie" });
// Connect the cookie button to the function that handles clicking it
- this._cookieButton.connect ('clicked', Lang.bind (this, this._getACookie));
+ this._cookieButton.connect ('clicked', this._getACookie.bind(this));
]]></code>
<p>Finally, we create a Grid, attach the Label and Button to it, add it to the window and tell the
window to show itself and its contents. That's all we need inside the _buildUI function, so we close it with
a bracket, as well as a comma that tells GNOME to go on to the next function. Note that even though we wrote
the code for the Label first, we can still attach it to the Grid in a way that will put it on the bottom.</p>
<code mime="application/javascript"><![CDATA[
@@ -126,7 +124,7 @@ const GettingTheSignal = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
+ }
]]></code>
<p>Now, we write the _getACookie function. Whenever our Button sends out its "clicked" signal, the code
in this function will run. In this case, all it does is increase the number of cookies by 1, and update the
Label to show the new number of cookies. We do this using the Label's set_label method.</p>
<note style="tip"><p>Many widgets have the same properties and methods. Both Labels and Buttons, for
instance, have a label property that says what text is inside them, and get_label and set_label methods that
let you check what that text is and change it, respectively. So if you learn how one widget works, you'll
also know how others like it work.</p></note>
@@ -139,7 +137,7 @@ const GettingTheSignal = new Lang.Class({
}
-});
+};
]]></code>
<p>Finally, we run the application, using the same kind of code as in our last tutorial.</p>
@@ -169,7 +167,7 @@ app.application.run (ARGV);
<p>We don't actually need to connect the Switch to anything. All we need to do is write an if statement
in our _getACookie function, to check to see if the Switch is turned on. If we wanted to make something
happen as soon as you flip the Switch, though, we would connect its notify::active signal, like so:</p>
<code mime="application/javascript"><![CDATA[
// Connect the switch to the function that handles it
- this._cookieSwitch.connect ('notify::active', Lang.bind (this, this._cookieDispenser));
+ this._cookieSwitch.connect ('notify::active', this._cookieDispenser.bind(this));
]]></code>
<p>A Switch is set to the off position by default. If we wanted the Switch to start out turned on, we
would set the value of its active property to true when we create it.</p>
@@ -207,7 +205,7 @@ app.application.run (ARGV);
<p>Now we change the _getACookie function so that it checks to see if the cookie dispenser is turned on.
We do that by using the Switch's get_active method. It returns true if the Switch is turned on, and false if
the Switch is turned off.</p>
<note style="tip"><p>When a method is used in an if statement like this, the code inside the if
statement is executed if the method returns true.</p></note>
<code mime="application/javascript"><![CDATA[
- _getACookie: function() {
+ _getACookie() {
// Is the cookie dispenser turned on?
if (this._cookieSwitch.get_active()) {
@@ -278,7 +276,7 @@ app.application.run (ARGV);
<p>And then we change our _getACookie function to test to see if the cookie button is the one that's
selected.</p>
<code mime="application/javascript"><![CDATA[
- _getACookie: function() {
+ _getACookie() {
// Did you select "cookie" instead of "not cookie"?
if (this._cookieRadio.get_active()) {
@@ -318,7 +316,7 @@ app.application.run (ARGV);
<p>And now we modify _getACookie's if statement again, using the Entry's get_text method to retrieve the
text that you entered into it and see if you spelled "cookie" right. We don't care whether you capitalize
"cookie" or not, so we use JavaScript's built-in toLowerCase method to change the Entry's text to all lower
case inside the if statement.</p>
<note style="tip"><p>An Entry widget doesn't have a label property, which is a set text string that the
user can't change. (You can't normally change the label on a Button, for instance.) Instead, it has a text
property, which changes to match what the user types in.</p></note>
<code mime="application/javascript"><![CDATA[
- _getACookie: function() {
+ _getACookie() {
// Did you spell "cookie" correctly?
if ((this._spellCookie.get_text()).toLowerCase() == "cookie") {
diff --git a/platform-demos/C/checkbutton.js.page b/platform-demos/C/checkbutton.js.page
index d364acd..90a94cd 100644
--- a/platform-demos/C/checkbutton.js.page
+++ b/platform-demos/C/checkbutton.js.page
@@ -29,9 +29,10 @@
<code mime="application/javascript"><![CDATA[
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
]]></code>
<p>These are the libraries we need to import for this application to run. Remember that the line which
tells GNOME that we're using Gjs always needs to go at the start.</p>
</section>
@@ -39,35 +40,33 @@ const Lang = imports.lang;
<section id="applicationwindow">
<title>Creating the application window</title>
<code mime="application/javascript"><![CDATA[
-const CheckButtonExample = new Lang.Class({
- Name: 'CheckButton Example',
-
+class CheckButtonExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jscheckbutton',
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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
+ _onStartup() {
this._buildUI ();
- },
+ }
]]></code>
<p>All the code for this sample goes in the CheckButtonExample class. The above code creates a <link
href="http://www.roojs.com/seed/gir-1.2-gtk-3.0/gjs/Gtk.Application.html">Gtk.Application</link> for our
widgets and window to go in.</p>
<code mime="application/javascript"><![CDATA[
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -92,13 +91,13 @@ const CheckButtonExample = new Lang.Class({
this._button.set_active (true);
// Connect the button to a function that does something when it's toggled
- this._button.connect ("toggled", Lang.bind (this, this._toggledCB));
+ this._button.connect ("toggled", this._toggledCB.bind(this));
]]></code>
<p>This code creates the checkbutton itself. The label next to the checkbutton is created by giving the
checkbutton the "label" property and assigning a string value to it. Since this checkbutton toggles whether
the window title is on or off, and the window title will be on to start with, we want the box to be checked
by default. Whenever the user checks or unchecks the box, we call the _toggledCB function.</p>
<code mime="application/javascript"><![CDATA[
// Show the window and all child widgets
this._window.show_all();
- },
+ }
]]></code>
<p>This code finishes up creating the UI, by telling the window to show itself and all child widgets
(which is just the checkbutton in this case).</p>
</section>
@@ -106,7 +105,7 @@ const CheckButtonExample = new Lang.Class({
<section id="function">
<title>Function which handles the checkbutton's toggling</title>
<code mime="application/javascript"><![CDATA[
- _toggledCB: function () {
+ _toggledCB() {
// Make the window title appear or disappear when the checkbox is toggled
if (this._button.get_active() == true)
@@ -116,7 +115,7 @@ const CheckButtonExample = new Lang.Class({
}
-});
+};
]]></code>
<p>If the checkbutton is toggled from on to off, we want the window title to disappear. If it's toggled
from off to on, we want it to reappear. We can tell which way it was toggled by testing to see whether it's
active (checked) or not afterwards. A simple if / else statement which calls the checkbutton's get_active()
method will work for this.</p>
<code mime="application/javascript"><![CDATA[
diff --git a/platform-demos/C/combobox.js.page b/platform-demos/C/combobox.js.page
index 84e20a0..32ab193 100644
--- a/platform-demos/C/combobox.js.page
+++ b/platform-demos/C/combobox.js.page
@@ -34,9 +34,10 @@
<code mime="application/javascript"><![CDATA[
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const GObject = imports.gi.GObject;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
]]></code>
<p>These are the libraries we need to import for this application to run. Remember that the line which
tells GNOME that we're using Gjs always needs to go at the start.</p>
</section>
@@ -44,33 +45,32 @@ const Lang = imports.lang;
<section id="applicationwindow">
<title>Creating the application window</title>
<code mime="application/javascript"><![CDATA[
-const ComboBoxExample = new Lang.Class ({
- Name: 'ComboBox Example',
+class ComboBoxExample {
// Create the application itself
- _init: function () {
+ constructor() {
this.application = new Gtk.Application ({
application_id: 'org.example.jscombobox'});
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
+ _onActivate() {
this._window.present ();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
+ _onStartup() {
this._buildUI ();
- },
+ }
]]></code>
<p>All the code for this sample goes in the ComboBoxExample class. The above code creates a <link
href="http://www.roojs.com/seed/gir-1.2-gtk-3.0/gjs/Gtk.Application.html">Gtk.Application</link> for our
widgets and window to go in.</p>
<code mime="application/javascript"><![CDATA[
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({
@@ -151,7 +151,7 @@ const ComboBoxExample = new Lang.Class ({
this._comboBox.set_active (0);
// Connect the combobox's 'changed' signal to our callback function
- this._comboBox.connect ('changed', Lang.bind (this, this._onComboChanged));
+ this._comboBox.connect ('changed', this._onComboChanged.bind(this));
]]></code>
<p>We want the "Select" text to be the part people see at first, that gets them to click on the
ComboBox. So we set it to be the active entry. We also connect the ComboBox's <file>changed</file> signal to
a callback function, so that any time someone clicks on a new option something happens. In this case, we're
just going to show a popup with a little haiku.</p>
@@ -161,7 +161,7 @@ const ComboBoxExample = new Lang.Class ({
// Show the window and all child widgets
this._window.show_all();
- },
+ }
]]></code>
<p>Finally, we add the ComboBox to the window, and tell the window to show itself and everything inside
it.</p>
</section>
@@ -169,7 +169,7 @@ const ComboBoxExample = new Lang.Class ({
<section id="function">
<title>Function which handles your selection</title>
<code mime="application/javascript"><![CDATA[
- _selected: function () {
+ _selected() {
// The silly pseudohaiku that we'll use for our messagedialog
let haiku = ["",
@@ -193,26 +193,26 @@ const ComboBoxExample = new Lang.Class ({
text: haiku[activeItem]});
// Connect the OK button to a handler function
- this._popUp.connect ('response', Lang.bind (this, this._onDialogResponse));
+ this._popUp.connect ('response', this._onDialogResponse.bind(this));
// Show the messagedialog
this._popUp.show();
}
- },
+ }
]]></code>
<p>Before showing a MessageDialog, we first test to make sure you didn't choose the "Select" message.
After that, we set its text to be the haiku in the array that corresponds to the active entry in our
ComboBoxText. We do that using the <file>get_active</file> method, which returns the number ID of your
selection.</p>
<note style="tip"><p>Other methods you can use include <file>get_active_id</file>, which returns the
text ID assigned by <file>append</file>, and <file>get_active_text</file>, which returns the full text of the
string you selected.</p></note>
<p>After we create the MessageDialog, we connect its response signal to the _onDialogResponse function,
then tell it to show itself.</p>
<code mime="application/javascript"><![CDATA[
- _onDialogResponse: function () {
+ _onDialogResponse() {
this._popUp.destroy ();
}
-});
+};
]]></code>
<p>Since the only button the MessageDialog has is an OK button, we don't need to test its response_id to
see which button was clicked. All we do here is destroy the popup.</p>
diff --git a/platform-demos/C/samples/02_welcome_to_the_grid.js
b/platform-demos/C/samples/02_welcome_to_the_grid.js
index 6d9bd73..b56c2ee 100644
--- a/platform-demos/C/samples/02_welcome_to_the_grid.js
+++ b/platform-demos/C/samples/02_welcome_to_the_grid.js
@@ -1,34 +1,31 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const WelcomeToTheGrid = new Lang.Class({
- Name: 'Welcome to the Grid',
+class WelcomeToTheGrid {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
+ _onStartup() {
this._buildUI ();
- },
-
-
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -79,7 +76,7 @@ const WelcomeToTheGrid = new Lang.Class({
this._window.show_all();
}
-});
+};
// Run the application
let app = new WelcomeToTheGrid ();
diff --git a/platform-demos/C/samples/03_getting_the_signal_01.js
b/platform-demos/C/samples/03_getting_the_signal_01.js
index 98684ac..1505232 100644
--- a/platform-demos/C/samples/03_getting_the_signal_01.js
+++ b/platform-demos/C/samples/03_getting_the_signal_01.js
@@ -1,37 +1,34 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
// We start out with 0 cookies
var cookies = 0;
-const GettingTheSignal = new Lang.Class({
- Name: 'Getting the Signal',
+class GettingTheSignal {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -49,7 +46,7 @@ const GettingTheSignal = new Lang.Class({
this._cookieButton = new Gtk.Button ({ label: "Get a cookie" });
// Connect the cookie button to the function that handles clicking it
- this._cookieButton.connect ('clicked', Lang.bind (this, this._getACookie));
+ this._cookieButton.connect ('clicked', this._getACookie.bind(this));
// Create a grid to arrange everything inside
this._grid = new Gtk.Grid ({
@@ -67,11 +64,9 @@ const GettingTheSignal = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _getACookie: function() {
+ _getACookie() {
// Increase the number of cookies by 1 and update the label
cookies++;
@@ -79,7 +74,7 @@ const GettingTheSignal = new Lang.Class({
}
-});
+};
// Run the application
let app = new GettingTheSignal ();
diff --git a/platform-demos/C/samples/03_getting_the_signal_02.js
b/platform-demos/C/samples/03_getting_the_signal_02.js
index 8dbb3eb..7e926d6 100644
--- a/platform-demos/C/samples/03_getting_the_signal_02.js
+++ b/platform-demos/C/samples/03_getting_the_signal_02.js
@@ -1,37 +1,34 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
// We start out with 0 cookies
var cookies = 0;
-const GettingTheSignal = new Lang.Class({
- Name: 'Getting the Signal',
+class GettingTheSignal {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -50,7 +47,7 @@ const GettingTheSignal = new Lang.Class({
label: "Get a cookie" });
// Connect the cookie button to the function that handles clicking it
- this._cookieButton.connect ('clicked', Lang.bind (this, this._getACookie));
+ this._cookieButton.connect ('clicked', this._getACookie.bind(this));
// Create the switch that controls whether or not you can win
this._cookieSwitch = new Gtk.Switch ();
@@ -85,11 +82,9 @@ const GettingTheSignal = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _getACookie: function() {
+ _getACookie() {
// Is the cookie dispenser turned on?
if (this._cookieSwitch.get_active()) {
@@ -102,7 +97,7 @@ const GettingTheSignal = new Lang.Class({
}
-});
+};
// Run the application
let app = new GettingTheSignal ();
diff --git a/platform-demos/C/samples/03_getting_the_signal_03.js
b/platform-demos/C/samples/03_getting_the_signal_03.js
index a87d9d2..e108f01 100644
--- a/platform-demos/C/samples/03_getting_the_signal_03.js
+++ b/platform-demos/C/samples/03_getting_the_signal_03.js
@@ -1,37 +1,34 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
// We start out with 0 cookies
var cookies = 0;
-const GettingTheSignal = new Lang.Class({
- Name: 'Getting the Signal',
+class GettingTheSignal {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -63,7 +60,7 @@ const GettingTheSignal = new Lang.Class({
label: "Get a cookie" });
// Connect the cookie button to the function that handles clicking it
- this._cookieButton.connect ('clicked', Lang.bind (this, this._getACookie));
+ this._cookieButton.connect ('clicked', this._getACookie.bind(this));
// Create the label
this._cookieLabel = new Gtk.Label ({
@@ -86,11 +83,9 @@ const GettingTheSignal = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _getACookie: function() {
+ _getACookie() {
// Did you select "cookie" instead of "not cookie"?
if (this._cookieRadio.get_active()) {
@@ -103,7 +98,7 @@ const GettingTheSignal = new Lang.Class({
}
-});
+};
// Run the application
let app = new GettingTheSignal ();
diff --git a/platform-demos/C/samples/03_getting_the_signal_04.js
b/platform-demos/C/samples/03_getting_the_signal_04.js
index 52169d7..37def83 100644
--- a/platform-demos/C/samples/03_getting_the_signal_04.js
+++ b/platform-demos/C/samples/03_getting_the_signal_04.js
@@ -1,37 +1,34 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
// We start out with 0 cookies
var cookies = 0;
-const GettingTheSignal = new Lang.Class({
- Name: 'Getting the Signal',
+class GettingTheSignal {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -50,7 +47,7 @@ const GettingTheSignal = new Lang.Class({
label: "Get a cookie" });
// Connect the cookie button to the function that handles clicking it
- this._cookieButton.connect ('clicked', Lang.bind (this, this._getACookie));
+ this._cookieButton.connect ('clicked', this._getACookie.bind(this));
// Create the label
this._cookieLabel = new Gtk.Label ({
@@ -73,11 +70,9 @@ const GettingTheSignal = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _getACookie: function() {
+ _getACookie() {
// Did you spell "cookie" correctly?
if ((this._spellCookie.get_text()).toLowerCase() == "cookie") {
@@ -90,7 +85,7 @@ const GettingTheSignal = new Lang.Class({
}
-});
+};
// Run the application
let app = new GettingTheSignal ();
diff --git a/platform-demos/C/samples/GtkApplicationWindow.js
b/platform-demos/C/samples/GtkApplicationWindow.js
index 10c797a..7a2e69a 100644
--- a/platform-demos/C/samples/GtkApplicationWindow.js
+++ b/platform-demos/C/samples/GtkApplicationWindow.js
@@ -1,28 +1,28 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const Application = new Lang.Class ({
- Name: 'Application',
+class Application {
//create the application
- _init: function () {
+ constructor() {
this.application = new Gtk.Application ({
application_id: 'org.example.myapp',
flags: Gio.ApplicationFlags.FLAGS_NONE
});
//connect to '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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
//create the UI (in this case it's just the ApplicationWindow
- _buildUI: function () {
- this._window = new Gtk.ApplicationWindow ({ application: this.application,
+ _buildUI() {
+ this._window = new Gtk.ApplicationWindow({ application: this.application,
window_position: Gtk.WindowPosition.CENTER,
title: "Welcome to GNOME" });
@@ -31,18 +31,18 @@ const Application = new Lang.Class ({
//show the window and all child widgets (none in this case)
this._window.show_all();
- },
+ }
//callback function for 'activate' signal
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
//callback function for 'startup' signal
- _onStartup: function () {
- this._buildUI ();
+ _onStartup() {
+ this._buildUI();
}
-});
+};
//run the application
let app = new Application ();
diff --git a/platform-demos/C/samples/aboutdialog.js b/platform-demos/C/samples/aboutdialog.js
index 31744be..a050a64 100644
--- a/platform-demos/C/samples/aboutdialog.js
+++ b/platform-demos/C/samples/aboutdialog.js
@@ -1,38 +1,38 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
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',
+class AboutDialogExample {
// Create the application itself
- _init: function() {
- this.application = new Gtk.Application({
- application_id: 'org.example.jsaboutdialog',
- flags: Gio.ApplicationFlags.FLAGS_NONE
- });
+ constructor() {
+ 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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal creates the menu and builds the UI
- _onStartup: function() {
+ _onStartup() {
this._initMenus();
this._buildUI();
- },
+ }
// Build the application's UI
- _buildUI: function(){
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({ application: this.application,
window_position: Gtk.WindowPosition.CENTER,
@@ -42,10 +42,10 @@ const AboutDialogExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
+ }
// Create the application menu
- _initMenus: function() {
+ _initMenus() {
let menu = new Gio.Menu();
menu.append("About", 'app.about');
menu.append("Quit",'app.quit');
@@ -53,22 +53,16 @@ const AboutDialogExample = new Lang.Class({
// 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();
- }));
+ aboutAction.connect('activate', () => { 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();
- }));
+ quitAction.connect('activate', () => { this._window.destroy(); });
this.application.add_action(quitAction);
- },
+ }
- _showAbout: function() {
+ _showAbout() {
// String arrays of the names of the people involved in the project
var authors = ["GNOME Documentation Team"];
@@ -95,7 +89,7 @@ const AboutDialogExample = new Lang.Class({
aboutDialog.destroy();
});
}
-});
+};
// Run the application
let app = new AboutDialogExample();
diff --git a/platform-demos/C/samples/button.js b/platform-demos/C/samples/button.js
index f2ebb4b..4eaa31a 100644
--- a/platform-demos/C/samples/button.js
+++ b/platform-demos/C/samples/button.js
@@ -1,38 +1,38 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ButtonExample = new Lang.Class ({
- Name: 'Button Example',
+class ButtonExample {
/* Create the application itself
This boilerplate code is needed to build any GTK+ application. */
- _init: function () {
- this.application = new Gtk.Application ({
- application_id: 'org.example.jsbutton',
- 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));
- },
+ constructor() {
+ this.application = new Gtk.Application ({
+ application_id: 'org.example.jsbutton',
+ flags: Gio.ApplicationFlags.FLAGS_NONE
+ });
+
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
+ _onActivate() {
this._window.present ();
- },
+ }
// Callback function for 'startup' signal initializes menus and builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({ application: this.application,
@@ -46,17 +46,17 @@ const ButtonExample = new Lang.Class ({
this._window.add (this.Button);
// Bind it to a function that says what to do when the button is clicked
- this.Button.connect ("clicked", Lang.bind(this, this._clickHandler));
+ this.Button.connect ("clicked", this._clickHandler.bind(this));
// Show the window and all child widgets
this._window.show_all();
- },
+ }
// Here's the function that says what happens when the button is clicked
- _clickHandler: function () {
+ _clickHandler() {
this.Button.set_label ("Clicked!");
}
-});
+};
// Run the application
let app = new ButtonExample ();
diff --git a/platform-demos/C/samples/buttonbox.js b/platform-demos/C/samples/buttonbox.js
index b3499fb..263974e 100644
--- a/platform-demos/C/samples/buttonbox.js
+++ b/platform-demos/C/samples/buttonbox.js
@@ -1,33 +1,35 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const GObject = imports.gi.GObject;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ButtonBoxExample = new Lang.Class ({
- Name: 'ButtonBox Example',
+class ButtonBoxExample {
// Create the application itthis
- _init: function () {
- this.application = new Gtk.Application({ application_id: 'org.example.jsbuttonbox' });
+ constructor() {
+ this.application = new Gtk.Application({
+ application_id: 'org.example.jsbuttonbox'
+ });
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this.window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this.window = new Gtk.ApplicationWindow ({ application: this.application,
window_position: Gtk.WindowPosition.CENTER,
@@ -53,17 +55,17 @@ const ButtonBoxExample = new Lang.Class ({
this.buttons = [ 7, 8, 9, '/', 4, 5, 6, '*', 1, 2, 3, '-', 'C', 0, '=', '+' ];
// each row is a ButtonBox, attached to the grid
- for (i = 0; i < 4; i++) {
+ for (let i = 0; i < 4; i++) {
this.hbox = Gtk.ButtonBox.new(Gtk.Orientation.HORIZONTAL);
this.hbox.set_spacing(5);
this.grid.attach(this.hbox, 0, i + 1, 1, 1);
// each ButtonBox has 4 buttons, connected to the callback function
- for (j= 0; j < 4; j++) {
+ for (let j= 0; j < 4; j++) {
this.button = new Gtk.Button();
this.buttonLabel = (this.buttons[i * 4 + j].toString());
this.button.set_label(this.buttonLabel);
this.button.set_can_focus(false);
- this.button.connect("clicked", Lang.bind(this, this._buttonClicked, this.button));
+ this.button.connect("clicked", this._buttonClicked.bind(this));
this.hbox.add(this.button);
}
}
@@ -77,10 +79,10 @@ const ButtonBoxExample = new Lang.Class ({
// add the grid to the window
this.window.add(this.grid);
this.window.show_all();
- },
+ }
// callback function for all the buttons
- _buttonClicked: function(button) {
+ _buttonClicked(button) {
this.button = button;
// for the operations
if (this.button.get_label() == '+') {
@@ -145,9 +147,9 @@ const ButtonBoxExample = new Lang.Class ({
this.secondNumber = this.number;
this.entry.set_text(this.number.toString());
}
- },
+ }
- _doOperation: function() {
+ _doOperation() {
if (this.operation == "plus") {
this.firstNumber += this.secondNumber;
} else if (this.operation == "minus") {
@@ -173,7 +175,7 @@ const ButtonBoxExample = new Lang.Class ({
this.entry.set_text("error");
}
}
-});
+};
// Run the application
let app = new ButtonBoxExample();
diff --git a/platform-demos/C/samples/checkbutton.js b/platform-demos/C/samples/checkbutton.js
index 835e7d5..d17f0d9 100644
--- a/platform-demos/C/samples/checkbutton.js
+++ b/platform-demos/C/samples/checkbutton.js
@@ -1,38 +1,36 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const CheckButtonExample = new Lang.Class({
- Name: 'CheckButton Example',
+class CheckButtonExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jscheckbutton',
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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -51,15 +49,13 @@ const CheckButtonExample = new Lang.Class({
this._button.set_active (true);
// Connect the button to a function that does something when it's toggled
- this._button.connect ("toggled", Lang.bind (this, this._toggledCB));
+ this._button.connect ("toggled", this._toggledCB.bind(this));
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _toggledCB: function () {
+ _toggledCB() {
// Make the window title appear or disappear when the checkbox is toggled
if (this._button.get_active() == true)
@@ -69,7 +65,7 @@ const CheckButtonExample = new Lang.Class({
}
-});
+};
// Run the application
let app = new CheckButtonExample ();
diff --git a/platform-demos/C/samples/colorbutton.js b/platform-demos/C/samples/colorbutton.js
index fba64c9..36faf3c 100644
--- a/platform-demos/C/samples/colorbutton.js
+++ b/platform-demos/C/samples/colorbutton.js
@@ -1,34 +1,35 @@
#!/usr/bin/gjs
+imports.gi.versions.Gdk = '3.0';
+imports.gi.versions.Gtk = '3.0';
+
const Gdk = imports.gi.Gdk;
const GObject = imports.gi.GObject;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ColorbuttonExample = new Lang.Class ({
- Name: 'Colorbutton Example',
+class ColorbuttonExample {
// Create the application itself
- _init: function () {
+ constructor() {
this.application = new Gtk.Application ({ application_id: 'org.example.jscolorbutton' });
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this.window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this.window = new Gtk.ApplicationWindow ({ application: this.application,
@@ -45,7 +46,7 @@ const ColorbuttonExample = new Lang.Class ({
this.color.blue = 1.0;
this.color.alpha = 0.5;
this.button.set_rgba(this.color);
- this.button.connect("color-set", Lang.bind(this, this.onColorChosen));
+ this.button.connect("color-set", this.onColorChosen.bind(this));
this.label = new Gtk.Label();
this.label.set_text("Click to choose a color");
@@ -54,13 +55,13 @@ const ColorbuttonExample = new Lang.Class ({
grid.attach(this.label, 0, 1, 2, 1);
this.window.add(grid);
this.window.show_all();
- },
+ }
- onColorChosen: function() {
- let colorName = this.color.to_string();
- this.label.set_text("You chose the color " + colorName);
+ onColorChosen() {
+ let colorName = this.color.to_string();
+ this.label.set_text("You chose the color " + colorName);
}
-});
+};
// Run the application
let app = new ColorbuttonExample ();
diff --git a/platform-demos/C/samples/combobox.js b/platform-demos/C/samples/combobox.js
index 387e402..aa9fe6e 100644
--- a/platform-demos/C/samples/combobox.js
+++ b/platform-demos/C/samples/combobox.js
@@ -1,36 +1,34 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const GObject = imports.gi.GObject;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ComboBoxExample = new Lang.Class ({
- Name: 'ComboBox Example',
+class ComboBoxExample {
// Create the application itself
- _init: function () {
+ constructor() {
this.application = new Gtk.Application ({
application_id: 'org.example.jscombobox'});
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
+ _onActivate() {
this._window.present ();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({
@@ -81,18 +79,16 @@ const ComboBoxExample = new Lang.Class ({
this._comboBox.set_active (0);
// Connect the combobox's 'changed' signal to our callback function
- this._comboBox.connect ('changed', Lang.bind (this, this._onComboChanged));
+ this._comboBox.connect ('changed', this._onComboChanged.bind(this));
// Add the combobox to the window
this._window.add (this._comboBox);
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _onComboChanged: function () {
+ _onComboChanged() {
// The silly pseudohaiku that we'll use for our messagedialog
let haiku = ["",
@@ -113,23 +109,21 @@ const ComboBoxExample = new Lang.Class ({
text: haiku[activeItem]});
// Connect the OK button to a handler function
- this._popUp.connect ('response', Lang.bind (this, this._onDialogResponse));
+ this._popUp.connect ('response', this._onDialogResponse.bind(this));
// Show the messagedialog
this._popUp.show();
}
- },
-
-
+ }
- _onDialogResponse: function () {
+ _onDialogResponse() {
this._popUp.destroy ();
}
-});
+};
// Run the application
let app = new ComboBoxExample ();
diff --git a/platform-demos/C/samples/comboboxtext.js b/platform-demos/C/samples/comboboxtext.js
index 8a633f7..1f66124 100644
--- a/platform-demos/C/samples/comboboxtext.js
+++ b/platform-demos/C/samples/comboboxtext.js
@@ -1,35 +1,32 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ComboBoxTextExample = new Lang.Class ({
- Name: 'ComboBoxText Example',
+class ComboBoxTextExample {
// Create the application itself
- _init: function () {
+ constructor() {
this.application = new Gtk.Application ({
application_id: 'org.example.jscomboboxtext'});
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
+ _onActivate() {
this._window.present ();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({
@@ -49,18 +46,16 @@ const ComboBoxTextExample = new Lang.Class ({
this._comboBoxText.set_active (0);
// Connect the combobox's 'changed' signal to our callback function
- this._comboBoxText.connect ('changed', Lang.bind (this, this._onComboChanged));
+ this._comboBoxText.connect ('changed', this._onComboChanged.bind(this));
// Add the combobox to the window
this._window.add (this._comboBoxText);
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _onComboChanged: function () {
+ _onComboChanged() {
// The responses we'll use for our messagedialog
let responses = ["",
@@ -81,23 +76,21 @@ const ComboBoxTextExample = new Lang.Class ({
text: responses[activeItem]});
// Connect the OK button to a handler function
- this._popUp.connect ('response', Lang.bind (this, this._onDialogResponse));
+ this._popUp.connect ('response', this._onDialogResponse.bind(this));
// Show the messagedialog
this._popUp.show();
}
- },
-
-
+ }
- _onDialogResponse: function () {
+ _onDialogResponse() {
this._popUp.destroy ();
}
-});
+};
// Run the application
let app = new ComboBoxTextExample ();
diff --git a/platform-demos/C/samples/dialog.js b/platform-demos/C/samples/dialog.js
index 2867b23..4c1c65d 100644
--- a/platform-demos/C/samples/dialog.js
+++ b/platform-demos/C/samples/dialog.js
@@ -1,37 +1,37 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const DialogExample = new Lang.Class ({
- Name: 'Dialog Example',
+class DialogExample {
// Create the application itself
- _init: function () {
- this.application = new Gtk.Application ({
- application_id: 'org.example.jsdialog',
- 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));
- },
+ constructor() {
+ this.application = new Gtk.Application ({
+ application_id: 'org.example.jsdialog',
+ flags: Gio.ApplicationFlags.FLAGS_NONE
+ });
+
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({ application: this.application,
@@ -45,13 +45,13 @@ const DialogExample = new Lang.Class ({
this._window.add (this._button);
// Bind it to the function that creates the dialog
- this._button.connect ("clicked", Lang.bind(this, this._createDialog));
+ this._button.connect ("clicked", this._createDialog.bind(this));
// Show the window and all child widgets
this._window.show_all();
- },
+ }
- _createDialog: function () {
+ _createDialog() {
// Create the dialog
this._dialog = new Gtk.Dialog ({ transient_for: this._window,
@@ -69,18 +69,18 @@ const DialogExample = new Lang.Class ({
this._actionArea.add (this._OKButton);
// Connect the button to the function that handles what it does
- this._OKButton.connect ("clicked", Lang.bind (this, this._OKHandler));
+ this._OKButton.connect ("clicked", this._OKHandler.bind(this));
this._dialog.show_all();
- },
+ }
- _OKHandler: function (dialog, response_id) {
+ _OKHandler(dialog, response_id) {
// Destroy the dialog
this._dialog.destroy();
}
-});
+};
// Run the application
let app = new DialogExample ();
diff --git a/platform-demos/C/samples/entry.js b/platform-demos/C/samples/entry.js
index a4272dc..32efb0b 100644
--- a/platform-demos/C/samples/entry.js
+++ b/platform-demos/C/samples/entry.js
@@ -1,39 +1,37 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const EntryExample = new Lang.Class({
- Name: 'Entry Example',
+class EntryExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jsentry',
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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -49,15 +47,13 @@ const EntryExample = new Lang.Class({
this._window.add(this.entry);
// Connect the text entry box to a function that responds to what you type in
- this.entry.connect("activate", Lang.bind (this, this._hello));
+ this.entry.connect("activate", this._hello.bind(this));
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _hello: function() {
+ _hello() {
// Create a popup dialog to greet the person who types in their name
this._greeter = new Gtk.MessageDialog ({
@@ -72,14 +68,14 @@ const EntryExample = new Lang.Class({
this._greeter.show();
// Bind the OK button to the function that closes the popup
- this._greeter.connect ("response", Lang.bind(this, this._okClicked));
- },
+ this._greeter.connect ("response", this._okClicked.bind(this));
+ }
- _okClicked: function () {
+ _okClicked() {
this._greeter.destroy();
}
-});
+};
// Run the application
let app = new EntryExample ();
diff --git a/platform-demos/C/samples/fontchooserwidget.js b/platform-demos/C/samples/fontchooserwidget.js
index 60541a3..c510f31 100644
--- a/platform-demos/C/samples/fontchooserwidget.js
+++ b/platform-demos/C/samples/fontchooserwidget.js
@@ -1,32 +1,31 @@
//!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const FontChooserWidgetExample = new Lang.Class ({
- Name: 'Font Chooser Widget Example',
+class FontChooserWidgetExample {
// Create the application itthis
- _init: function () {
+ constructor() {
this.application = new Gtk.Application({ application_id: 'org.example.fontchooserwidget' });
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this.window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this.window = new Gtk.ApplicationWindow ({ application: this.application,
window_position: Gtk.WindowPosition.CENTER,
@@ -42,19 +41,19 @@ const FontChooserWidgetExample = new Lang.Class ({
this.fontChooser.set_preview_text("This is an example of preview text!");
// connect signal from the font chooser to the callback function
- this.fontChooser.connect("notify::font", Lang.bind(this, this._fontCb));
+ this.fontChooser.connect("notify::font", this._fontCb.bind(this));
// add the font chooser to the window
this.window.add(this.fontChooser);
this.window.show_all();
- },
+ }
// callback function:
- _fontCb: function() {
+ _fontCb() {
// print in the terminal
print("You chose the font " + this.fontChooser.get_font());
}
-});
+};
// Run the application
let app = new FontChooserWidgetExample();
diff --git a/platform-demos/C/samples/gmenu.js b/platform-demos/C/samples/gmenu.js
index 0f0dac7..41fb71e 100644
--- a/platform-demos/C/samples/gmenu.js
+++ b/platform-demos/C/samples/gmenu.js
@@ -1,27 +1,27 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const Application = new Lang.Class ({
- Name: 'Application',
+class Application {
//create the application
- _init: function () {
+ constructor() {
this.application = new Gtk.Application ({
application_id: 'org.example.myapp',
flags: Gio.ApplicationFlags.FLAGS_NONE
});
//connect to '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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
//create the UI (in this case it's just the ApplicationWindow
- _buildUI: function() {
+ _buildUI() {
this._window = new Gtk.ApplicationWindow ({ application: this.application,
window_position: Gtk.WindowPosition.CENTER,
title: "Welcome to GNOME" });
@@ -31,18 +31,18 @@ const Application = new Lang.Class ({
//show the window and all child widgets (none in this case)
this._window.show_all();
- },
+ }
- _showNew: function() {
- print ("This doesn't do anything. It is only a demonstration.");
- },
+ _showNew() {
+ print("This doesn't do anything. It is only a demonstration.");
+ }
- _showAbout: function() {
- print ("No AboutDialog here. This is only a demonstration.");
- },
+ _showAbout() {
+ print("No AboutDialog here. This is only a demonstration.");
+ }
//create the menu items and connect the signals to the callback functions.
- _initMenus: function() {
+ _initMenus() {
let menu = new Gio.Menu();
menu.append("New",'app.new');
menu.append("About", 'app.about');
@@ -50,39 +50,30 @@ const Application = new Lang.Class ({
this.application.set_app_menu(menu);
let newAction = new Gio.SimpleAction ({ name: 'new' });
- newAction.connect('activate', Lang.bind(this,
- function() {
- this._showNew();
- }));
+ newAction.connect('activate', () => { this._showNew(); });
this.application.add_action(newAction);
let aboutAction = new Gio.SimpleAction ({ name: 'about' });
- aboutAction.connect('activate', Lang.bind(this,
- function() {
- this._showAbout();
- }));
+ aboutAction.connect('activate', () => { this._showAbout(); });
this.application.add_action(aboutAction);
let quitAction = new Gio.SimpleAction ({ name: 'quit' });
- quitAction.connect('activate', Lang.bind(this,
- function() {
- this._window.destroy();
- }));
+ quitAction.connect('activate', () => { this._window.destroy(); });
this.application.add_action(quitAction);
- },
+ }
//callback function for 'activate' signal
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
//callback function for 'startup' signal
- _onStartup: function() {
+ _onStartup() {
//You must call _initMenus() before calling _buildUI().
this._initMenus();
this._buildUI();
}
-});
+};
//run the application
let app = new Application ();
diff --git a/platform-demos/C/samples/grid.js b/platform-demos/C/samples/grid.js
index 6e7ec05..d605164 100644
--- a/platform-demos/C/samples/grid.js
+++ b/platform-demos/C/samples/grid.js
@@ -1,41 +1,38 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const GridExample = new Lang.Class ({
- Name: 'Grid Example',
+class GridExample {
/* Create the application itself
This boilerplate code is needed to build any GTK+ application. */
- _init: function () {
- this.application = new Gtk.Application ({
- application_id: 'org.example.jsgrid',
- 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));
- },
+ constructor() {
+ this.application = new Gtk.Application ({
+ application_id: 'org.example.jsgrid',
+ flags: Gio.ApplicationFlags.FLAGS_NONE
+ });
+
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal initializes menus and builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
-
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({ application: this.application,
@@ -48,7 +45,7 @@ const GridExample = new Lang.Class ({
// Create the widgets inside the grid
this.progressBar = new Gtk.ProgressBar ();
this.Button = new Gtk.Button ({ label: "Button" });
- this.Button.connect ("clicked", Lang.bind(this, this._clickHandler));
+ this.Button.connect ("clicked", this._clickHandler.bind(this));
// Assemble the grid
this._window.add (this.Grid);
@@ -57,15 +54,15 @@ const GridExample = new Lang.Class ({
// Show the window and all child widgets
this._window.show_all();
- },
+ }
// Here's the function that says what happens when the button is clicked
- _clickHandler: function () {
+ _clickHandler() {
this.progressBar.pulse ();
}
-});
+};
// Run the application
let app = new GridExample ();
diff --git a/platform-demos/C/samples/hello-in-js/hello-world
b/platform-demos/C/samples/hello-in-js/hello-world
index 3041dd1..17aafac 100755
--- a/platform-demos/C/samples/hello-in-js/hello-world
+++ b/platform-demos/C/samples/hello-in-js/hello-world
@@ -1,41 +1,39 @@
#!/usr/bin/gjs
-const Lang = imports.lang;
+imports.gi.versions.Gtk = '3.0'
const Gtk = imports.gi.Gtk;
-const Application = new Lang.Class({
- //A Class requires an explicit Name parameter. This is the Class Name.
- Name: 'Application',
+class Application {
//create the application
- _init: function() {
+ constructor() {
this.application = new Gtk.Application();
//connect to 'activate' and 'startup' signals to handlers.
- this.application.connect('activate', Lang.bind(this, this._onActivate));
- this.application.connect('startup', Lang.bind(this, this._onStartup));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
//create the UI
- _buildUI: function() {
+ _buildUI() {
this._window = new Gtk.ApplicationWindow({ application: this.application,
title: "Hello World!" });
this._window.set_default_size(200, 200);
this.label = new Gtk.Label({ label: "Hello World" });
this._window.add(this.label);
- },
+ }
//handler for 'activate' signal
- _onActivate: function() {
+ _onActivate() {
//show the window and all child widgets
this._window.show_all();
- },
+ }
//handler for 'startup' signal
- _onStartup: function() {
+ _onStartup() {
this._buildUI();
}
-});
+};
//run the application
let app = new Application();
diff --git a/platform-demos/C/samples/hellognome.js b/platform-demos/C/samples/hellognome.js
index 396dca6..c7b55c8 100644
--- a/platform-demos/C/samples/hellognome.js
+++ b/platform-demos/C/samples/hellognome.js
@@ -1,34 +1,34 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
const Webkit = imports.gi.WebKit;
-const HelloGNOME = new Lang.Class ({
- Name: 'Hello GNOME',
+class HelloGNOME {
// Create the application itself
- _init: function () {
+ constructor() {
this.application = new Gtk.Application ();
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({
@@ -50,9 +50,9 @@ const HelloGNOME = new Lang.Class ({
// Show the window and all child widgets
this._window.show_all();
- },
+ }
-});
+};
// Run the application
let app = new HelloGNOME ();
diff --git a/platform-demos/C/samples/image.js b/platform-demos/C/samples/image.js
index 50be45b..26f7e54 100644
--- a/platform-demos/C/samples/image.js
+++ b/platform-demos/C/samples/image.js
@@ -1,59 +1,56 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-
-const ImageExample = new Lang.Class ({
- Name: 'Image Example',
-
- /* Create the application itself
- This boilerplate code is needed to build any GTK+ application. */
- _init: function () {
- this.application = new Gtk.Application ({
- application_id: 'org.example.jsimage',
- 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._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: "Welcome to GNOME",
- default_height: 300,
- default_width: 300 });
-
- // Create the label
- this.jsimage = new Gtk.Image ({file: "gnome-image.png"});
- this._window.add (this.jsimage);
-
- // Show the window and all child widgets
- this._window.show_all();
- }
-
-});
+class ImageExample {
+
+ /* Create the application itself
+ This boilerplate code is needed to build any GTK+ application. */
+ constructor() {
+ this.application = new Gtk.Application ({
+ application_id: 'org.example.jsimage',
+ flags: Gio.ApplicationFlags.FLAGS_NONE
+ });
+
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
+
+ // Callback function for 'activate' signal presents windows when active
+ _onActivate() {
+ this._window.present();
+ }
+
+ // Callback function for 'startup' signal initializes menus and builds the UI
+ _onStartup() {
+ this._buildUI();
+ }
+
+ // Build the application's UI
+ _buildUI() {
+
+ // Create the application window
+ this._window = new Gtk.ApplicationWindow({
+ application: this.application,
+ window_position: Gtk.WindowPosition.CENTER,
+ title: "Welcome to GNOME",
+ default_height: 300,
+ default_width: 300
+ });
+
+ // Create the label
+ this.jsimage = new Gtk.Image ({file: "gnome-image.png"});
+ this._window.add (this.jsimage);
+
+ // Show the window and all child widgets
+ this._window.show_all();
+ }
+};
// Run the application
let app = new ImageExample ();
diff --git a/platform-demos/C/samples/label.js b/platform-demos/C/samples/label.js
index b6959d7..324491f 100644
--- a/platform-demos/C/samples/label.js
+++ b/platform-demos/C/samples/label.js
@@ -1,59 +1,58 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const LabelExample = new Lang.Class ({
- Name: 'Label Example',
+class LabelExample {
/* Create the application itself
This boilerplate code is needed to build any GTK+ application. */
- _init: function () {
- this.application = new Gtk.Application ({
- application_id: 'org.example.jslabel',
- 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));
- },
+ constructor() {
+ this.application = new Gtk.Application ({
+ application_id: 'org.example.jslabel',
+ flags: Gio.ApplicationFlags.FLAGS_NONE
+ });
+
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal initializes menus and builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
-
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
- this._window = new Gtk.ApplicationWindow ({ application: this.application,
- window_position: Gtk.WindowPosition.CENTER,
- title: "Welcome to GNOME",
- default_height: 100,
- default_width: 200 });
+ this._window = new Gtk.ApplicationWindow({
+ application: this.application,
+ window_position: Gtk.WindowPosition.CENTER,
+ title: "Welcome to GNOME",
+ default_height: 100,
+ default_width: 200
+ });
// Create the label
- this.label = new Gtk.Label ({label: "Hello GNOME!"});
- this._window.add (this.label);
+ this.label = new Gtk.Label({ label: "Hello GNOME!" });
+ this._window.add(this.label);
- // Show the window and all child widgets
- this._window.show_all();
+ // Show the window and all child widgets
+ this._window.show_all();
}
-});
+};
// Run the application
let app = new LabelExample ();
diff --git a/platform-demos/C/samples/linkbutton.js b/platform-demos/C/samples/linkbutton.js
index eb21319..a384de8 100644
--- a/platform-demos/C/samples/linkbutton.js
+++ b/platform-demos/C/samples/linkbutton.js
@@ -1,37 +1,37 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const LinkButtonExample = new Lang.Class ({
- Name: 'LinkButton Example',
+class LinkButtonExample {
// Create the application itself
- _init: function () {
- this.application = new Gtk.Application ({
- application_id: 'org.example.jslinkbutton',
- flags: Gio.ApplicationFlags.FLAGS_NONE
+ constructor() {
+ this.application = new Gtk.Application({
+ application_id: 'org.example.jslinkbutton',
+ 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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal initializes menus and builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({ application: this.application,
@@ -47,8 +47,8 @@ const LinkButtonExample = new Lang.Class ({
// Show the window and all child widgets
this._window.show_all();
- },
-});
+ }
+};
// Run the application
let app = new LinkButtonExample ();
diff --git a/platform-demos/C/samples/menubutton.js b/platform-demos/C/samples/menubutton.js
index 699800d..41ca942 100644
--- a/platform-demos/C/samples/menubutton.js
+++ b/platform-demos/C/samples/menubutton.js
@@ -1,25 +1,27 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const Application = new Lang.Class ({
- Name: 'Application',
+class Application {
//create the application
- _init: function() {
- this.application = new Gtk.Application ({ application_id: 'org.example.myapp',
- flags: Gio.ApplicationFlags.FLAGS_NONE });
-
- //connect to '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));
- },
+ constructor() {
+ this.application = new Gtk.Application({
+ application_id: 'org.example.myapp',
+ flags: Gio.ApplicationFlags.FLAGS_NONE
+ });
+
+ //connect to 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
//create the UI (in this case it's just the ApplicationWindow)
- _buildUI: function() {
+ _buildUI() {
this._window = new Gtk.ApplicationWindow({ application: this.application,
window_position: Gtk.WindowPosition.CENTER,
title: "MenuButton Example" });
@@ -30,7 +32,7 @@ const Application = new Lang.Class ({
this._menuButton = new Gtk.MenuButton();
this.grid.attach(this._menuButton, 0, 0, 1, 1 );
- this.menu = new Gtk.Menu.new_from_model(this.menuModel);
+ this.menu = Gtk.Menu.new_from_model(this.menuModel);
this.menu.show();
this._menuButton.set_menu_model (this.menuModel);
@@ -38,37 +40,28 @@ const Application = new Lang.Class ({
this._menuButton.show();
this._window.show_all();
- },
+ }
- _showNew: function() {
- print("You clicked \"New\"");
- },
+ _showNew() {
+ print("You clicked \"New\"");
+ }
- _showAbout: function() {
+ _showAbout() {
print("You clicked \"About\"");
- },
+ }
//create the menu items and connect the signals to the callback functions.
- _initMenus: function() {
+ _initMenus() {
let newAction = new Gio.SimpleAction({ name: 'new' });
- newAction.connect('activate', Lang.bind(this,
- function() {
- this._showNew();
- }));
+ newAction.connect('activate', () => { this._showNew(); });
this.application.add_action(newAction);
let aboutAction = new Gio.SimpleAction({ name: 'about' });
- aboutAction.connect('activate', Lang.bind(this,
- function() {
- this._showAbout();
- }));
+ aboutAction.connect('activate', () => { this._showAbout(); });
this.application.add_action(aboutAction);
let quitAction = new Gio.SimpleAction({ name: 'quit' });
- quitAction.connect('activate', Lang.bind(this,
- function() {
- this._window.destroy();
- }));
+ quitAction.connect('activate', () => { this._window.destroy(); });
this.application.add_action(quitAction);
this.menuModel = new Gio.Menu();
@@ -86,20 +79,20 @@ const Application = new Lang.Class ({
this.menuItemQuit = Gio.MenuItem.new("Quit", 'app.quit');
this.subMenu.append_item(this.menuItemQuit);
this.menuModel.append_item(this.fileMenuItem);
- },
+ }
//callback function for 'activate' signal
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
//callback function for 'startup' signal
- _onStartup: function() {
+ _onStartup() {
//You must call _initMenus() before calling _buildUI().
this._initMenus();
this._buildUI();
}
-});
+};
//run the application
let app = new Application();
diff --git a/platform-demos/C/samples/messagedialog.js b/platform-demos/C/samples/messagedialog.js
index 8dc202c..f1a3fa4 100644
--- a/platform-demos/C/samples/messagedialog.js
+++ b/platform-demos/C/samples/messagedialog.js
@@ -1,60 +1,59 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const MessageDialogExample = new Lang.Class ({
- Name: 'MessageDialog Example',
+class MessageDialogExample {
// Create the application itself
- _init: function () {
- this.application = new Gtk.Application ({
+ constructor() {
+ this.application = new Gtk.Application({
application_id: 'org.example.jsmessagedialog',
- flags: Gio.ApplicationFlags.FLAGS_NONE });
+ 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal initializes menus and builds the UI
- _onStartup: function () {
+ _onStartup() {
this._initMenus();
this._buildUI ();
- },
-
-
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
- this._window = new Gtk.ApplicationWindow ({
+ this._window = new Gtk.ApplicationWindow({
application: this.application,
window_position: Gtk.WindowPosition.CENTER,
title: "Gtk.MessageDialog Example",
default_height: 200,
- default_width: 400 });
+ default_width: 400
+ });
// Create a silly warning message and add it to the window
- this.warningLabel = new Gtk.Label ({
- label: "This application goes boom! (Not really.)"});
+ this.warningLabel = new Gtk.Label({
+ label: "This application goes boom! (Not really.)"
+ });
this._window.add (this.warningLabel);
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
// Build the application menu, including the button that calls the dialog
- _initMenus: function() {
+ _initMenus() {
let menu = new Gio.Menu();
menu.append("Message",'app.message');
menu.append("Quit",'app.quit');
@@ -62,24 +61,16 @@ const MessageDialogExample = new Lang.Class ({
// 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();
- }));
+ messageAction.connect('activate', () => { 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();
- }));
+ quitAction.connect('activate', () => { this._window.destroy(); });
this.application.add_action(quitAction);
- },
-
-
+ }
- _showMessageDialog: function () {
+ _showMessageDialog() {
// Create a modal MessageDialog whose parent is the window
this._messageDialog = new Gtk.MessageDialog ({
@@ -89,14 +80,12 @@ const MessageDialogExample = new Lang.Class ({
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.connect ('response', this._response_cb.bind(this));
this._messageDialog.show();
- },
-
-
+ }
// Callback function (aka signal handler) for the response signal
- _response_cb: function (messagedialog, response_id) {
+ _response_cb(messagedialog, response_id) {
// A simple switch that changes the main window's label
switch (response_id) {
@@ -114,8 +103,7 @@ const MessageDialogExample = new Lang.Class ({
this._messageDialog.destroy();
}
-
-});
+};
// Run the application
let app = new MessageDialogExample ();
diff --git a/platform-demos/C/samples/paned.js b/platform-demos/C/samples/paned.js
index 3119ac9..fe82b3c 100644
--- a/platform-demos/C/samples/paned.js
+++ b/platform-demos/C/samples/paned.js
@@ -1,32 +1,31 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const PanedExample = new Lang.Class ({
- Name: 'Paned Example',
+class PanedExample {
// Create the application itself
- _init: function () {
+ constructor() {
this.application = new Gtk.Application({ application_id: 'org.example.panedexample' });
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this.window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this.window = new Gtk.ApplicationWindow ({ application: this.application,
window_position: Gtk.WindowPosition.CENTER,
@@ -54,7 +53,7 @@ const PanedExample = new Lang.Class ({
this.window.add(this.paned)
this.window.show_all();
}
-});
+};
// Run the application
let app = new PanedExample();
diff --git a/platform-demos/C/samples/progressbar.js b/platform-demos/C/samples/progressbar.js
index ef516b5..634509d 100644
--- a/platform-demos/C/samples/progressbar.js
+++ b/platform-demos/C/samples/progressbar.js
@@ -1,39 +1,37 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ProgressBarExample = new Lang.Class({
- Name: 'ProgressBar Example',
+class ProgressBarExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jsprogressbar',
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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({ application: this.application,
@@ -47,34 +45,34 @@ const ProgressBarExample = new Lang.Class({
this._window.add(this.progressBar);
// Start the function that pulses the bar every 100 milliseconds
- this.sourceID = GLib.timeout_add(GLib.PRIORITY_DEFAULT, 100, Lang.bind(this, this._barPulse));
+ this.sourceID = GLib.timeout_add(GLib.PRIORITY_DEFAULT, 100,
+ this._barPulse.bind(this));
// Connect a keypress event to the function that toggles the bar to start or stop pulsing
- this._window.connect("key-press-event", Lang.bind(this, this._onKeyPress));
+ this._window.connect("key-press-event", this._onKeyPress.bind(this));
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
// Pulse the progressbar (unless it has been disabled by a keypress)
- _barPulse: function() {
+ _barPulse() {
this.progressBar.pulse();
return true;
- },
+ }
// Start or stop the progressbar when a key is pressed
- _onKeyPress: function() {
+ _onKeyPress() {
if (this.sourceID == 0)
- this.sourceID = GLib.timeout_add(GLib.PRIORITY_DEFAULT, 100, Lang.bind(this, this._barPulse));
+ this.sourceID = GLib.timeout_add(GLib.PRIORITY_DEFAULT, 100,
+ this._barPulse.bind(this));
else {
GLib.source_remove(this.sourceID);
this.sourceID = 0;
}
}
-});
+};
// Run the application
let app = new ProgressBarExample ();
diff --git a/platform-demos/C/samples/radiobutton.js b/platform-demos/C/samples/radiobutton.js
index 7eaac00..25c2d00 100644
--- a/platform-demos/C/samples/radiobutton.js
+++ b/platform-demos/C/samples/radiobutton.js
@@ -1,38 +1,36 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const RadioButtonExample = new Lang.Class({
- Name: 'RadioButton Example',
+class RadioButtonExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jsradiobutton',
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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -68,7 +66,7 @@ const RadioButtonExample = new Lang.Class({
halign: Gtk.Align.END });
// Connect the button to the function which handles clicking it
- this._okButton.connect ('clicked', Lang.bind (this, this._okClicked));
+ this._okButton.connect ('clicked', this._okClicked.bind(this));
// Create a grid to put the "place" items in
this._places = new Gtk.Grid ();
@@ -105,11 +103,9 @@ const RadioButtonExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _okClicked: function () {
+ _okClicked() {
// Create a popup that shows a silly message
this._travel = new Gtk.MessageDialog ({
@@ -123,13 +119,11 @@ const RadioButtonExample = new Lang.Class({
this._travel.show();
// Bind the OK button to the function that closes the popup
- this._travel.connect ("response", Lang.bind (this, this._clearTravelPopUp));
-
- },
-
+ this._travel.connect ("response", this._clearTravelPopUp.bind(this));
+ }
- _messageText: function() {
+ _messageText() {
// Create a silly message for the popup depending on what you selected
var stringMessage = "";
@@ -170,18 +164,12 @@ const RadioButtonExample = new Lang.Class({
return stringMessage;
- },
-
-
-
-
- _clearTravelPopUp: function () {
+ }
+ _clearTravelPopUp() {
this._travel.destroy();
-
}
-
-});
+};
// Run the application
let app = new RadioButtonExample ();
diff --git a/platform-demos/C/samples/scale.js b/platform-demos/C/samples/scale.js
index b479f4e..ba4af1a 100644
--- a/platform-demos/C/samples/scale.js
+++ b/platform-demos/C/samples/scale.js
@@ -1,37 +1,35 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ScaleExample = new Lang.Class({
- Name: 'Scale Example',
+class ScaleExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jsscale'
});
- // 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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -72,8 +70,8 @@ const ScaleExample = new Lang.Class({
wrap: true});
// Connect the two scales to functions which recalculate the label
- this._hScale.connect ("value-changed", Lang.bind (this, this._recalc));
- this._vScale.connect ("value-changed", Lang.bind (this, this._recalc));
+ this._hScale.connect ("value-changed", this._recalc.bind(this));
+ this._vScale.connect ("value-changed", this._recalc.bind(this));
// Create a grid to arrange things in
this._UIGrid = new Gtk.Grid ({
@@ -92,11 +90,9 @@ const ScaleExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _recalc: function() {
+ _recalc() {
// Figure out what the product of the two scales' values is
var product = (this._hScale.get_value() * this._vScale.get_value());
@@ -118,10 +114,8 @@ const ScaleExample = new Lang.Class({
// Set ._label's new text
this._label.set_label (String (product) + " penguins on the iceberg. " + comment);
-
}
-
-});
+};
// Run the application
let app = new ScaleExample ();
diff --git a/platform-demos/C/samples/scrolledwindow.js b/platform-demos/C/samples/scrolledwindow.js
index b5968ae..cb0ad17 100644
--- a/platform-demos/C/samples/scrolledwindow.js
+++ b/platform-demos/C/samples/scrolledwindow.js
@@ -1,40 +1,44 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const GObject = imports.gi.GObject;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ScrolledWindowExample = new Lang.Class ({
- Name: 'ScrolledWindow Example',
+class ScrolledWindowExample {
// Create the application itself
- _init: function () {
- this.application = new Gtk.Application({ application_id: 'org.example.jscrolledwindow' });
+ constructor() {
+ this.application = new Gtk.Application({
+ application_id: 'org.example.jscrolledwindow'
+ });
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this.window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
- this.window = new Gtk.ApplicationWindow ({ application: this.application,
- window_position: Gtk.WindowPosition.CENTER,
- title: "ScrolledWindow Example",
- default_width: 200,
- default_height: 200,
- border_width: 10 });
+ this.window = new Gtk.ApplicationWindow({
+ application: this.application,
+ window_position: Gtk.WindowPosition.CENTER,
+ title: "ScrolledWindow Example",
+ default_width: 200,
+ default_height: 200,
+ border_width: 10
+ });
// the scrolledwindow
this.scrolledWindow = new Gtk.ScrolledWindow();
this.scrolledWindow.set_border_width(10);
@@ -51,7 +55,7 @@ const ScrolledWindowExample = new Lang.Class ({
this.window.add(this.scrolledWindow);
this.window.show_all();
}
-});
+};
// Run the application
let app = new ScrolledWindowExample();
diff --git a/platform-demos/C/samples/spinbutton.js b/platform-demos/C/samples/spinbutton.js
index 46c569e..910949f 100644
--- a/platform-demos/C/samples/spinbutton.js
+++ b/platform-demos/C/samples/spinbutton.js
@@ -1,37 +1,35 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const SpinButtonExample = new Lang.Class({
- Name: 'SpinButton Example',
+class SpinButtonExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jsspinbutton'
});
- // 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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -42,7 +40,7 @@ const SpinButtonExample = new Lang.Class({
// Create the first spinbutton using a function
this._kittens = Gtk.SpinButton.new_with_range (1, 9001, 1);
- this._kittens.connect ("value-changed", Lang.bind (this, this._newValue));
+ this._kittens.connect ("value-changed", this._newValue.bind(this));
// Create an adjustment to use for the second spinbutton
this._adjustment = new Gtk.Adjustment ({
@@ -54,7 +52,7 @@ const SpinButtonExample = new Lang.Class({
// Create the second spinbutton
this._tuna = new Gtk.SpinButton ({ adjustment: this._adjustment });
- this._tuna.connect ("value-changed", Lang.bind (this, this._newValue));
+ this._tuna.connect ("value-changed", this._newValue.bind(this));
// this._tuna.set_digits (1);
// this._tuna.set_wrap (true);
@@ -94,19 +92,14 @@ const SpinButtonExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
-
- _newValue: function () {
+ }
+ _newValue() {
// Update the label which shows how many cans there are per kitten
this.perKitten = Math.floor((this._tuna.get_value() / this._kittens.get_value()))
this._lastLabel.set_label ("That's " + this.perKitten + " can(s) of tuna per kitten.");
-
}
-
-});
+};
// Run the application
let app = new SpinButtonExample ();
diff --git a/platform-demos/C/samples/spinner.js b/platform-demos/C/samples/spinner.js
index affb6c1..be2abc2 100644
--- a/platform-demos/C/samples/spinner.js
+++ b/platform-demos/C/samples/spinner.js
@@ -1,67 +1,65 @@
#!/usr/bin/gjs
+imports.gi.versions.Gdk = '3.0';
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
const Gdk = imports.gi.Gdk;
-const Lang = imports.lang;
-const SpinnerExample = new Lang.Class ({
- Name: 'Spinner Example',
+class SpinnerExample {
// Create the application itself
- _init: function () {
- this.application = new Gtk.Application ({
+ constructor() {
+ this.application = new Gtk.Application({
application_id: 'org.example.jsspinner',
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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
- this._window = new Gtk.ApplicationWindow ({
+ this._window = new Gtk.ApplicationWindow({
application: this.application,
window_position: Gtk.WindowPosition.CENTER,
title: "Spinner Example",
default_height: 200,
default_width: 200,
- border_width: 30 });
+ border_width: 30
+ });
// Create a spinner which starts spinning automatically
this._spinner = new Gtk.Spinner ({active: true});
this._window.add (this._spinner);
// Connect a keypress event to the function that makes it start or stop spinning
- this._window.connect("key-press-event", Lang.bind(this, this._onKeyPress));
+ this._window.connect("key-press-event", this._onKeyPress.bind(this));
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _onKeyPress: function(widget, event) {
+ _onKeyPress(widget, event) {
// Get the value of the key that was pressed
- let keyval = event.get_keyval()[1];
+ let [, keyval] = event.get_keyval();
// If it was the spacebar, toggle the spinner to start or stop
if (keyval == Gdk.KEY_space) {
@@ -71,9 +69,7 @@ const SpinnerExample = new Lang.Class ({
this._spinner.start();
}
}
-
-
-});
+};
// Run the application
let app = new SpinnerExample ();
diff --git a/platform-demos/C/samples/statusbar.js b/platform-demos/C/samples/statusbar.js
index 4a0bdd7..ca795f5 100644
--- a/platform-demos/C/samples/statusbar.js
+++ b/platform-demos/C/samples/statusbar.js
@@ -1,38 +1,36 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const StatusbarExample = new Lang.Class({
- Name: 'Statusbar Example',
+class StatusbarExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jsstatusbar',
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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -49,19 +47,19 @@ const StatusbarExample = new Lang.Class({
// Create the main button
this._clickMe = new Gtk.Button ({
label: "Click Me!" });
- this._clickMe.connect ("clicked", Lang.bind (this, this._clicked));
+ this._clickMe.connect ("clicked", this._clicked.bind(this));
// Create the back button
this._backButton = new Gtk.Button ({
label: "gtk-go-back",
use_stock: true });
- this._backButton.connect ("clicked", Lang.bind (this, this._back));
+ this._backButton.connect ("clicked", this._back.bind(this));
// Create the clear button
this._clearButton = new Gtk.Button ({
label: "gtk-clear",
use_stock: true });
- this._clearButton.connect ("clicked", Lang.bind (this, this._clear));
+ this._clearButton.connect ("clicked", this._clear.bind(this));
// Put the buttons in a grid
this._grid = new Gtk.Grid ({
@@ -102,35 +100,27 @@ const StatusbarExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _clicked: function() {
+ _clicked() {
// Increment the number of clicks by 1
this.Clicks++;
// Update the statusbar with the new number of clicks
this._statusbar.push (this.ContextID, "Number of clicks: " + this.Clicks);
+ }
- },
-
-
-
- _back: function () {
+ _back() {
// If there have been any clicks, decrement by 1 and remove last statusbar update
if (this.Clicks > 0 ) {
this.Clicks--;
this._statusbar.pop (this.ContextID);
};
+ }
- },
-
-
-
- _clear: function () {
+ _clear() {
// Reset the number of clicks
this.Clicks = 0;
@@ -140,10 +130,8 @@ const StatusbarExample = new Lang.Class({
// Reset the statusbar's message
this._statusbar.push (this.ContextID, "Number of clicks: " + this.Clicks);
-
}
-
-});
+};
// Run the application
let app = new StatusbarExample ();
diff --git a/platform-demos/C/samples/switch.js b/platform-demos/C/samples/switch.js
index d27b42b..e182a69 100644
--- a/platform-demos/C/samples/switch.js
+++ b/platform-demos/C/samples/switch.js
@@ -1,38 +1,36 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const SwitchExample = new Lang.Class({
- Name: 'Switch Example',
+class SwitchExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jsswitch'
});
- // 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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal creates the menu and builds the UI
- _onStartup: function() {
+ _onStartup() {
this._initMenus();
- this._buildUI ();
- },
-
-
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -51,7 +49,7 @@ const SwitchExample = new Lang.Class({
// Create the first switch and set its default position
this._flySwitch = new Gtk.Switch ({active: false});
- this._flySwitch.connect ('notify::active', Lang.bind (this, this._switchFlip));
+ this._flySwitch.connect ('notify::active', this._switchFlip.bind(this));
// Create a label for the second switch
this._birdLabel = new Gtk.Label ({
@@ -60,7 +58,7 @@ const SwitchExample = new Lang.Class({
// Create the second switch
this._birdSwitch = new Gtk.Switch ({active: false});
- this._birdSwitch.connect ('notify::active', Lang.bind (this, this._switchFlip));
+ this._birdSwitch.connect ('notify::active', this._switchFlip.bind(this));
// Create a grid for the labels and switches beneath the picture
this._UIGrid = new Gtk.Grid ({
@@ -88,33 +86,27 @@ const SwitchExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _switchFlip: function() {
+ _switchFlip() {
// Change the picture depending on which switches are flipped
if (this._flySwitch.get_active()) {
- if (this._birdSwitch.get_active()) this._image.set_from_file ("muteswan.png");
-
- else this._image.set_from_file ("fruitbat.png");
- }
-
- else {
-
- if (this._birdSwitch.get_active()) this._image.set_from_file ("gentoopenguin.png");
-
- else this._image.set_from_file ("redfox.png");
+ if (this._birdSwitch.get_active())
+ this._image.set_from_file ("muteswan.png");
+ else
+ this._image.set_from_file ("fruitbat.png");
+ } else {
+ if (this._birdSwitch.get_active())
+ this._image.set_from_file ("gentoopenguin.png");
+ else
+ this._image.set_from_file ("redfox.png");
}
+ }
- },
-
-
-
- _initMenus: function() {
+ _initMenus() {
// Build the application's menu so we can have an "About" button
let menu = new Gio.Menu();
@@ -124,24 +116,16 @@ const SwitchExample = new Lang.Class({
// Bind the "About" button to the _showAbout() function
let aboutAction = new Gio.SimpleAction ({ name: 'about' });
- aboutAction.connect('activate', Lang.bind(this,
- function() {
- this._showAbout();
- }));
+ aboutAction.connect('activate', () => { this._showAbout(); });
this.application.add_action(aboutAction);
// Bind the "Quit" button to the function that closes the window
let quitAction = new Gio.SimpleAction ({ name: 'quit' });
- quitAction.connect('activate', Lang.bind(this,
- function() {
- this._window.destroy();
- }));
+ quitAction.connect('activate', () => { this._window.destroy(); });
this.application.add_action(quitAction);
- },
-
-
+ }
- _showAbout: function () {
+ _showAbout() {
// String arrays of the names of the people involved in the project
var artists = ['Rob Lee http://en.wikipedia.org/wiki/File:Fuzzy_Freddy.png', 'Ken Funakoshi
http://en.wikipedia.org/wiki/File:Pygoscelis_papua_-Nagasaki_Penguin_Aquarium_-swimming_underwater-8a.png',
'Shek Graham http://www.flickr.com/photos/shekgraham/127431519/in/photostream/', 'Mindaugas Urbonas
http://commons.wikimedia.org/wiki/File:Mute_Swan-Mindaugas_Urbonas.png'];
@@ -171,8 +155,7 @@ const SwitchExample = new Lang.Class({
aboutDialog.destroy();
});
}
-
-});
+};
// Run the application
let app = new SwitchExample ();
diff --git a/platform-demos/C/samples/textview.js b/platform-demos/C/samples/textview.js
index 3979890..ef059ea 100644
--- a/platform-demos/C/samples/textview.js
+++ b/platform-demos/C/samples/textview.js
@@ -1,35 +1,33 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const TextViewExample = new Lang.Class ({
- Name: 'TextView Example',
+class TextViewExample {
// Create the application itself
- _init: function () {
- this.application = new Gtk.Application ({
- application_id: 'org.example.jstextview' });
+ constructor() {
+ this.application = new Gtk.Application({
+ application_id: 'org.example.jstextview'
+ });
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function () {
- this._window.present ();
- },
+ _onActivate() {
+ this._window.present();
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow ({
@@ -79,7 +77,7 @@ const TextViewExample = new Lang.Class ({
halign: Gtk.Align.END,
margin_top: 20,
label: "Send" });
- this._send.connect ('clicked', Lang.bind (this, this._chat));
+ this._send.connect ('clicked', this._chat.bind(this));
// Create a grid that will have the other grid on top and the button on bottom
this._mainGrid = new Gtk.Grid ({
@@ -95,11 +93,9 @@ const TextViewExample = new Lang.Class ({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _chat: function () {
+ _chat() {
// Create a random number to determine what the penguin says
this.number = Math.floor ((Math.random() * 3) + 1);
@@ -144,10 +140,8 @@ const TextViewExample = new Lang.Class ({
// Give focus back to the textview so you don't have to click it again
this._textView.has_focus = true;
-
}
-
-});
+};
// Run the application
let app = new TextViewExample ();
diff --git a/platform-demos/C/samples/togglebutton.js b/platform-demos/C/samples/togglebutton.js
index 0fd7174..5f736c1 100644
--- a/platform-demos/C/samples/togglebutton.js
+++ b/platform-demos/C/samples/togglebutton.js
@@ -1,38 +1,36 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const ToggleButtonExample = new Lang.Class({
- Name: 'ToggleButton Example',
+class ToggleButtonExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jstogglebutton',
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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
@@ -48,7 +46,7 @@ const ToggleButtonExample = new Lang.Class({
// Create the togglebutton that starts and stops the spinner
this._toggleButton = new Gtk.ToggleButton ({label: "Start/Stop"});
- this._toggleButton.connect ('toggled', Lang.bind (this, this._onToggle));
+ this._toggleButton.connect ('toggled', this._onToggle.bind(this));
// Create a grid and put everything in it
this._grid = new Gtk.Grid ({
@@ -62,11 +60,9 @@ const ToggleButtonExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
+ }
- _onToggle: function() {
+ _onToggle() {
// Start or stop the spinner
if (this._toggleButton.get_active ())
@@ -74,8 +70,7 @@ const ToggleButtonExample = new Lang.Class({
else this._spinner.stop ();
}
-
-});
+};
// Run the application
let app = new ToggleButtonExample ();
diff --git a/platform-demos/C/samples/toolbar.js b/platform-demos/C/samples/toolbar.js
index 8a2d63b..2369ee0 100644
--- a/platform-demos/C/samples/toolbar.js
+++ b/platform-demos/C/samples/toolbar.js
@@ -1,33 +1,36 @@
#!/usr/bin/gjs
+imports.gi.versions.Gdk = '3.0';
+imports.gi.versions.Gtk = '3.0';
+
const Gdk = imports.gi.Gdk;
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-const Application = new Lang.Class({
- Name: 'Application',
+class Application {
//create the application
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.myapp',
flags: Gio.ApplicationFlags.FLAGS_NONE
});
//connect to '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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
//create the UI (in this case it's just the ApplicationWindow
- _buildUI: function() {
- this._window = new Gtk.ApplicationWindow({ application: this.application,
- window_position: Gtk.WindowPosition.CENTER,
- title: "Toolbar Example",
- default_height: 200,
- default_width: 400 });
+ _buildUI() {
+ this._window = new Gtk.ApplicationWindow({
+ application: this.application,
+ window_position: Gtk.WindowPosition.CENTER,
+ title: "Toolbar Example",
+ default_height: 200,
+ default_width: 400
+ });
this._grid = new Gtk.Grid();
this._window.add(this._grid);
@@ -40,21 +43,21 @@ const Application = new Lang.Class({
//show the toolbar and window
this._toolbar.show();
this._window.show();
- },
+ }
//callback function for 'activate' signal
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
//callback function for 'startup' signal
- _onStartup: function() {
+ _onStartup() {
this._initMenus();
this._buildUI();
- },
+ }
//create the toolbar, its toolbuttons and their actions
- _createToolbar: function() {
+ _createToolbar() {
this._toolbar = new Gtk.Toolbar();
this._toolbar.get_style_context().add_class(Gtk.STYLE_CLASS_PRIMARY_TOOLBAR);
@@ -63,13 +66,10 @@ const Application = new Lang.Class({
//Using actions allows you to add them to the app menu
//without duplicating code.
let newAction = new Gio.SimpleAction({ name: 'new'});
- newAction.connect('activate', Lang.bind(this,
- function() {
- this._newCB();
- }));
+ newAction.connect('activate', () => { this._newCB(); });
this.application.add_action(newAction);//note: this action is added to the app
- this._newButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_NEW);
+ this._newButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_NEW);
this._newButton.is_important = true;
this._toolbar.add(this._newButton);
this._newButton.show();
@@ -77,13 +77,10 @@ const Application = new Lang.Class({
//create the "Open" ToolButton and its SimpleAction
let openAction = new Gio.SimpleAction({ name: 'open'});
- openAction.connect('activate', Lang.bind(this,
- function() {
- this._openCB();
- }));
+ openAction.connect('activate', () => { this._openCB(); });
this.application.add_action(openAction);
- this._openButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_OPEN);
+ this._openButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_OPEN);
this._openButton.is_important = true;
this._toolbar.add(this._openButton);
this._openButton.show();
@@ -91,13 +88,10 @@ const Application = new Lang.Class({
//create the "Undo" ToolButton and its SimpleAction
let undoAction = new Gio.SimpleAction({ name: 'undo'});
- undoAction.connect('activate', Lang.bind (this,
- function() {
- this._undoCB();
- }));
+ undoAction.connect('activate', () => { this._undoCB(); });
this._window.add_action(undoAction);//note this action is added to the window
- this._undoButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_UNDO);
+ this._undoButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_UNDO);
this._undoButton.is_important = true;
this._toolbar.add(this._undoButton);
this._undoButton.show();
@@ -105,26 +99,25 @@ const Application = new Lang.Class({
//create the "Fullscreen" ToolButton and its SimpleAction
let fullscreenToggleAction = new Gio.SimpleAction ({ name: 'fullscreenToggle' });
- fullscreenToggleAction.connect ('activate', Lang.bind (this,
- function () {
- this._fullscreenToggleCB();
- }));
+ fullscreenToggleAction.connect('activate', () => {
+ this._fullscreenToggleCB();
+ });
this._window.add_action(fullscreenToggleAction);
- this._fullscreenButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_FULLSCREEN);
+ this._fullscreenButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_FULLSCREEN);
this._fullscreenButton.is_important = true;
this._toolbar.add(this._fullscreenButton);
this._fullscreenButton.show();
this._fullscreenButton.action_name = "win.fullscreenToggle";
//create the "leaveFullscreen" ToolButton, and set the action name to "win.fullscreenToggle"
- this._leaveFullscreenButton = new Gtk.ToolButton.new_from_stock(Gtk.STOCK_LEAVE_FULLSCREEN);
+ this._leaveFullscreenButton = Gtk.ToolButton.new_from_stock(Gtk.STOCK_LEAVE_FULLSCREEN);
this._leaveFullscreenButton.is_important = true;
this._toolbar.add(this._leaveFullscreenButton);
this._leaveFullscreenButton.action_name = "win.fullscreenToggle";
- },
+ }
- _initMenus: function () {
+ _initMenus() {
let menu = new Gio.Menu();
menu.append("New", 'app.new');
menu.append("Open", 'app.open');
@@ -133,38 +126,34 @@ const Application = new Lang.Class({
this.application.set_app_menu(menu);
let quitAction = new Gio.SimpleAction({name: 'quit' });
- quitAction.connect('activate', Lang.bind(this,
- function() {
- this._window.destroy();
- }));
+ quitAction.connect('activate', () => { this._window.destroy(); });
this.application.add_action(quitAction);
- },
+ }
- _newCB: function() {
+ _newCB() {
print("You clicked 'New'.");
- },
+ }
- _openCB: function() {
+ _openCB() {
print("You clicked 'Open'.");
- },
+ }
- _undoCB:function () {
+ _undoCB() {
print ("You clicked 'Undo'.");
- },
+ }
- _fullscreenToggleCB: function() {
+ _fullscreenToggleCB() {
if ((this._window.get_window().get_state() & Gdk.WindowState.FULLSCREEN) != 0 ) {
this._window.unfullscreen();
this._leaveFullscreenButton.hide();
this._fullscreenButton.show();
- }
- else {
+ } else {
this._window.fullscreen();
this._fullscreenButton.hide();
this._leaveFullscreenButton.show();
}
}
-});
+};
//run the application
let app = new Application();
diff --git a/platform-demos/C/samples/tooltip.js b/platform-demos/C/samples/tooltip.js
index ea8a114..f03c2ef 100644
--- a/platform-demos/C/samples/tooltip.js
+++ b/platform-demos/C/samples/tooltip.js
@@ -1,43 +1,47 @@
//!/usr/bin/gjs
+imports.gi.versions.Gdk = '3.0';
+imports.gi.versions.Gtk = '3.0';
+
const Gdk = imports.gi.Gdk;
const GLib = imports.gi.GLib;
const Gio = imports.gi.Gio;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-
-const TooltipExample = new Lang.Class ({
- Name: 'Tooltip Example',
+class TooltipExample {
// Create the application
- _init: function () {
- this.application = new Gtk.Application ({ application_id: 'org.example.jstooltip' });
+ constructor() {
+ this.application = new Gtk.Application({
+ application_id: 'org.example.jstooltip'
+ });
// 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));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents windows when active
- _onActivate: function() {
+ _onActivate() {
this.window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function () {
- this._buildUI ();
- },
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function () {
+ _buildUI() {
// Create the application window
- this.window = new Gtk.ApplicationWindow ({ application: this.application,
- window_position: Gtk.WindowPosition.CENTER,
- title: "Toolbar with Tooltips Example",
- default_width: 400,
- default_height: 200,
- border_width: 10 });
+ this.window = new Gtk.ApplicationWindow({
+ application: this.application,
+ window_position: Gtk.WindowPosition.CENTER,
+ title: "Toolbar with Tooltips Example",
+ default_width: 400,
+ default_height: 200,
+ border_width: 10
+ });
this.grid = new Gtk.Grid();
@@ -50,25 +54,26 @@ const TooltipExample = new Lang.Class ({
this.window.add(this.grid);
this._newAction = new Gio.SimpleAction({ name: "new" });
- this._newAction.connect("activate", Lang.bind(this, this._newCallback));
+ this._newAction.connect("activate", this._newCallback.bind(this));
this.window.add_action(this._newAction);
this._openAction = new Gio.SimpleAction({ name: "open" });
- this._openAction.connect("activate", Lang.bind(this, this._openCallback));
+ this._openAction.connect("activate", this._openCallback.bind(this));
this.window.add_action(this._openAction);
this._undoAction = new Gio.SimpleAction({ name: "undo" });
- this._undoAction.connect("activate", Lang.bind(this, this._undoCallback));
+ this._undoAction.connect("activate", this._undoCallback.bind(this));
this.window.add_action(this._undoAction);
this._fullScreenAction = new Gio.SimpleAction({ name: "fullscreenToggle" });
- this._fullScreenAction.connect("activate", Lang.bind(this, this._fullScreenCallback));
+ this._fullScreenAction.connect("activate",
+ this._fullScreenCallback.bind(this));
this.window.add_action(this._fullScreenAction);
this.window.show_all();
- },
+ }
- _createToolbar: function(){
+ _createToolbar() {
this.toolbar = new Gtk.Toolbar();
this.toolbar.get_style_context().add_class(Gtk.STYLE_CLASS_PRIMARY_TOOLBAR);
@@ -97,7 +102,7 @@ const TooltipExample = new Lang.Class ({
this.undoButton.set_property("has-tooltip", true);
// connect to the callback function that for the tooltip
// with the signal "query-tooltip"
- this.undoButton.connect("query-tooltip", Lang.bind(this, this._undoTooltipCallback));
+ this.undoButton.connect("query-tooltip", this._undoTooltipCallback.bind(this));
this.undoButton.set_is_important(true);
this.toolbar.insert(this.undoButton, 2);
this.undoButton.show();
@@ -110,31 +115,31 @@ const TooltipExample = new Lang.Class ({
this.fullscreenButton.set_action_name("win.fullscreenToggle");
return this.toolbar;
- },
+ }
- _newCallback: function(action, parameter) {
+ _newCallback(action, parameter) {
print("You clicked \"New\".");
- },
+ }
- _openCallback: function(action, parameter) {
+ _openCallback(action, parameter) {
print("You clicked \"Open\".");
- },
+ }
// the callback function for the tooltip of the "undo" button
- _undoTooltipCallback: function(widget, x, y, keyboard_mode, tooltip) {
+ _undoTooltipCallback(widget, x, y, keyboard_mode, tooltip) {
// set the text for the tooltip
tooltip.set_text("Undo your last action");
// set an icon fot the tooltip
tooltip.set_icon_from_stock(Gtk.STOCK_UNDO, Gtk.IconSize.MENU);
// show the tooltip
return true;
- },
+ }
- _undoCallback: function(action, parameter) {
+ _undoCallback(action, parameter) {
print("You clicked \"Undo\".");
- },
+ }
- _fullScreenCallback: function() {
+ _fullScreenCallback() {
if ((this.window.get_window().get_state() & Gdk.WindowState.FULLSCREEN) != 0 ){
this.fullscreenButton.set_stock_id(Gtk.STOCK_FULLSCREEN);
this.fullscreenButton.set_tooltip_text("Make your window fullscreen");
@@ -145,7 +150,7 @@ const TooltipExample = new Lang.Class ({
this.window.fullscreen();
}
}
-});
+};
// Run the application
let app = new TooltipExample ();
diff --git a/platform-demos/C/samples/treeview_simple_liststore.js
b/platform-demos/C/samples/treeview_simple_liststore.js
index 086b536..f89c1d7 100644
--- a/platform-demos/C/samples/treeview_simple_liststore.js
+++ b/platform-demos/C/samples/treeview_simple_liststore.js
@@ -1,39 +1,35 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const GObject = imports.gi.GObject;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
const Pango = imports.gi.Pango;
-const TreeViewExample = new Lang.Class({
- Name: 'TreeView Example with Simple ListStore',
-
+class TreeViewExample {
// Create the application itself
- _init: function() {
+ constructor() {
this.application = new Gtk.Application({
application_id: 'org.example.jstreeviewsimpleliststore'
});
- // 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));
- },
+ // Connect 'activate' and 'startup' signals to the callback functions
+ this.application.connect('activate', this._onActivate.bind(this));
+ this.application.connect('startup', this._onStartup.bind(this));
+ }
// Callback function for 'activate' signal presents window when active
- _onActivate: function() {
+ _onActivate() {
this._window.present();
- },
+ }
// Callback function for 'startup' signal builds the UI
- _onStartup: function() {
- this._buildUI ();
- },
-
-
+ _onStartup() {
+ this._buildUI();
+ }
// Build the application's UI
- _buildUI: function() {
-
+ _buildUI() {
// Create the application window
this._window = new Gtk.ApplicationWindow({
application: this.application,
@@ -112,7 +108,7 @@ const TreeViewExample = new Lang.Class({
this.selection = this._treeView.get_selection();
// When something new is selected, call _on_changed
- this.selection.connect ('changed', Lang.bind (this, this._onSelectionChanged));
+ this.selection.connect ('changed', this._onSelectionChanged.bind(this));
// Create a grid to organize everything in
this._grid = new Gtk.Grid;
@@ -126,12 +122,9 @@ const TreeViewExample = new Lang.Class({
// Show the window and all child widgets
this._window.show_all();
- },
-
-
-
- _onSelectionChanged: function () {
+ }
+ _onSelectionChanged() {
// Grab a treeiter pointing to the current selection
let [ isSelected, model, iter ] = this.selection.get_selected();
@@ -140,11 +133,10 @@ const TreeViewExample = new Lang.Class({
this._listStore.get_value (iter, 0) + " " +
this._listStore.get_value (iter, 1) + " " +
this._listStore.get_value (iter, 2) + "\n" +
- this._listStore.get_value (iter, 3));
-
+ this._listStore.get_value (iter, 3)
+ );
}
-
-});
+};
// Run the application
let app = new TreeViewExample ();
diff --git a/platform-demos/C/samples/window.js b/platform-demos/C/samples/window.js
index 874b244..6c1df45 100644
--- a/platform-demos/C/samples/window.js
+++ b/platform-demos/C/samples/window.js
@@ -1,41 +1,39 @@
#!/usr/bin/gjs
+imports.gi.versions.Gtk = '3.0';
+
const Gio = imports.gi.Gio;
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
-const Lang = imports.lang;
-
-const Application = new Lang.Class ({
- Name: 'Application',
+class Application {
//create the application
- _init: function () {
- this.application = new Gtk.Application ({
+ constructor() {
+ this.application = new Gtk.Application({
application_id: 'org.example.myapp',
flags: Gio.ApplicationFlags.FLAGS_NONE
});
- this.application.connect('activate', Lang.bind(this, this._onActivate));
- },
+ this.application.connect('activate', this._onActivate.bind(this));
+ }
//callback function for 'activate' signal
- _onActivate: function () {
-
- MyWindow = new Gtk.Window({type: Gtk.WindowType.TOPLEVEL});
- MyWindow.title = "Welcome to GNOME";
+ _onActivate() {
+ let myWindow = new Gtk.Window({type: Gtk.WindowType.TOPLEVEL});
+ myWindow.title = "Welcome to GNOME";
/* Here are a few ways we can customize our window.
Try uncommenting them or changing their values! */
- //MyWindow.set_default_size (400,200);
- //MyWindow.set_has_resize_grip (false);
- //MyWindow.set_opacity (0.5);
- //MyWindow.maximize ();
+ //myWindow.set_default_size (400,200);
+ //myWindow.set_has_resize_grip (false);
+ //myWindow.set_opacity (0.5);
+ //myWindow.maximize ();
//show the window and all child widgets (none in this case)
- MyWindow.show_all();
- this.application.add_window(MyWindow);
+ myWindow.show_all();
+ this.application.add_window(myWindow);
}
-});
+};
//run the application
let app = new Application ();
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]