path: root/gnome3.tex

% The GNOME3 Desktop and You
%
% FroSCon 2011
%
% (c) 2011 Guido Günther <agx@sigxcpu.org>
%
% CC BY-SA 3.0

\documentclass[compress]{beamer}
\mode<presentation>
{
  \usetheme{Warsaw}
  \setbeamertemplate{footline}{}
  \setbeamertemplate{headline}
                    {%
                      \begin{beamercolorbox}{section in head/foot}
                        \vskip2pt\insertnavigation{\paperwidth}\vskip2pt
                      \end{beamercolorbox}%
                    }
}
\usepackage[english]{babel}

\usepackage[utf8]{inputenc}

\usepackage{times}
\usepackage[T1]{fontenc} \title{The GNOME3 Desktop and You}
\usepackage{pifont}
\urlstyle{same}

\author[Guido Günther]
{
Guido Günther
{\it <agx@sigxcpu.org>}
}

%\institute[Debian]{Debian Developer}
\date[FrOSCon 2011]{FrOSCon 2011}

\begin{document}

\begin{frame}
  \titlepage
\end{frame}

\begin{frame}
  \frametitle{About myself}
  \begin{itemize}
  \item Freelancing Free Software Developer
  \item Debian Developer since 2000
  \item Contributions to GNOME/GTK+/GObject based apps since about 2008: krb5-auth-dialog, PPM, ModemManager, gtk-vnc, virt-manager
  \item I'm less an author but more a user of {\it GNOME} APIs.
  \end{itemize}
\end{frame}

\begin{frame}
  \frametitle{About this talk}
  \begin{itemize}
  \item Covers things I came across when working on the above projects in
  \item Tries to give an introduction so it's simpler to dive deeper into it GNOME development
%  \item Tries to build a bridge: there is lots of documentation but it's sometimes a bit hard to find
  \end{itemize}
\end{frame}

  % Focus of this talk:
\begin{frame}
\begin{block}{GNOME3}
\begin{itemize}
  \item GNOME is a desktop environment built on top of {\em GTK+/GLib/GObject}
  \\[2ex]
  \item GNOME's user interface is shaped by {\em GNOME Shell}
\end{itemize}
\end{block}
\end{frame}

\section{Introduction}
\begin{frame}\frametitle<presentation>{Overview}
  \tableofcontents
\end{frame}

\begin{frame}
  \frametitle{GTK+, GLib, GObject}
  \begin{itemize}
  \item GLib is a cross platform C library that provides:
    \begin{itemize}
    \item Data types: Lists, Hash Tables, Trees, Caches, Strings, ...
    \item Application Support: Threads, Loadable Modules, 
      Memory Management, ...
    \item Utilities: Timers, Checksums, Random Numbers, Parsers, 
      Testing framework, ...
    \item \alert<2>{gobject}: The GLib Object system
    \item gio: filesystem monitoring, async I/O, networking, DBus, \alert<2>{settings}, ...
    \end{itemize}
  \item GTK+3 is the widget toolkit
    \begin{itemize}
    \item \alert<2>{Based on GObject}
    \item Widgets, clipboard, key bindings, d'n'd, theming, ...
    \end{itemize}
  \item \alert<2>{Many other libraries are based on GObject}: libsoup, gtk-vnc, telepathy, ...
  \end{itemize}
\end{frame}

