How to go about loading an image from the internet using Gtk3 with javascript?
I tried using
var image = new Image();
image.src(url);
But this gives an error -> JS ERROR: ReferenceError: Image is not defined
Any helps?
Thanks.
//Update Since their was not enough information available above, I`ll post it down here ->
const Gtk = imports.gi.Gtk;
const Gdk = imports.gi.Gdk;
const Gio = imports.gi.Gio;
let app = new Gtk.Application({ application_id: 'org.gtk.ExampleApp' });
app.connect("activate", ()=>{
let win = new Gtk.Window({application : app});
let img = new Gtk.Image();
let url = 'https://spotlightreport.net/wp-content/uploads/2020/10/AC-DC-SHOT-IN-THE-DARK-PACK-SHOT-1920x1920.jpg';
let input_stream = Gio.MemoryInputStream.new_from_data(url, null);
let pixbuf = Gdk.GdkPixbuf.Pixbuf.new_from_stream(input_stream);
img.set_from_pixbuf(pixbuf);
win.connect('destroy', ()=>{win.close();});
win.set_default_size(450,250);
win.show_all();
});
app.run([]);
I actually want to load the image from url directly i.e. without downloading it. And i came across a post to fetch data using javascript functions but it didn`t work. How do i fetch the image and show it? I actually tried to do this -> Post
There's very little code to go on here, but I can imagine several reasons why it doesn't work:
imports.gi.versions.Gtk = "3.0";
const { Gtk } = imports.gi;
const image = new Gtk.Image() // Not `new Image()`
src() is not a method that exists in Gtk.Image nor does it mention that anywhere. You can find the JS documentation of Gtk.Image at https://gjs-docs.gnome.org/gtk30-image/ . As you'll see there, there is no method to load a Gtk.Image from a random URL (unless it happens to be a file). So you'll first have to download the contents of the URL, make a Gdk.Pixbuf out of it, and then use that for your Gtk.ImageIn any case: I think it's best for you to first follow the GTK3 in GJS guide (there's also a section on using Gtk.Image) and start from some smaller examples. Once you learn the basics and start feeling comfortable with GJS, you can then proceed to start implementing custom stuff.