Merge lp:~tintou/granite/alertview into lp:~elementary-pantheon/granite/granite

[Corentin Noël]

New AlertView widget

New AlertView widget

[Danielle Foré (danrabbit)]

Looks solid here :)

review: Approve (ux)

[Cameron Norman (cameronnemo)]

One tiny documentation grammar issue, I commented inline.

review: Needs Fixing (docs)

[lp:~tintou/granite/alertview]

860. By Corentin Noël on 2015-06-08

[Documentation] fixed grammar.

[Corentin Noël (tintou)]

I fixed the grammar issue

[Cameron Norman (cameronnemo)]

I tested and looked over the code and it looks good here.

review: Approve

=== modified file 'demo/GraniteDemo.vala'
--- demo/GraniteDemo.vala	2015-05-15 09:08:34 +0000
+++ demo/GraniteDemo.vala	2015-06-08 15:07:04 +0000
@@ -79,6 +79,7 @@
         create_sourcelist ();
         create_modebutton ();
         create_dynamictab ();
+        create_alert ();
 
         window.add (main_stack);
         window.set_default_size (800, 550);
@@ -113,6 +114,7 @@
         welcome.append ("tag-new", "SourceList", "A widget that can display a list of items organized in categories.");
         welcome.append ("object-inverse", "ModeButton", "This widget is a multiple option modal switch");
         welcome.append ("document-open", "DynamicNotebook", "Tab bar widget designed for a variable number of tabs.");
+        welcome.append ("dialog-warning", "AlertView", "A View showing that an action is required to function.");
         welcome.activated.connect ((index) => {
             switch (index) {
                 case 0:
@@ -131,6 +133,10 @@
                     home_button.show ();
                     main_stack.set_visible_child_name ("dynamictab");
                     break;
+                case 4:
+                    home_button.show ();
+                    main_stack.set_visible_child_name ("alert");
+                    break;
             }
         });
         main_stack.add_named (welcome, "welcome");
@@ -215,6 +221,13 @@
         main_stack.add_named (grid, "modebutton");
     }
 