\begin{frame}
  \frametitle{GNOME Shell}
  \begin{itemize}
    % Create new workspaces, remove unused workspaces, tiling
    \item Workspace and window management
    \item Application life cycle
    \item \alert<2>{Notification system}
      % notifications can be turned off
      % notifications are resident by default 
      % persistent notifications are possible to replace tray icons
    \item Integrated IM
    \item \alert<2>{Can be extended in JavaScript}
    \item \href{http://programm.froscon.org/2011/events/681.html}{much more...} % see Hendrik Richter's talk
  \end{itemize}
\end{frame}
\section{GObject Introspection}
\begin{frame}
  \frametitle{What's a GObject}
  \begin{itemize}
  \item GLib has it's own \href{http://developer.gnome.org/gobject/unstable/gobject-Type-Information.html}
  {dynamic type system}:
    \begin{itemize}
    \item Non classed: {\it numbers}, {\it pointers}, ...
      \item Instantiable classed types: {\it objects}
        % GObject Base Class, single inheritance
      \item Non-instantiable classed types: {\it interfaces}
    \end{itemize}
    \pause
  \item GObject is the {\it base class} of GLib's type system
    \begin{itemize}

      \item provides: {\it signals}, {\it memory management}, {\it per-object properties}
        % Besides GNOME and GTK+
    \end{itemize}
  \item Written in C, very binding friendly
  \end{itemize}
\end{frame}

\begin{frame}
\frametitle{What is it?}
\includegraphics[width=10cm]{wo-gi.pdf}
\end{frame}

\begin{frame}
  \frametitle{What is it?}
  \begin{itemize}
  \item Layer to use GObject based libraries written in C from
    other languages like:
    \begin{itemize}
    \item JavaScript (\href{https://live.gnome.org/Gjs}{gjs},   % SpiderMonkey
                      \href{https://live.gnome.org/Seed}{seed}) % WebKit
                      % Seed is much better documented
    \item Python (\href{https://live.gnome.org/PyGObject}{PyGObject})
    \item ruby % not tried
    \item scheme % not tried
    \item \href{http://bergie.iki.fi/blog/php\_and\_gobject\_introspection/}{PHP} % not tried
    \item \href{https://live.gnome.org/GObjectIntrospection/Users}{and more}
    \end{itemize}
    \end{itemize}
  \begin{block}{GObject Introspection}
    \begin{itemize}
    \item Only one dynamic binding per language needed to use all GObject
    introspection enabled libraries.
    \item No outdated bindings!
    \end{itemize}
  \end{block}
\end{frame}

\begin{frame}
\frametitle{What is it?}
\includegraphics[width=10cm]{gi.pdf}
\end{frame}

\begin{frame}
  \frametitle{How does it work?}
  \begin{itemize}
    \item When writing the C library
        \begin{itemize}
            \item Add annotations to the libraries source code (reference
            counting, allocation)
        \end{itemize}
    \item C library build time
      \begin{itemize}
      % Annotations example in backup slides
      \item Scanner (g-ir-scanner) generates GIR (XML) from sources and built libraries
        \begin{itemize}
            \item Debian: *-dev packages in {\em /usr/share/gir-1.0/*.gir}
         \end{itemize}
      \item Compiler (g-ir-compiler) to compile GIR to typelib
        \begin{itemize}
            \item Debian: gir1.2-* packages in {\em /usr/lib/girepository-1.0/*.typelib}
         \end{itemize}
      \end{itemize}
    \item Runtime (e.g. gjs or Python+PyGObject)
      \begin{itemize}
      \item libgirepository to read the introspection data
      \item libffi to make library callable from other language
      \end{itemize}
  \end{itemize}
\end{frame}

\begin{frame}
\frametitle{What is it?}
\includegraphics[width=10cm]{gi-detail.pdf}
\end{frame}

\begin{frame}[fragile]
  \frametitle{How to use it from JavaScript?}
JavaScript VNC viewer\footnote{Example taken from
\href{http://git.gnome.org/browse/gtk-vnc/tree/examples/gvncviewer.js}{gtk-vnc/examples}}

  \begin{block}{gvncviewer.js - VNC in 10 lines}
    \begin{semiverbatim}
const Gtk = \alert<1>{imports.gi.Gtk;}
\uncover<3->{const Vnc = \alert<3>{imports.gi.GtkVnc};}

\alert<1>{Gtk.init}(0, null);
\uncover<2->{var win = \alert<2>{new Gtk.Window}(\{title: "GTK-VNC"\});}
\uncover<4->{var disp = \alert<4>{new Vnc.Display}();}

\uncover<4->{win.\alert<4>{add}(disp);}
\uncover<7->{win.\alert<7>{connect}('delete-event', Gtk.main_quit);}
\uncover<5->{disp.\alert<5>{open\_host}(''localhost'', ''5901'');}
\uncover<6->{win.\alert<6>{show\_all}();}
\alert<1>{Gtk.main}();
    \end{semiverbatim}
  \end{block}
\end{frame}

\begin{frame}[fragile]
  \frametitle{How to use it from Python?}
\begin{block}{gvncviewer.py - VNC in 9 lines}
\begin{verbatim}
from gi.repository import GtkVnc, Gtk

Gtk.init(None)
win = Gtk.Window(title="GTK-VNC with Python")
disp = GtkVnc.Display()

win.add(disp)
win.connect('delete-event', Gtk.main_quit)
disp.open_host("localhost", "5901")
win.show_all()
Gtk.main()
\end{verbatim}
\end{block}
\end{frame}

\begin{frame}[fragile]
  \frametitle{What do I need?}

  Programming language, dynamic bindings, typelib files
  \begin{block}{JavaScript example}
\begin{verbatim}
apt-get install gjs                \
                gir1.2-gtk-3.0     \
                gir1.2-gtk-vnc-2.0
\end{verbatim}
  \end{block}
  \begin{block}{Python example}
\begin{verbatim}
apt-get install python-gobject      \
                gir1.2-gtk-3.0      \
                gir1.2-gtk-vnc-2.0
\end{verbatim}
Note: no python-gtk-vnc, python-gtk2!
  \end{block}
\end{frame}

\begin{frame}[fragile]
    \frametitle{GObjects in JS, Python and C}
% See: https://live.gnome.org/Gjs/Mapping
% and examples/properties.js
\begin{itemize}
\item Constructors 
  % JS: Properties passed in as JS map
  % Python Properties passed in as keyword args
  % C: Property list terminated by NULL
\begin{verbatim}
var win = new Gtk.Window({title: "foo"}));
win = Gtk.Window(title="foo")
win = g_object_new (GTK_TYPE_WINDOW, 
                    "title", "foo", NULL);
\end{verbatim}
\item Signals
% JS: Every gjs object has a connect method 
\begin{verbatim}
win.connect("delete-event", callable);
win.connect("delete-event", callable);
g_signal_connect (win, "delete-event",
                  gcallback, NULL);
\end{verbatim}
\item Properties
% C can retrieve multiple properties
\begin{verbatim}
win["title"]; win.title
win.props.title
g_object_get (win, "title", &title, NULL);
\end{verbatim}
\end{itemize}
\end{frame}

\section{GSettings}
\begin{frame}
  \frametitle{What is it?}
  \begin{itemize}
    \item API to retrieve and store configuration settings
    \item Easy to bind to GObject properties to settings
    \item Change notification via signals
    \item Supports different backends
      \begin{itemize}
        \item DConf: store settings key based on disk
          % Faster login, faster application startup
          % Lockdown https://live.gnome.org/dconf/SystemAdministrators
        \item Memory
      \end{itemize}
  \item XML schema describes location and types of keys
    % compiled via glib-schema-compile for speed
  \item \href{http://www.burtonini.com/blog/computers/gsettings-override-2011-07-04-15-45}{Vendor overrides possible}
  \item Delay mode
  \item Complex types possible using GVariant
  \item obsoletes gconf, gconf-bridge
  \end{itemize}
\end{frame}

\begin{frame}[fragile]
  \frametitle{How to use it?}
\begin{block}{Shell example}
\begin{verbatim}
  gsettings get \
    org.gnome.system.proxy.http enabled  
  gsettings set \
    org.gnome.system.proxy.http enabled true
\end{verbatim}
\end{block}
\begin{block}{Python example} 
\begin{verbatim}
  python proxysettings.py
\end{verbatim}
\end{block}
  % Commands:
\begin{block}{GUI}
\begin{verbatim}
  dconf-editor
\end{verbatim}
\end{block}
\end{frame}

\begin{frame}[fragile]
  \frametitle{What do I need?}
\begin{block}{Example}
\begin{verbatim}
apt-get install libglib2.0-bin \
                dconf dconf-tools
\end{verbatim}
\end{block}
\end{frame}

\section{Notifications}
\begin{frame}
  \frametitle{What is it?}
  \begin{itemize}
    \item GNOME Shell's message tray displays and manages notifications to the user
    \item \href{http://blogs.gnome.org/marina/2011/01/07/notifications-with-character/}{Notifications}:
      \begin{itemize}
      \item Provide feedback to the user
      \item Displayed for a short period of time at the bottom of the screen
      \item By default {\it persistent}: saved until interacted with or application is opened
      \item Less distractive since no need to interact instantly
      \item Can be globally disabled
      \item {\it Resident} and {\it transient} notifications possible
        % resident: stay around forever
        % transient: don't stay around at all
      \end{itemize}
%    \item Get rid of inconsistent tray icons:
%      \begin{itemize}
%        \item Left click vs right click
%        \item How to unhide
%        \item Blinking and distracting
%        \item Can't be disabled globally
%      \end{itemize}
  \end{itemize}
\end{frame}


\begin{frame}[fragile]
  \frametitle{How to use it?}
\begin{block}{gvncviewer.notify.py}
\begin{semiverbatim}
from gi.repository import Notify
\pause
def notify(obj, v):
  n = Notify.Notification(
        summary="Connected to %(host)s" % v,
        body="Made VNC connection to "
             "server %(host)s at port"
             " %(port)s" % v)
  n.set_hint("resident", 
             GLib.Variant('b', True))
  n.show()\pause
...
disp.connect("vnc-connected", notify, 
             vncserver)
\end{semiverbatim}
\end{block}
\end{frame}

\begin{frame}[fragile]
  \frametitle{What do I need}
\begin{block}{Python example}
\begin{verbatim}
apt-get install gir1.2-notify-0.7
\end{verbatim}
\end{block}
\end{frame}

\section{Shell Extensions}
\begin{frame}
\frametitle{GNOME Shell}
\begin{itemize}
\item GNOME3 desktop shell written in C and JavaScript
\item Heavily uses Clutter
  % Library to build userinterfaces based on OpenGL: 
  % Stage, Actors
\item Extendable via JavaScript and GObject Introspection
\item Available Extensions: \url{https://live.gnome.org/GnomeShell/Extensions}
\item The shell has a built JavaScript inspector/debugger (ALT-F2 $\rightarrow$ lg)
% global.get_primary_monitor().x
\end{itemize}
\end{frame}


\begin{frame}[fragile]
\frametitle{How to use them?}
\begin{block}{Create new extension}
\begin{verbatim}
gnome-shell-extension-tool --create-extension
\end{verbatim}
\end{block}
\begin{block}{Example}
Example Launch\_Iceowl@sigxcpu.org/
\end{block}
% Grep for evolution
% js/ui/dateMenu.js

% Monkeypatch DateMenuButton
% create new _dateMenu
% readd it to the _centerBox

\end{frame}

% Looking at the source
% st: shell toolkit (widgets, tooltips, icons)
% Signals.addSignalMethods(MyObj.protoype) - make signal delivery work

\begin{frame}[fragile]
\frametitle{What do I need?}
\begin{block}{Example}
\begin{verbatim}
apt-get install -t experimental gnome-shell
\end{verbatim}
\end{block}
\begin{block}{Your own extension}
\begin{verbatim}
git clone git://git.gnome.org/gnome-shell.git
\end{verbatim}
\begin{itemize}
\item \href{http://git.gnome.org/browse/gjs/tree/doc/Style\_Guide.txt}{gjs style guide}
\item An idea about GObject Introspection (see above)
\end{itemize}
\end{block}
\end{frame}

%\section{Misceallanous}
% g-c-c
% Corba vs D-Bus panel plugins
% PolicyKit
% GDbus
%   What is it
%   How to use it
%   What do I need
%   Uses GVariant
%   Will be much simpler in 2.30 due to gdbus-codegen
% GObject in C Tutorial: http://developer.gnome.org/gobject/unstable/pt02.html

\section{The End}
\begin{frame}
  \frametitle{Porting to GTK+3, GDBus, GSettings, PyGObject}
  \begin{itemize}
    \item GNOME3 porting guide:
      \url{http://live.gnome.org/Gnome3PortingGuide}
    \item GTK+2 $\rightarrow$ GTK+3:
      \url{http://developer.gnome.org/gtk3/3.0/migrating.html}
    \item GConf $\rightarrow$ GSettings
      \url{http://developer.gnome.org/gio/stable/ch28.html}
    \item dbus-glib $\rightarrow$ GDBus
      \url{http://developer.gnome.org/gio/unstable/ch29.html}
    \item python-gtk $\rightarrow$ PyGObject:
      \url{http://git.gnome.org/browse/pygobject/tree/pygi-convert.sh}
  \end{itemize}
\end{frame}


\begin{frame}[fragile]
\frametitle{API documentation}
\begin{itemize}
\item API Documentation for PyGObject and gjs:
\begin{itemize}
  \item Look at the the C API documentation, it's well documented
  \item You can infer Python or JavaScript calls form there
\end{itemize}
\begin{block}{Example}
\begin{verbatim}
    gtk_widget_show_all(GtkWidget* widget);
    widget.show_all();
    widget.show_all()
\end{verbatim}
\end{block}
\item If in doubt consult the GIR file
\end{itemize}
\end{frame}

\begin{frame}[fragile]
\frametitle{API documentation}
\begin{itemize}
  \item Generating language specific docs from the introspection information is in the works:
    \begin{itemize}
      \item \url{http://www.j5live.com/2011/08/15/gobjects-in-berlin-the-search-for-more-documentation/}
      \item \url{https://live.gnome.org/GObjectIntrospection/Doctools}
   \end{itemize}
\end{itemize}
\begin{block}{Development with vim}
\begin{verbatim}
apt-get install vim-syntax-gtk \
                devhelp libgtk-3-doc 
\end{verbatim}
\end{block}
\begin{block}{.vimrc}
\begin{verbatim}
  autocmd Filetype c nmap <silent> <C-K>
       :! devhelp -s "<cword>" &<CR><CR>
\end{verbatim}
\end{block}
\end{frame}

\begin{frame}
  \frametitle{Thank you}
  \begin{itemize}
    {\Large

    \item Thanks!
    \item Questions?\\[8ex]
    }
    {\tiny
      \href{http://creativecommons.org/licenses/by-sa/3.0/}{CC BY-SA 3.0 ---
        Creative Commons Attribution-ShareAlike 3.0}}
  \end{itemize}
\end{frame}

\begin{frame}
  \frametitle{Changes in GTK+, GObject, GLib}
  % Enhancements in GTK+3 and GLib make GNOME3 a much better integrated platform
    \begin {itemize}
    \item \alert<3>{GObject Introspection} 
      \uncover<2->{$\rightarrow$ obsoletes writing language bindings 
        for each library and language}
    \item \alert<3>{GSettings}: Settings DB now included
      \uncover<2->{$\rightarrow$  obsoletes GConf}
    \item GDBus: API to access DBus now included
      \uncover<2->{$\rightarrow$ obsoletes dbus-glib}
    \\[4ex]
    \item GtkBuilder: UI XML now included
      \uncover<2->{$\rightarrow$ obsoletes libglade}
    \item GTK+3 uses Cairo \uncover<2->{$\rightarrow$ obsoletes GDK drawing API}
      % Cairo: 2D vector graphics library with many output targets 
      % (X11, Win32, image buffers, PS, PDF, SVG)
      % Takes over low level graphics rendering
    \item Multiple GDK backend support (Wayland, HTML5)
      % Multiple backends can be enabled, no recompile needed
    \item Themes use CSS
    \end{itemize}
\end{frame}

\begin{frame}[fragile]
\href{https://live.gnome.org/GObjectIntrospection/Annotations}{Annotations example}
{\tiny
\begin{verbatim}
/**
 * soup_message_body_append_take:
 * @body: a #SoupMessageBody
 * @data: (array length=length) (transfer full): data to append
 * @length: length of @data
 *
 * Appends @length bytes from @data to @body.
 *
 * This function is exactly equivalent to soup_message_body_apppend()
 * with %SOUP_MEMORY_TAKE as second argument; it exists mainly for
 * convenience and simplifying language bindings.
 *
 * Since: 2.32
 * Rename to: soup_message_body_append
 **/
void
soup_message_body_append_take (SoupMessageBody *body,
                               guchar *data, gsize length)
{
        soup_message_body_append(body, SOUP_MEMORY_TAKE, data, length);
}
\end{verbatim}}
\end{frame}
\end{document}

% vim:et:ts=4:sw=4:et:sts=4:ai:set list listchars=tab\:»·,trail\:·:

% LocalWords:  FIXME ModemManager gtk virt jhbuild PPM APIs async n'd
% LocalWords:  DBus theming libsoup GObject GLib gobject GConf API PS
% LocalWords:  GDBus GDK backends backend Wayland PDF SVG libglade UI
% LocalWords:  GtkBuilder GSettings JavaScript gir unhide app dconf
% LocalWords:  typelib GLib's html vnc gio GNOME's auth krb