Top Banner
Developing GNOME Apps in Javascript Felipe Borges <[email protected]>
25

Developing GNOME Apps in Javascript

Feb 08, 2016

Download

Documents

Felipe Borges

Developing GNOME Apps in
Javascript
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Developing GNOME Apps in Javascript

Developing GNOME Apps in JavascriptFelipe Borges

<[email protected]>

Page 2: Developing GNOME Apps in Javascript

I'm Felipe Borges!

Page 3: Developing GNOME Apps in Javascript

Why talk about Gjs?

Page 4: Developing GNOME Apps in Javascript

GNOME is....

Desktop environment Development platform

Page 5: Developing GNOME Apps in Javascript

GNOME Developer Platform

Page 6: Developing GNOME Apps in Javascript

Javascript is pretty cool!

Page 7: Developing GNOME Apps in Javascript

It has bad parts! Globals Unexpected behaviour No block scope

Page 8: Developing GNOME Apps in Javascript

But it also has good parts! Closures are central Functions are first-class objects Prototypal inheritance Is everywhere!

Page 9: Developing GNOME Apps in Javascript
Page 10: Developing GNOME Apps in Javascript

Gjs First released in 2008 Well maintained Main development language for

writing GNOME Apps

Page 11: Developing GNOME Apps in Javascript

GNOME Apps in JS

Documents Shell Polari

Page 12: Developing GNOME Apps in Javascript

gjs-console

Page 13: Developing GNOME Apps in Javascript

Get started

Gjs and Gtk Actions and signals Run your application

Page 14: Developing GNOME Apps in Javascript

const Lang = imports.lang;const Gtk = imports.gi.Gtk;

const App = new Lang.Class({ Name: 'App', Extends: Gtk.Application, _init: function () { this.parent({ application_id: 'org.example.App' }); this.connect('activate', Lang.bind(this, this._onActivate)); this.connect('startup', Lang.bind(this, this._onStartup)); },

Page 15: Developing GNOME Apps in Javascript

_onActivate: function () { this._window.show_all(); }, _onStartup: function () { this._window = new Gtk.ApplicationWindow({ application: this, title: "Hello World!" });

this._window.set_default_size(200, 200); let label = new Gtk.Label({ label: "Hello World" }); this._window.add(label); }});

Page 16: Developing GNOME Apps in Javascript

Run your application

let app = new App();app.run(ARGV);

$ gjs helloWorld.js

Page 17: Developing GNOME Apps in Javascript

What about a Web Browser?

Toolbar and buttons WebView Actions and signals Run your application

Page 18: Developing GNOME Apps in Javascript

Build system

.desktop.in autogen.sh Makefile.am configure.ac

Page 19: Developing GNOME Apps in Javascript

The .desktop.in file[Desktop Entry]Version=1.0Encoding=UTF-8Name=Hello WorldComment=Say HelloExec=@prefix@/bin/hello-worldIcon=application-default-iconTerminal=falseType=ApplicationStartupNotify=trueCategories=GNOME;GTK;Utility;

Page 20: Developing GNOME Apps in Javascript

autogen.sh#!/bin/shset -etest -n "$srcdir" || srcdir=`dirname "$0"`test -n "$srcdir" || srcdir=.olddir=`pwd`cd "$srcdir"# This will run autoconf, automake, etc. for usautoreconf --force --installcd "$olddir"if test -z "$NOCONFIGURE"; then "$srcdir"/configure "$@"fi

Page 21: Developing GNOME Apps in Javascript

Makefile.am# The actual runnable program is set to the SCRIPTS primitive.# # Prefix bin_ tells where to copy thisbin_SCRIPTS = hello-world# # List of files to be distributedEXTRA_DIST = \

$(bin_SCRIPTS)## # The desktop filesdesktopdir = $(datadir)/applicationsdesktop_DATA = \

hello-world.desktop

Page 22: Developing GNOME Apps in Javascript

configure.ac# This file is processed by autoconf to create a configure scriptAC_INIT([Hello World], 1.0)AM_INIT_AUTOMAKE([1.10 no-define foreign dist-xz no-dist-gzip])AC_CONFIG_FILES([Makefile hello-world.desktop])AC_OUTPUT

Page 23: Developing GNOME Apps in Javascript

http://developer.gnome.org/

Page 24: Developing GNOME Apps in Javascript

Become a Friend of GNOME

Individual donation program Donations support the

GNOME project http://gnome.org/friends

Page 25: Developing GNOME Apps in Javascript

Developing GNOME Apps in JavascriptFelipe Borges

<[email protected]>