From a9a2291a45e2840b46f0d2aed9305423153ff6da Mon Sep 17 00:00:00 2001 From: AkshayWarrier Date: Fri, 2 Jun 2023 00:44:20 +0530 Subject: [PATCH 1/4] library: Add WebView entry --- src/Library/demos/Web View/main.blp | 40 +++++++++++++ src/Library/demos/Web View/main.js | 89 ++++++++++++++++++++++++++++ src/Library/demos/Web View/main.json | 7 +++ 3 files changed, 136 insertions(+) create mode 100644 src/Library/demos/Web View/main.blp create mode 100644 src/Library/demos/Web View/main.js create mode 100644 src/Library/demos/Web View/main.json diff --git a/src/Library/demos/Web View/main.blp b/src/Library/demos/Web View/main.blp new file mode 100644 index 000000000..1582685da --- /dev/null +++ b/src/Library/demos/Web View/main.blp @@ -0,0 +1,40 @@ +using Gtk 4.0; +using Adw 1; +using WebKit 6.0; + +Window window{ + default-width:1000; + default-height:800; + + [titlebar] + Adw.HeaderBar { + title-widget: + Entry url_bar{ + input-purpose: url; + hexpand:true; + margin-start: 54; + margin-end: 54; + }; + + [start] + Box { + spacing:6; + Button button_back{ + icon-name: "arrow1-left-symbolic"; + tooltip-text: _("Back"); + } + Button button_forward{ + icon-name: "arrow1-right-symbolic"; + tooltip-text: _("Forward"); + } + Button button_reload{ + icon-name:"refresh-symbolic"; + tooltip-text: _("Reload"); + } + Button button_stop { + icon-name:"stop-sign-symbolic"; + tooltip-text: _("Stop"); + } + } + } +} diff --git a/src/Library/demos/Web View/main.js b/src/Library/demos/Web View/main.js new file mode 100644 index 000000000..84bc8b985 --- /dev/null +++ b/src/Library/demos/Web View/main.js @@ -0,0 +1,89 @@ +import Adw from "gi://Adw"; +import WebKit from "gi://WebKit?version=6.0"; +const GObject = imports.gi.GObject; +const { Uri } = imports.gi.GLib; + +const window = workbench.builder.get_object("window"); +const button_back = workbench.builder.get_object("button_back"); +const button_forward = workbench.builder.get_object("button_forward"); +const button_reload = workbench.builder.get_object("button_reload"); +const button_stop = workbench.builder.get_object("button_stop"); +const url_bar = workbench.builder.get_object("url_bar"); +const web_view = new WebKit.WebView(); + +window.child = web_view; + +// URL bar displays the current loaded page +web_view.bind_property( + "uri", + url_bar.buffer, + "text", + GObject.BindingFlags.DEFAULT, +); +web_view.load_uri("https://www.gnome.org/"); + +url_bar.connect("activate", () => { + let url = url_bar.buffer.text; + const scheme = Uri.peek_scheme(url); + if (scheme == null) { + url = `https://${url}`; + } + web_view.load_uri(url); +}); + +button_forward.connect("clicked", () => { + web_view.go_forward(); +}); + +button_back.connect("clicked", () => { + web_view.go_back(); +}); + +button_reload.connect("clicked", () => { + web_view.reload(); +}); + +button_stop.connect("clicked", () => { + web_view.stop_loading(); +}); + +web_view.connect("load-changed", (view, load_event) => { + switch (load_event) { + case WebKit.LoadEvent["STARTED"]: + console.log("Page loading started"); + break; + case WebKit.LoadEvent["FINISHED"]: + console.log("Page loading has finished "); + break; + } +}); + +web_view.connect("load-failed", (view, load_event, fail_url, error) => { + // Dont display error page if it is caused by stop_loading() + if (error.code !== 302) { + web_view.load_alternate_html( + error_page(fail_url, error.message), + fail_url, + null, + ); + } +}); + +web_view.connect("notify::estimated-load-progress", () => { + url_bar.progress_fraction = web_view.estimated_load_progress; + if (url_bar.progress_fraction === 1) { + setTimeout(() => { + url_bar.progress_fraction = 0; + }, 500); + } +}); + +function error_page(fail_url, msg) { + const error = ` +
+

