bassix-svg-clock

BASSIX-SVG-CLOCK

'--- bigbass bassix port of clock-svg-animated-vov.bac
'--- Peter did a basic clock  demo clock-svg-animated.bac
'--- vovchik improved on the visual presentation by using a real clock
'----I just wanted to see how it could be ported using bassix webkit and gtk3 macros


OPTION PARSE FALSE
PRAGMA INCLUDE <webkit2/webkit2.h>
PRAGMA OPTIONS `pkg-config --cflags webkit2gtk-4.0`
PRAGMA LDFLAGS `pkg-config --libs webkit2gtk-4.0`



'--- new signal handlers to simplify the callbacks
DEF FN CONNECT( widget, event,cb) = g_signal_connect_data(widget,event,cb, 0, 0, 0)
DEF FN CONNECT_DATA( widget, event,cb,t) = g_signal_connect_data(G_OBJECT (widget),event,G_CALLBACK (cb),(gpointer) t, 0, 0)
DEF FN NEW(widget,...) = g_object_new(widget, __VA_ARGS__,NULL)
DEF FN PLACE( widget, name,wid,high) = gtk_fixed_put(GTK_FIXED(widget),  GTK_WIDGET(name),wid,high)
DEF FN ADD_FIXED( widget, name) = gtk_container_add(GTK_CONTAINER(widget), GTK_WIDGET(name))
DEF FN SET(widget, name, ...) = g_object_set(GTK_WIDGET(widget), name, __VA_ARGS__, NULL)
DEF FN GET( widget, name, ...) = g_object_get(widget, name, __VA_ARGS__, NULL)
DEF FN SHOW( widget) = gtk_widget_show_all(GTK_WIDGET(widget))
DEF FN HIDE( widget) = gtk_widget_hide(GTK_WIDGET(widget))
DEF FN INIT() = gtk_init(0,0)
DEF FN LABEL(t) = gtk_label_new(t)
DEF FN BUTTON_ADD(t) = gtk_button_new_with_label(t)
DEF FN FIXED() = gtk_fixed_new()  
DEF FN DISPLAY() = gtk_main() 
DEF FN ATTACH() = gtk_container_add()
DEF FN SCROLLED_WINDOW() = gtk_scrolled_window_new (NULL, NULL)


'--- WEB_HTML is new 
DEF FN WEBKIT_SET(wk, ...) = g_object_set(WEBKIT_SETTINGS(wk),  __VA_ARGS__, NULL)
DEF FN WEB_HTML(widget,ht)= webkit_web_view_load_html(WEBKIT_WEB_VIEW(widget ), ht,NULL)

ALIAS GTK_TYPE_WINDOW TO WINDOW
ALIAS GTK_WIDGET TO WIDGET
ALIAS GTK_CONTAINER TO CONTAINER

DECLARE window, scrolled_win  TYPE GtkWidget*
DECLARE fixed TYPE GtkWidget*

CONST XSIZE = 300
CONST YSIZE = 300

CONST LONG_LEN = 115
CONST SHORT_LEN = 90

' 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)))

' Define the animated SVG
clock$ = "<svg width='300' height='300' viewBox='0 0 300 300'>" & \
"<g transform='scale(3,3)'>" & \
"<circle cx='50' cy='50' r='45' fill='peachpuff' stroke='black' stroke-width='2'/>  " & \
"<g fill='white' stroke='black' stroke-width='2'> " & \
"<line x1='50' x2='50' y1='5' y2='10'/>  " & \
"<line x1='72.5' x2='70' y1='11.03' y2='15.36'/>  " & \
"<line x1='88.97' x2='84.64' y1='27.5' y2='30'/>  " & \
"<line x1='95' x2='90' y1='50' y2='50'/>  " & \
"<line x1='88.97' x2='84.64' y1='72.5' y2='70'/>  " & \
"<line x1='72.5' x2='70' y1='88.97' y2='84.64'/>  " & \
"<line x1='50' x2='50' y1='95' y2='90'/>  " & \
"<line x1='27.5' x2='30' y1='88.97' y2='84.64'/>  " & \
"<line x1='11.03' x2='15.36' y1='72.5' y2='70'/>  " & \
"<line x1='5' x2='10' y1='50' y2='50'/>  " & \
"<line x1='11.03' x2='15.36' y1='27.5' y2='30'/>  " & \
"<line x1='27.5' x2='30' y1='11.03' y2='15.36'/>  " & \
"</g> " & \
"<g fill='peru' font-family='Sans' font-size='8' " & \
" text-anchor='middle' opacity='1' dominant-baseline='central'> " & \
"<text x='50' y='20'>12</text> " & \
"<text x='85' y='53'>3</text> " & \
"<text x='50' y='88'>6</text> " & \
"<text x='15' y='53'>9</text> " & \
"</g> " & \
"</g>" & \
"<circle cx='150' cy='150' r='10' stroke-width='1' stroke='black' fill='black' />" & \
"<line x1='150' y1='150' x2='" & x2m$ & "' y2='" & y2m$ & "' stroke-width='4' stroke='black'>" & \
"<animateTransform attributeName='transform' type='rotate' dur='3600' from='0,150,150' to='360,150,150' repeatCount='indefinite'/></line>" & \
"<line x1='150' y1='150' x2='" & x2h$ & "' y2='" & y2h$ & "' stroke-width='7' stroke='black'>" & \
"<animateTransform attributeName='transform' type='rotate' dur='43200' from='0,150,150' to='360,150,150' repeatCount='indefinite'/></line>" & \
"<line x1='150' y1='150' x2='" & x2s$ & "' y2='" & y2s$ & "' stroke-width='2.2' stroke='red'>" & \
"<animateTransform attributeName='transform' type='rotate' dur='60' from='0,150,150' to='360,150,150' repeatCount='indefinite'/></line>" & \
"<circle cx='150' cy='150' r='5' stroke-width='0' stroke='black' fill='red' />" & \
"<circle cx='150' cy='150' r='2' stroke-width='0' stroke='black' fill='black' />" & \
" </svg>"


'=============================
FUNCTION CLOCK_CB
'=============================
    WEB_HTML(WEB_VIEW,clock$)
    RETURN TRUE
END FUNCTION




'=====================
SUB exit_prog
'=====================
  END
END SUB



    INIT

    '---WEB_VIEW GUI
    WEB_VIEW = webkit_web_view_new()
    SET(WEB_VIEW, "width-request", 310)
    SET(WEB_VIEW, "height-request", 320)

    window = NEW(WINDOW, "icon-name","gtk-about")
    SET(window, "title", "Peter and vovchik clock ", "border-width", 0) 
    SET(window, "width_request", 300  ,"height_request",300 ,"resizable" ,0)

    fixed = FIXED()
    ADD_FIXED(window, fixed)
    PLACE (fixed, WEB_VIEW, 0,0)

    '--- handle callbacks 
    CONNECT_DATA(window, "delete-event", exit_prog,NULL)

    CALL CLOCK_CB
    SHOW(window)
    DISPLAY