+    private void create_alert () {
+        var alert = new Granite.Widgets.AlertView ("Nothing here", "Maybe you can enable <b>something</b> to hide it but <i>otherwise</i> it will stay here", "dialog-warning");
+        main_stack.add_named (alert, "alert");
+        alert.show_action ("Hide this button");
+        alert.action_activated.connect (() => {alert.hide_action ();});
+    }
+
     int i;
     private void create_dynamictab () {
         var notebook = new Granite.Widgets.DynamicNotebook ();

=== added file 'doc/images/AlertView.png'
Binary files doc/images/AlertView.png	1970-01-01 00:00:00 +0000 and doc/images/AlertView.png	2015-06-08 15:07:04 +0000 differ
=== modified file 'lib/CMakeLists.txt'
--- lib/CMakeLists.txt	2015-03-25 22:30:35 +0000
+++ lib/CMakeLists.txt	2015-06-08 15:07:04 +0000
@@ -19,6 +19,7 @@
     Services/ContractorProxy.vala
     Services/IconFactory.vala
     Services/SimpleCommand.vala
+    Widgets/AlertView.vala
     Widgets/Utils.vala
     Widgets/WrapLabel.vala
     Widgets/AboutDialog.vala

=== added file 'lib/Widgets/AlertView.vala'
--- lib/Widgets/AlertView.vala	1970-01-01 00:00:00 +0000
+++ lib/Widgets/AlertView.vala	2015-06-08 15:07:04 +0000
@@ -0,0 +1,157 @@
+/*
+ *  Copyright (C) 2012-2015 Granite Developers (https://launchpad.net/granite)
+ *
+ *  This program or library is free software; you can redistribute it
+ *  and/or modify it under the terms of the GNU Lesser General Public
+ *  License as published by the Free Software Foundation; either
+ *  version 3 of the License, or (at your option) any later version.
+ *
+ *  This library is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ *  Lesser General Public License for more details.
+ *
+ *  You should have received a copy of the GNU Lesser General
+ *  Public License along with this library; if not, write to the
+ *  Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
+ *  Boston, MA 02110-1301 USA.
+ *
+ *  Authored by: Corentin Noël <[e-mail]>
+ */
+
+/**
+ * The AlertView widget shows to the user that some actions are now restricted.
+ *
+ * It can be used to show an empty view or hiding a panel when this one is disabled.
+ *
+ * {{../../doc/images/AlertView.png}}
+ */
+public class Granite.Widgets.AlertView : Gtk.Grid {
+    public signal void action_activated ();
+
+    /**
+     * The first line of text, should be short and not contain markup.
+     */
+    public string title {
+        get {
+            return title_label.label;
+        }
+        set {
+            title_label.label = value;
+        }
+    }
+
+    /**
+     * The second line of text, explaining why this alert is shown.
+     * You may need to escape it with #escape_text or #printf_escaped
+     */
+    public string description {
+        get {
+            return description_label.label;
+        }
+        set {
+            description_label.label = value;
+        }
+    }
+
+    /**
+     * The icon name
+     */
+    public string icon_name {
+        owned get {
+            return image.icon_name;
+        }
+        set {
+            image.set_from_icon_name (value, Gtk.IconSize.DIALOG);
+        }
+    }
+
+    private Gtk.Label title_label;
+    private Gtk.Label description_label;
+    private Gtk.Image image;
+    private Gtk.Button action_button;
+    private Gtk.Revealer action_revealer;
+
+    /**
+     * Makes new AlertView
+     *
+     * @param title the first line of text
+     * @param description the second line of text
+     * @param icon_name the icon to be shown
+     */
+    public AlertView (string title, string description, string icon_name) {
+        Object (title: title, description: description, icon_name: icon_name);
+    }
+
+    construct {
+        get_style_context ().add_class (Gtk.STYLE_CLASS_VIEW);
+        row_spacing = 12;
+        column_spacing = 12;
+
+        title_label = new Gtk.Label (null);
+        title_label.hexpand = true;
+        title_label.get_style_context ().add_class ("h2");
+        title_label.halign = Gtk.Align.START;
+        title_label.valign = Gtk.Align.START;
+
+        description_label = new Gtk.Label (null);
+        description_label.hexpand = true;
+        description_label.wrap = true;
+        description_label.justify = Gtk.Justification.FILL;
+        description_label.use_markup = true;
+        description_label.halign = Gtk.Align.START;
+        description_label.valign = Gtk.Align.START;
+
+        action_button = new Gtk.Button ();
+        action_button.margin_top = 12;
+
+        action_revealer = new Gtk.Revealer ();
+        action_revealer.add (action_button);
+        action_revealer.halign = Gtk.Align.END;
+        action_revealer.transition_type = Gtk.RevealerTransitionType.SLIDE_UP;
+
+        image = new Gtk.Image ();
+        var image_box = new Gtk.EventBox ();
+        image_box.halign = Gtk.Align.END;
+        image_box.add (image);
+
+        attach (image_box, 1, 1, 1, 2);
+        attach (title_label, 2, 1, 1, 1);
+        attach (description_label, 2, 2, 1, 1);
+        attach (action_revealer, 2, 3, 1, 1);
+
+        // Needed to center the text and image in the window.
+        var left_grid = new Gtk.Grid ();
+        left_grid.expand = true;
+        attach (left_grid, 0, 0, 1, 1);
+
+        var right_grid = new Gtk.Grid ();
+        right_grid.expand = true;
+        attach (right_grid, 3, 4, 1, 1);
+
+        action_button.clicked.connect (() => {action_activated ();});
+    }
+
+    /**
+     * Creates the action button with the given label
+     *
+     * @param label the text of the action button
+     */
+    public void show_action (string? label = null) {
+        if (label != null)
+            action_button.label = label;
+
+        if (action_button.label == null)
+            return;
+
+        action_revealer.set_reveal_child (true);
+        action_revealer.show_all ();
+    }
+
+    /**
+     * Hides the action button.
+     */
+    public void hide_action () {
+        action_revealer.set_reveal_child (false);
+    }
+}