Video felső sarkában HTML ablak

Fórumok

Sziasztok

Egy várakozó térben 42"-os TV-n demo videó megy 0-24h. A bal felső sarokban 3 napra időjárás előrejelzés, ami egy szimpla html oldal. A HTML oldal saját reszelés, minden belefér egy vállaható méretbe (képernyő ~1/10) . A weboldal megjelenítésénél nincs címsáv, sem keret, semmi, valami cél html megjelenítő, így van ráültetve a teljes képernyős videóra.
Ezt az egészet egy samsung célhardver generálja és VGA/HDMI porton kiadja a TV-re.
A cucc régi, gagyi és a szolgáltatás töredékét sem használjuk ki.

Gondoltam valami Raspberry/Beaglebone PC-ből megcsinálnám hasonlóra, karbantartásmentesen.

A cél tehát úgy lejátszani videót, hogy az egyik sarokban olyan böngésző ablak jelenjen meg, ami minden sallang nélkül van.
Mindezt boot után automatikusan, automatikusan pozícionálva.

2 irány jutott eszembe:

1- valami cél ablakkezelő/program ami keretbe tud fog html-t és videót is.
2- random linux desktop környezet, ahol lecsapom a kereket, és user autorunból megnyitom pozícionálva az ablakokat. Ekkor viszont valami full fapad böngésző kell, amit mindentől meg lehet fosztani.

Van erre ötletetek?

Hozzászólások

Én HTML-ben oldanám meg az egészet. Egy teljes képernyős böngészőben futna a videó (autoplay, loop módban), illetve a CSS-sel pozicionált időjárásos panel.

Ez sem egy rossz ötlet, köszönöm. Ez további lehetőségeket is megadhat, pl. taxi/reptér info az idájárás alatt egy sávban, mellette/alatta videó. Gondolom html+CSS-ben videóra is lehet helyezni egy ablakot, ha nem akarom teljes szélességben/magasságban kitakarni.

Szerkesztve: 2020. 02. 10., h - 07:22

GTK3 + WebKit böngésző, ablakkeret nélkül

Telepítendő csomagok (Ubuntu 18.04.latest elnevezések):

  • python3-gi
  • gir1.2-webkit2-4.0
  • libwebkit2gtk-4.0-37  (ezt Ubuntu-n behúzza a előző, talán más rendszeren nem)
#!/usr/bin/env python3

import sys
import os

import gi
gi.require_version('Gtk', '3.0')
gi.require_version('WebKit2', '4.0')
from gi.repository import Gtk, Gdk, WebKit2


class Browser(Gtk.Window):
    def __init__(self, *args, **kwargs):
        super(Browser, self).__init__(*args, **kwargs)
        self.set_title("Bongeszo")
        
        self.connect("destroy", Gtk.main_quit)
        self.connect("map", self.on_map)
        self.set_size_request(800, 600) # set minimum size allowed
        
        self.webview = WebKit2.WebView()
        self.webview.load_uri("https://hup.hu/node/167808#comment-2437556")
        
        self.set_decorated(False)
        self.add(self.webview)
        self.show_all()
        
    def on_map(self, *args): # to be called when the window is shown
#    	screen = Gdk.Screen.get_default()
        screen = self.get_window().get_screen()
        x = screen.get_width() - self.get_size().width
        y = 0
        self.move(x, y)
        self.set_keep_above(True)
#        self.fullscreen() # uncomment if you want fullscreen browser
#        self.resize(width, height) # use resize() here if you need screen-size dependent window-size

        
if __name__ == "__main__":
    Gtk.init(sys.argv)
    browser = Browser()
    Gtk.main()

Ubuntu 18.04.x és származékain az "import gi" sor a "/usr/lib/python3/dist-packages/gi/__init__.py" fájlt tölti be alapesetben. Ez a fájl a python3-gi csomagban van, telepítése terminálban: apt install python3-gi

Más rendszeren, amin van GTK3 és python3, valószínűleg elérhető a szükséges python3-gi csomag, csak talán más néven. Olyan csomagokat keress aminek a nevében, leírásában szerepelnek:

  • python3 esetleg python
  • gi vagy gir vagy gnome introspection vagy gtk

(base) root@PapLevente-Linux:~# apt install python3-gi
Csomaglisták olvasása... Kész
Függőségi fa építése       
Állapotinformációk olvasása... Kész
python3-gi már a legújabb verzió (3.26.1-2ubuntu1).

És a fent említett fájl is megvan (/usr/lib/python3/dist-packages/gi/__init__.py) , mégsem működik !!

Zorin OS 15.01  (Ubuntu 18.04) 64bit

