OPTION GUI TRUE PRAGMA GUI gtk3 ' Using libwebkit2gtk PRAGMA INCLUDE PRAGMA OPTIONS `pkg-config --cflags webkit2gtk-4.0` PRAGMA LDFLAGS `pkg-config --libs webkit2gtk-4.0` CONST XSIZE = 300 CONST YSIZE = 300 CONST LONG_LEN = 75 CONST SHORT_LEN = 60 ' Calculate position of clock hands based on current time s = SECOND(NOW)*6-90 x2s$ = STR$(150+LONG_LEN*COS(RAD(s))) y2s$ = STR$(150+LONG_LEN*SIN(RAD(s))) m = MINUTE(NOW)*6-90 x2m$ = STR$(150+LONG_LEN*COS(RAD(m))) y2m$ = STR$(150+LONG_LEN*SIN(RAD(m))) h = IIF(HOUR(NOW)>12, HOUR(NOW)-12, HOUR(NOW))*30+(MINUTE(NOW)/12)*6-90 x2h$ = STR$(150+SHORT_LEN*COS(RAD(h))) y2h$ = STR$(150+SHORT_LEN*SIN(RAD(h))) ' The GUI definition id = GUIDEFINE(" \ { type=WINDOW name=window callback=delete-event callback=key-press-event resizable=0 title=\"Analog Clock with animated SVG\" } \ { type=WEBKIT_TYPE_WEB_VIEW name=view parent=window width-request=XSIZE+10 height-request=YSIZE+20 }") ' Helper function to load SVG GLOBAL (*load_svg)() = webkit_web_view_load_html TYPE void ' Define the animated SVG clock$ = CONCAT$("" \ " " \ " La Crosse Clock" \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ " " \ "" \ "" \ "" \ "" \ " " \ "") ' Load the clock definition into webkit CALL GUIFN(id, "view", load_svg, clock$, NULL) ' Run event loop IF LEN(GUIEVENT$(id)) THEN END