¿Es posible procesar contenido web sobre un fondo claro utilizando WebKit?

Question

Estoy tratando de evaluar la posibilidad de un parche para WebKit que permita renderizar todos los gráficos renderizados en un fondo completamente transparente.

El efecto deseado es presentar contenido web sin ningún tipo de fondo, debería aparecer flotando sobre el escritorio (o lo que se muestra detrás de la ventana del navegador).

¿Alguien ha visto una aplicación para esto? (Puedo pensar en algunos emuladores de terminal que sí pueden). Si alguien ha trabajado dentro de WebKit (¿o posiblemente Gecko?), ¿Cree que sería posible hacer esto?

---

Actualización: me he dado cuenta de que Mac OSX widgets de paneles utilizan esta técnica exacta. Entonces, esto debe ser posible.

---

Actualización 2: He compilado WebKit en Linux y se dio cuenta de las opciones de configuración incluyen:

--enable-dashboard-support 
enable Dashboard support default=yes 

estoy cada vez más cerca. ¿Alguien puede ayudar?

---

Actualización 3: que siguen encontrando referencias a esto en funciones en varias listas de correo relacionadas.

• https://lists.webkit.org/pipermail/webkit-dev/2008-September/005019.html
• https://lists.webkit.org/pipermail/webkit-dev/2009-June/008182.html

Answer 1

resuelto!

A través de investigaciones en curso, foros de búsqueda y repositorios de códigos fuente, estudié juntos los pasos necesarios para lograr esto utilizando solo libwebkit y un escritorio compiz estándar (cualquier escritorio Xorg con composición debería hacerlo).

Para un libwebkit actual (1.1.10-SVN), hay un PPA de Ubuntu:

deb http://ppa.launchpad.net/webkit-team/ppa/ubuntu jaunty main 
deb-src http://ppa.launchpad.net/webkit-team/ppa/ubuntu jaunty main 

En lo que va del código, la clave está llamando webkit_web_view_set_transparent.

Y, por supuesto, el sistema en el que lo ejecuta debe tener una tarjeta gráfica capaz (intel, radeon o nvidia) y ejecutar un administrador de ventanas de composición (como Compiz).

Y, por último, para ver realmente la transparencia, el contenido que está viendo debe establecer un fondo transparente con CSS3, de lo contrario, sigue siendo completamente opaco.

Es tan simple como:

BODY { background-color: rgba(0,0,0,0); } 

Aquí' es la muestra completa de la más simple aplicación posible del navegador WebKit, con el apoyo de la transparencia:

#include <gtk/gtk.h> 
#include <webkit/webkit.h> 

static void destroy_cb(GtkWidget* widget, gpointer data) { 
    gtk_main_quit(); 
} 

int main(int argc, char* argv[]) { 
    gtk_init(&argc, &argv); 

    if(!g_thread_supported()) 
    g_thread_init(NULL); 

    // Create a Window, set colormap to RGBA 
    GtkWidget* window = gtk_window_new(GTK_WINDOW_TOPLEVEL); 
    GdkScreen *screen = gtk_widget_get_screen(window); 
    GdkColormap *rgba = gdk_screen_get_rgba_colormap (screen); 

    if (rgba && gdk_screen_is_composited (screen)) { 
    gtk_widget_set_default_colormap(rgba); 
    gtk_widget_set_colormap(GTK_WIDGET(window), rgba); 
    } 

    gtk_window_set_default_size(GTK_WINDOW(window), 800, 800); 
    g_signal_connect(window, "destroy", G_CALLBACK(destroy_cb), NULL); 

    // Optional: for dashboard style borderless windows 
    gtk_window_set_decorated(GTK_WINDOW(window), FALSE); 


    // Create a WebView, set it transparent, add it to the window 
    WebKitWebView* web_view = web_view = WEBKIT_WEB_VIEW(webkit_web_view_new()); 
    webkit_web_view_set_transparent(web_view, TRUE); 
    gtk_container_add (GTK_CONTAINER(window), GTK_WIDGET(web_view)); 

    // Load a default page 
    webkit_web_view_load_uri(web_view, "http://stackoverflow.com/"); 

    // Show it and continue running until the window closes 
    gtk_widget_grab_focus(GTK_WIDGET(web_view)); 
    gtk_widget_show_all(window); 
    gtk_main(); 
    return 0; 
} 

Screenshot! http://i27.tinypic.com/2qntlxl.jpg

Answer 2

Básicamente desea que se le ajuste del espacio de color ARGB a enviar al gestor de ventanas. Obviamente, solo los administradores de ventanas que admitan la composición podrán aprovechar esto.

Es posible que desee hablar con el screenlet y los desarrolladores de compiz para que puedan ayudarlo más.

Answer 3

De vuelta en Safari 1.3 y 2, había un menú de depuración oculto (invocado a través de la Terminal: defaults write com.apple.Safari IncludeDebugMenu 1) que incluía una opción "Usar ventana transparente".

• http://www.macosxhints.com/article.php?story=20050418015445258
• http://www.wiredatom.com/blog/2005/10/20/safari-transparency/

No estoy seguro si esto era una cosa o una cosa WebKit de Safari sin embargo.

(En Safari 3, el menú de depuración parece haber sido sustituido por el menú “Revelado” (activar en Preferencias> Avanzado) que no tiene la opción de ventana transparente.)

Answer 4

Esta GIST trabaja para yo, a partir de 2013, probado solo con ubuntu:

https://gist.github.com/pouria-mellati/7771779

Answer 5

Tengo una nueva solución que es realmente fácil de hacer, para una sola captura de pantalla. Está utilizando node.js con la biblioteca phantom.js.

1. instalar Node.js
2. run 'NPM instalar PhantomJS -g' en la consola/terminal de

3. salvar a los siguientes como script.js y ejecutarlo desde la consola '' PhantomJS script.js

   var page = require('webpage').create(); 
   page.viewportSize = { width: 1920, height: 1500 }; 
   page.open("http://www.theWebYouWantToRender"); 
   page.onLoadFinished = function(status) { 
       page.evaluate(function() { 
        document.body.style.background = 'transparent'; 
       }); 
   
       page.render('render.png'); 
       phantom.exit(); 
   }; 
   

4. ganancia? :) disfruta