Handle errors pages for failed loads and crashes (#2)

Strings are the same as in the old code, logic becomes a little simpler by way of using WebKit URI schemes and resources.

![screenshot from 2018-07-25 16-34-07](https://user-images.githubusercontent.com/1204189/43207589-a751814c-9028-11e8-94b1-ebd1ed409204.png)

6 files changed, 338 insertions, 0 deletions

diff --git a/core/app.vala b/core/app.vala
index 188a6f55..a23ced7e 100644
--- a/core/app.vala
+++ b/core/app.vala
@@ -40,6 +40,32 @@ namespace Midori {
             Gtk.Window.set_default_icon_name (Config.PROJECT_NAME);
 
             var context = WebKit.WebContext.get_default ();
+            context.register_uri_scheme ("stock", (request) => {
+                string icon_name = request.get_path ().substring (1, -1);
+                int icon_size = 48;
+                Gtk.icon_size_lookup ((Gtk.IconSize)Gtk.IconSize.DIALOG, out icon_size, null);
+                try {
+                    var icon = Gtk.IconTheme.get_default ().load_icon (icon_name, icon_size, Gtk.IconLookupFlags.FORCE_SYMBOLIC);
+                    var output = new MemoryOutputStream (null, realloc, free);
+                    icon.save_to_stream (output, "png");
+                    output.close ();
+                    uint8[] data = output.steal_data ();
+                    data.length = (int)output.get_data_size ();
+                    var stream = new MemoryInputStream.from_data (data, free);
+                    request.finish (stream, -1, null);
+                } catch (Error error) {
+                    critical ("Failed to load icon %s: %s", icon_name, error.message);
+                }
+            });
+            context.register_uri_scheme ("res", (request) => {
+                try {
+                    var stream = resources_open_stream (request.get_path (),
+                                                        ResourceLookupFlags.NONE);
+                    request.finish (stream, -1, null);
+                } catch (Error error) {
+                    critical ("Failed to load resource %s: %s", request.get_uri (), error.message);
+                }
+            });
             string config = Path.build_path (Path.DIR_SEPARATOR_S,
                 Environment.get_user_config_dir (), Environment.get_prgname ());
             DirUtils.create_with_parents (config, 0700);
diff --git a/core/tab.vala b/core/tab.vala
index 7d19655e..3a177711 100644
--- a/core/tab.vala
+++ b/core/tab.vala
@@ -114,6 +114,56 @@ namespace Midori {
             }
         }
 
+        public override bool web_process_crashed () {
+            return display_error ("face-sad", _("Oops - %s").printf (uri), _("Something went wrong with '%s'.").printf (uri));
+        }
+
+        public override bool load_failed (WebKit.LoadEvent load_event, string uri, Error load_error) {
+            var monitor = NetworkMonitor.get_default ();
+            string hostname = new Soup.URI (uri).host;
+            string? title = null;
+            string? message = null;
+            if (!monitor.network_available) {
+                title = _("You are not connected to a network");
+                message = _("Your computer must be connected to a network to reach “%s”. " +
+                            "Connect to a wireless access point or attach a network cable and try again.").printf (hostname);
+            } else {
+                try {
+                    monitor.can_reach (NetworkAddress.parse_uri (Config.PROJECT_WEBSITE, 80));
+                    title = _("Midori can't find the page you're looking for");
+                    message = _("The page located at “%s” cannot be found. " +
+                                "Check the web address for misspelled words and try again.").printf (hostname);
+                } catch (Error error) {
+                    title = _("You are not connected to the Internet");
+                    message = _("Your computer appears to be connected to a network, but can't reach “%s”. " +
+                                "Check your network settings and try again.").printf (hostname);
+                }
+            }
+            display_uri = uri;
+            return display_error ("network-error", title, message, load_error.message);
+        }
+
+        bool display_error (string icon_name, string title, string message, string? description=null) {
+            try {
+                string stylesheet = (string)resources_lookup_data ("/data/about.css",
+                                                                    ResourceLookupFlags.NONE).get_data ();
+                string html = ((string)resources_lookup_data ("/data/error.html",
+                                                             ResourceLookupFlags.NONE).get_data ())
+                    .replace ("{stylesheet}", stylesheet)
+                    .replace ("{icon}", icon_name)
+                    .replace ("{title}", title)
+                    .replace ("{message}", message)
+                    .replace ("{description}", description ?? "")
+                    .replace ("{tryagain}", _("Try Again"))
+                    .replace ("{uri}", display_uri);
+                load_alternate_html (html, display_uri, display_uri);
+                return true;
+            } catch (Error error) {
+                critical ("Failed to display error: %s", error.message);
+            }
+            return false;
+        }
+
         public override void mouse_target_changed (WebKit.HitTestResult result, uint modifiers) {
             link_uri = result.link_uri;
         }
diff --git a/data/about.css b/data/about.css
new file mode 100644
index 00000000..a346ef09
--- /dev/null
+++ b/data/about.css
@@ -0,0 +1,73 @@
+/*
+ Copyright (C) 2018 Christian Dywan <christian@twotoats.de>
+
+ This 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 2.1 of the License, or (at your option) any later version.
+
+ See the file COPYING for the full license text.
+ */
+
+body {
+    background-color: #dedede;
+    background-image: url(res:///data/logo-shade.svg);
+    background-repeat: no-repeat;
+    background-position: 90% 90%;
+    color: #222222;
+    font-family: -webkit-system-font, sans-serif;
+    font-size: 14pt;
+}
+
+#columns {
+    margin: 10% auto;
+}
+
+#icon {
+    display: inline-block;
+    vertical-align: top;
+    text-align: right;
+    width: 20%;
+    margin-right: 5%;
+}
+
+#main {
+    display: inline-block;
+    vertical-align: top;
+    width: 60%;
+    margin-left: 1%;
+}
+
+h1 {
+    font-size: 24pt;
+    font-weight: bold;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    margin: 0;
+    padding: 0;
+}
+
+button span {
+    vertical-align: middle;
+    padding: 2pt 1pt;
+}
+
+.message {
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.description {
+    font-size: 1em;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.action {
+    margin-top: 5%;
+}
+
+button {
+    font-size: 14pt;
+    text-align: right;
+}
diff --git a/data/error.html b/data/error.html
new file mode 100644
index 00000000..06026c00
--- /dev/null
+++ b/data/error.html
@@ -0,0 +1,36 @@
+<!--
+ Copyright (C) 2018 Christian Dywan <christian@twotoats.de>
+
+ This 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 2.1 of the License, or (at your option) any later version.
+
+ See the file COPYING for the full license text.
+-->
+<html>
+  <head>
+    <title>{title}</title>
+    <link ref="shortcut icon" href="stock:///{icon}" />
+    <style type="text/css">
+      {stylesheet}
+    </style>
+  </head>
+  <body>
+    <div id="columns">
+      <div id="icon">
+        <img src="stock:///{icon}" />
+      </div>
+      <div id="main">
+        <h1>{title}</h1>
+        <p class="message">{message}</p>
+        <span class="description">{description}</span>
+        <div class="action">
+          <button onclick="window.location = '{uri}'">
+            <span>{tryagain}</span>
+          </button>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/data/logo-shade.svg b/data/logo-shade.svg
new file mode 100644
index 00000000..7a21a99b
--- /dev/null
+++ b/data/logo-shade.svg
@@ -0,0 +1,150 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="307.65372"
+   height="350"
+   id="svg2418"
+   sodipodi:version="0.32"
+   inkscape:version="0.46"
+   version="1.0"
+   inkscape:export-filename="/home/user/logo-shade.png"
+   inkscape:export-xdpi="90"
+   inkscape:export-ydpi="90"
+   sodipodi:docname="logo-shade.svg"
+   inkscape:output_extension="org.inkscape.output.svg.inkscape">
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     gridtolerance="10000"
+     guidetolerance="10"
+     objecttolerance="10"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1.03"
+     inkscape:cx="74.949357"
+     inkscape:cy="143.09941"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:window-width="1253"
+     inkscape:window-height="682"
+     inkscape:window-x="0"
+     inkscape:window-y="22" />
+  <defs
+     id="defs2420">
+    <linearGradient
+       id="linearGradient3412">
+      <stop
+         id="stop3414"
+         offset="0"
+         style="stop-color:#ffffff;stop-opacity:0.59836066;" />
+      <stop
+         id="stop3416"
+         offset="1"
+         style="stop-color:#97f839;stop-opacity:0;" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient3458">
+      <stop
+         id="stop3460"
+         offset="0"
+         style="stop-color:#88fe38;stop-opacity:1;" />
+      <stop
+         id="stop3462"
+         offset="1"
+         style="stop-color:#ffffff;stop-opacity:0;" />
+    </linearGradient>
+    <inkscape:perspective
+       id="perspective2426"
+       inkscape:persp3d-origin="372.04724 : 350.78739 : 1"
+       inkscape:vp_z="744.09448 : 526.18109 : 1"
+       inkscape:vp_y="0 : 1000 : 0"
+       inkscape:vp_x="0 : 526.18109 : 1"
+       sodipodi:type="inkscape:persp3d" />
+    <linearGradient
+       id="linearGradient3458-648">
+      <stop
+         id="stop2423"
+         offset="0"
+         style="stop-color:#bababa;stop-opacity:1;" />
+      <stop
+         id="stop2425"
+         offset="1"
+         style="stop-color:#ffffff;stop-opacity:0;" />
+    </linearGradient>
+    <linearGradient
+       id="linearGradient3412-967">
+      <stop
+         id="stop2429"
+         offset="0"
+         style="stop-color:#ffffff;stop-opacity:0.59836066;" />
+      <stop
+         id="stop2431"
+         offset="1"
+         style="stop-color:#bababa;stop-opacity:0;" />
+    </linearGradient>
+  </defs>
+  <metadata
+     id="metadata2423">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Nancy Runge &lt;nancy@twotoasts.de&gt;</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <cc:license
+           rdf:resource="http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     transform="translate(-280.66056,-644.09745)"
+     id="layer1"
+     inkscape:groupmode="layer"
+     inkscape:label="Layer 1">
+    <g
+       id="g2546"
+       style="fill:#ffffff;fill-opacity:1;stroke:#bcbcbc;stroke-opacity:1"
+       transform="matrix(2.7318355,0,0,2.7318355,-731.07518,-1421.3016)">
+      <path
+         sodipodi:nodetypes="ccsscccsc"
+         id="path3598"
+         d="M 479.0149,757.44485 C 463.33929,760.3524 390.05715,768.6009 373.75783,823.05659 C 368.99751,841.48441 371.67629,866.55457 392.88608,865.62945 C 394.38911,865.56465 394.54399,866.0597 395.07871,867.32475 C 403.8111,887.98406 426.11314,884.657 430.13518,876.12801 C 430.41248,875.53998 429.75994,876.1331 430.13518,876.12801 C 452.01909,891.1113 463.94687,870.37434 470.8404,851.89287 C 479.26032,835.85799 484.40756,769.09622 479.90163,773.41411 C 403.13312,846.97906 403.28006,782.18757 479.0149,757.44485"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#bcbcbc;stroke-width:2.79349113000000004;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <path
+         id="path3606"
+         d="M 394.6271,866.42646 C 389.11843,841.31269 395.51037,833.40754 398.10369,830.14819"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#bcbcbc;stroke-width:2.79349113000000004;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         sodipodi:nodetypes="cc" />
+      <path
+         id="path3608"
+         d="M 430.04511,875.57142 C 422.884,860.41673 424.07276,847.90995 429.16085,838.58891"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#bcbcbc;stroke-width:2.79349113000000004;stroke-linecap:round;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+         sodipodi:nodetypes="cc" />
+    </g>
+    <g
+       id="g2551"
+       style="fill:#e8e8e8;fill-opacity:1;stroke:none"
+       transform="matrix(2.7318355,0,0,2.7318355,-731.59243,-1420.9344)">
+      <path
+         sodipodi:nodetypes="cccccccccccc"
+         id="path2553"
+         d="M 447.08573,768.31725 C 436.04919,774.1595 397.92257,781.58705 381.33359,820.27881 C 377.02863,833.88105 375.31278,851.44676 387.44516,857.54862 C 385.16801,848.06163 387.57514,834.11288 393.43272,827.57808 C 397.5473,821.96506 405.70797,826.00823 403.09775,831.29165 C 401.29067,836.46522 394.76631,843.8643 399.87669,863.28435 C 404.09154,874.85534 415.25599,879.58634 422.43347,873.92723 C 414.92666,858.12585 420.32228,825.17457 433.92305,832.69366 C 440.70334,836.82119 424.80942,848.38632 435.43821,869.81488 C 448.73626,880.75776 460.15899,863.55615 464.02222,850.63024 C 472.18961,832.82769 477.16809,790.8233 475.1786,786.29359 C 410.97397,845.50147 395.61545,794.24336 447.07098,768.23969"
+         style="fill:#e8e8e8;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.79349113;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+  </g>
+</svg>
diff --git a/gresource.xml b/gresource.xml
index 43c5a206..0aaa1b4e 100644
--- a/gresource.xml
+++ b/gresource.xml
@@ -11,7 +11,10 @@
     <file compressed="true" preprocess="xml-stripblanks" alias="help-overlay.ui">ui/shortcuts.ui</file>
   </gresource>
   <gresource prefix="/">
+    <file compressed="true">data/about.css</file>
+    <file compressed="true">data/error.html</file>
     <file compressed="true">data/gtk3.css</file>
+    <file compressed="true">data/logo-shade.svg</file>
     <file compressed="true">data/history/Create.sql</file>
     <file compressed="true">data/history/Day.sql</file>
     <file compressed="true" preprocess="xml-stripblanks">ui/about.ui</file>