An error occurred while loading ${fail_url}

+

${msg}

+
+ `; + return error; +} diff --git a/src/Library/demos/Web View/main.json b/src/Library/demos/Web View/main.json new file mode 100644 index 000000000..a063d5ece --- /dev/null +++ b/src/Library/demos/Web View/main.json @@ -0,0 +1,7 @@ +{ + "name": "Web View", + "category": "network", + "description": "Load and display webpages and HTML", + "panels": ["ui", "preview"], + "autorun": true +} From e449443592550bc4c1e9bb2df47a05631008eb5d Mon Sep 17 00:00:00 2001 From: AkshayWarrier Date: Fri, 2 Jun 2023 22:00:45 +0530 Subject: [PATCH 2/4] Web View: Remove window from the demo --- src/Library/demos/Web View/main.blp | 75 ++++++++++++++++++++--------- src/Library/demos/Web View/main.js | 12 +++-- 2 files changed, 59 insertions(+), 28 deletions(-) diff --git a/src/Library/demos/Web View/main.blp b/src/Library/demos/Web View/main.blp index 1582685da..d8e484592 100644 --- a/src/Library/demos/Web View/main.blp +++ b/src/Library/demos/Web View/main.blp @@ -1,40 +1,69 @@ using Gtk 4.0; using Adw 1; -using WebKit 6.0; - -Window window{ - default-width:1000; - default-height:800; - - [titlebar] - Adw.HeaderBar { - title-widget: - Entry url_bar{ - input-purpose: url; - hexpand:true; - margin-start: 54; - margin-end: 54; - }; - - [start] + +Adw.Clamp { + maximum-size: 700; + + Box { + orientation: vertical; + Box { - spacing:6; - Button button_back{ + orientation: vertical; + margin-top: 12; + margin-bottom: 12; + spacing: 6; + + Label { + label: "Web View"; + + styles ["title-1"] + } + + Label { + label: "Load and display webpages and HTML"; + } + } + + Box controls { + spacing: 6; + + Button button_back { icon-name: "arrow1-left-symbolic"; tooltip-text: _("Back"); } - Button button_forward{ + + Button button_forward { icon-name: "arrow1-right-symbolic"; tooltip-text: _("Forward"); } - Button button_reload{ - icon-name:"refresh-symbolic"; + + Entry url_bar { + input-purpose: url; + hexpand: true; + } + + Button button_reload { + icon-name: "refresh-symbolic"; tooltip-text: _("Reload"); } + Button button_stop { - icon-name:"stop-sign-symbolic"; + icon-name: "stop-sign-symbolic"; tooltip-text: _("Stop"); } } + + Adw.Bin container { + margin-top: 18; + margin-bottom: 18; + vexpand: true; + hexpand: true; + } + + LinkButton { + margin-bottom: 12; + label: "API Reference"; + uri: "https://webkitgtk.org/reference/webkit2gtk/stable/class.WebView.html"; + } } } diff --git a/src/Library/demos/Web View/main.js b/src/Library/demos/Web View/main.js index 84bc8b985..d1c9f02d0 100644 --- a/src/Library/demos/Web View/main.js +++ b/src/Library/demos/Web View/main.js @@ -1,17 +1,17 @@ -import Adw from "gi://Adw"; import WebKit from "gi://WebKit?version=6.0"; const GObject = imports.gi.GObject; const { Uri } = imports.gi.GLib; -const window = workbench.builder.get_object("window"); +const container = workbench.builder.get_object("container"); const button_back = workbench.builder.get_object("button_back"); const button_forward = workbench.builder.get_object("button_forward"); const button_reload = workbench.builder.get_object("button_reload"); const button_stop = workbench.builder.get_object("button_stop"); const url_bar = workbench.builder.get_object("url_bar"); -const web_view = new WebKit.WebView(); - -window.child = web_view; +const web_view = new WebKit.WebView({ + zoom_level: 0.8, +}); +container.child = web_view; // URL bar displays the current loaded page web_view.bind_property( @@ -20,6 +20,8 @@ web_view.bind_property( "text", GObject.BindingFlags.DEFAULT, ); + +// URL bar displays the current loaded page web_view.load_uri("https://www.gnome.org/"); url_bar.connect("activate", () => { From d8af14c376376ca627a477e28fb64343cf7c211b Mon Sep 17 00:00:00 2001 From: AkshayWarrier Date: Sat, 3 Jun 2023 21:40:49 +0530 Subject: [PATCH 3/4] Web View: Changes from code review --- src/Library/demos/Web View/main.blp | 1 + src/Library/demos/Web View/main.js | 9 ++++----- src/Library/demos/Web View/main.json | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/Library/demos/Web View/main.blp b/src/Library/demos/Web View/main.blp index d8e484592..163b3f607 100644 --- a/src/Library/demos/Web View/main.blp +++ b/src/Library/demos/Web View/main.blp @@ -58,6 +58,7 @@ Adw.Clamp { margin-bottom: 18; vexpand: true; hexpand: true; + styles ["view"] } LinkButton { diff --git a/src/Library/demos/Web View/main.js b/src/Library/demos/Web View/main.js index d1c9f02d0..d939de832 100644 --- a/src/Library/demos/Web View/main.js +++ b/src/Library/demos/Web View/main.js @@ -21,14 +21,13 @@ web_view.bind_property( GObject.BindingFlags.DEFAULT, ); -// URL bar displays the current loaded page web_view.load_uri("https://www.gnome.org/"); url_bar.connect("activate", () => { let url = url_bar.buffer.text; const scheme = Uri.peek_scheme(url); if (scheme == null) { - url = `https://${url}`; + url = `http://${url}`; } web_view.load_uri(url); }); @@ -51,10 +50,10 @@ button_stop.connect("clicked", () => { web_view.connect("load-changed", (view, load_event) => { switch (load_event) { - case WebKit.LoadEvent["STARTED"]: + case WebKit.LoadEvent.STARTED: console.log("Page loading started"); break; - case WebKit.LoadEvent["FINISHED"]: + case WebKit.LoadEvent.FINISHED: console.log("Page loading has finished "); break; } @@ -62,7 +61,7 @@ web_view.connect("load-changed", (view, load_event) => { web_view.connect("load-failed", (view, load_event, fail_url, error) => { // Dont display error page if it is caused by stop_loading() - if (error.code !== 302) { + if (error.code !== WebKit.NetworkError.CANCELLED) { web_view.load_alternate_html( error_page(fail_url, error.message), fail_url, diff --git a/src/Library/demos/Web View/main.json b/src/Library/demos/Web View/main.json index a063d5ece..5eef92941 100644 --- a/src/Library/demos/Web View/main.json +++ b/src/Library/demos/Web View/main.json @@ -2,6 +2,6 @@ "name": "Web View", "category": "network", "description": "Load and display webpages and HTML", - "panels": ["ui", "preview"], + "panels": ["code", "preview"], "autorun": true } From 38c3e77ed239ebc47f0b404de141d7d37d4eb3f2 Mon Sep 17 00:00:00 2001 From: Sonny Piers Date: Sat, 3 Jun 2023 20:49:28 +0200 Subject: [PATCH 4/4] consistent --- src/Library/demos/Web View/main.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Library/demos/Web View/main.js b/src/Library/demos/Web View/main.js index d939de832..a680dad6f 100644 --- a/src/Library/demos/Web View/main.js +++ b/src/Library/demos/Web View/main.js @@ -1,6 +1,6 @@ import WebKit from "gi://WebKit?version=6.0"; -const GObject = imports.gi.GObject; -const { Uri } = imports.gi.GLib; +import GObject from "gi://GObject"; +import GLib from "gi://GLib"; const container = workbench.builder.get_object("container"); const button_back = workbench.builder.get_object("button_back"); @@ -25,7 +25,7 @@ web_view.load_uri("https://www.gnome.org/"); url_bar.connect("activate", () => { let url = url_bar.buffer.text; - const scheme = Uri.peek_scheme(url); + const scheme = GLib.Uri.peek_scheme(url); if (scheme == null) { url = `http://${url}`; }