Még is hogy kéne akkor import -álni ?

Több ablakos változat

Ablaknyitást engedélyezni a  webview.get_settings().set_javascript_can_open_windows_automatically(True)  -val lehet, mit az lentebb látható. Azonban az engedélyezés nem elegendő, mert a webkit ablakozó rendszer független - csak annyit tud hogy kapott egy téglalapot ahová rajzolhat. Azt nem tudja hogy lehet az adott rendszeren új ablakot nyitni, ezért az új ablak nyitási igényét "create" signal-lal jelzi. A signal-t a webkit-et használó program lekezelheti, pl. nyit egy másik ablakot, és benne egy másik webkit webview -t.

Emellett a lenti program annyit okosodott, hogy:

  • a nyitott ablak title-jét és ikonját a weboldal szerint beállítja (megkülönböztethetőség végett, ha több ablak lesz)
  • mindig felül és a fix elhelyezés (on_map) ki lett kapcsolva (ne egymásra tegye az ablakokat)
  • a JS mégse nyithasson korlátlanul akárhány böngészőablakot, ezért alap browsers_max=3
  • van minimál diagnosztikai kozol kimenet, ezt érdemes beletenni a segítségkérésbe hiba esetén.
#!/usr/bin/env python3

import sys
print("Python executable:", sys.executable)
print("Python version:   ", sys.version.replace('\n', ' '))

import os
print("Python venv:      ", end=' ')
try:
    print(os.environ['VIRTUAL_ENV'])
except:
    print("not in venv")

print("Python path:      ", *sys.path, sep = '\n\t')


import gi
print("Module gi path:   ", gi.__file__)

gi.require_version('Gtk', '3.0')
gi.require_version('WebKit2', '4.0')
from gi.repository import Gtk, Gdk, WebKit2

ctx = WebKit2.WebContext()
ctx.set_favicon_database_directory("/tmp/bongeszo")

browsers_max = 3
browsers = set()

class Browser(Gtk.Window):
    def __init__(self, uri):
        super(Browser, self).__init__()
        
        self.webview = WebKit2.WebView.new_with_context(ctx)
        self.webview.get_settings().set_javascript_can_open_windows_automatically(True)
        self.webview.connect("create", self.on_create)
        self.webview.connect("notify::title", self.on_title)
        self.webview.connect("notify::favicon", self.on_favicon)
        self.webview.load_uri(uri)
        self.add(self.webview)

        self.connect("destroy", self.on_destroy)
        # self.connect("map", self.on_map) # uncomment if needed
        self.set_size_request(800, 600) # set minimum size allowed

        self.set_title("Bongeszo - " + uri)
        self.set_decorated(False)
        self.show_all()
    
    
    # WebView events

    def on_create(self, vew_view, navigation_action):
        req = navigation_action.get_request()
        uri = req.get_uri()
        print("on_create URI=", uri)
        if len(browsers) + 1 > browsers_max:
            print("browsers_max count reached, refusing to open new window")
        else:
            browsers.add(Browser(uri))
    
    def on_title(self, *args):
        print("on_title called")
        self.set_title(self.webview.get_title())
        
    def on_favicon(self, *args):
        print("on_favicon called")
        
        favicon = self.webview.get_favicon()
        if favicon:
            pixbuf = Gdk.pixbuf_get_from_surface(favicon, 0, 0, favicon.get_width(), favicon.get_height())
            self.set_icon(pixbuf)
    
    # Window events
        
    def on_map(self, *args): # to be called when the window is shown
#    	screen = Gdk.Screen.get_default()
        screen = self.get_window().get_screen()
        x = screen.get_width() - self.get_size().width
        y = 0
        self.move(x, y)
        self.set_keep_above(True)
#        self.fullscreen() # uncomment if you want fullscreen browser
#        self.resize(width, height) # use resize() here if you need screen-size dependent window-size

    def on_destroy(self, *args):
        browsers.remove(self)
        if len(browsers) == 0:
            Gtk.main_quit()
        
if __name__ == "__main__":
    Gtk.init(sys.argv)
    browsers.add(Browser("https://hup.hu/comment/2440202#comment-2440202"))
    Gtk.main()

Egy egyszerűbb out-of-the-box megoldás lehet ez is, bár ez csak a PC irányra, ARM-el nem kompatibilis.

https://porteus-kiosk.org/

USB-re letölt, telepít, konfig, és ennyi, üzembiztosan működik :)  Nálam árellenőrző fut rajta, háttérben folyamatosan megy egy videó.

Az a gyanúm, hogy az a "célhardware" egy logo generátor. Annyira nem lehet gagyi. Azért ha kiváltod, nekem adod a régit?