hans/web-racket
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add HTML examples.

Browse Source 
Merge branch 'main' of https://github.com/hdijkema/web-racket

# Conflicts:
#	private/webui-wire-download.rkt

Signed-off-by: Hans Dijkema <hans@dijkewijk.nl>
This commit is contained in:
Hans Dijkema
2025-11-12 15:35:03 +01:00
parent 7492defaab
commit 51c8ef5aa1
8 changed files with 451 additions and 204 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
example1/example-1.html Normal file
View File

@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css" />
<meta charset="UTF-8" />
<title>This is Example 1</title>
<script>
window.setInterval(function() {
let el = document.getElementById('pos');
el.innerHTML = window.screenX + ", " + window.screenY;
}, 250);
</script>
</head>
<body>
<h1>This is Example 1</h1>
<p><span id="pos">screen coöords</span></p>
<h2>Opening a link to some website</h2>
<p>
<ul>
<li><a href="https://wikipedia.org">To Wikipedia</a></li>
</ul>
</p>
<h2>Opening a second page</h2>
<div class="buttons">
<button class="btn-1" onclick="window.location.href='example-second.html';">Open the second page using javascript</button>
<button class="btn-2"><a href="example-second.html" id="click-url" style="color:green;">Open the second page uring url</a></button>
</div>
<h2>And some other buttons</h2>
<div class="buttons">
<button class="btn-2" id="dialog-button">Open a dialog</button>
<button class="btn-1" id="select-dir-button">Select a directory</button>
</div>
<h2>Menu responses</h2>
<table>
<tr>
<td colspan="3" class="counter" id="div-counter">counter = 0</td>
</tr>
<tr>
<td id="div-open">Open</td>
<td id="div-close">Close</td>
<td></td>
</tr>
<tr>
<td id="div-copy">Copy</td>
<td id="div-cut">Cut</td>
<td id="div-paste">Paste</td>
</tr>
</table>
<h2>Some inputs</h2>
<div style="margin:0.5em; border: 1px solid #909090; padding: 5px;" id="my-id">
<p>This is <span id="spanner">replacable</span> text</p>
<input type="text" id="input-name" name="input-name" value="a" /><br>
<input type="text" id="inp2" value="i2" />
<input type="date" id="date-input" /><br>
<input type="datetime-local" id="dt-input" />
<input type="time" id="time-inp" />
</div>
<h2>Some pictures</h2>
<div id="ff">
<img src="ff.jpg" >
</div>
<div id="f1">
<img src="f1.png" />
</div>
</body>
</html>

142
example1/example.rkt
View File

@@ -1,15 +1,133 @@
#lang racket/gui
(require "../main.rkt"
racket/runtime-path
racket/gui
)
(define m (menu (menu-item 'm-file "File"
#:submenu
(menu (menu-item 'm-open "Open File")
(menu-item 'm-close "Close File")
(menu-item 'm-quit "Quit" #:separator #t)))
(menu-item 'm-edit "Edit"
#:submenu
(menu (menu-item 'm-copy "Copy")
(menu-item 'm-cut "Cut")
(menu-item 'm-paste "Paste")
(menu-item 'm-prefs "Preferences" #:separator #t)
))))
(provide
(all-from-out racket/gui)
example-1-window%
)
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
;; Example 1
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(define-runtime-path html-start "example-1.html")
(define-runtime-path dialog-html "example-1-dialog.html")
(displayln html-start)
(displayln dialog-html)
(define test-menu (menu (menu-item 'm-file "File"
#:submenu
(menu (menu-item 'm-open "Open File")
(menu-item 'm-close "Close File")
(menu-item 'm-quit "Quit" #:separator #t)))
(menu-item 'm-edit "Edit"
#:submenu
(menu (menu-item 'm-copy "Copy")
(menu-item 'm-cut "Cut")
(menu-item 'm-paste "Paste")
(menu-item 'm-prefs "Preferences" #:separator #t)
))
(menu-item 'm-auto "Processes"
#:submenu
(menu (menu-item 'm-start "Start counter")
(menu-item 'm-stop "Stop counter")
))
))
(define test-dialog%
(class ww-webview%
(super-new [html-file dialog-html]
[width 400]
[height 300])
(define/override (html-loaded)
(super html-loaded)
(ww-debug "html-loaded for test-dialog%")
(let* ((btn (send this element 'ok-btn)))
(send btn connect 'click (λ (data)
(send this close)))))
))
(define-syntax inc
(syntax-rules ()
((_ var)
(λ ()
(set! var (+ var 1))
var))))
(define example-1-window%
(class ww-webview%
(super-new [html-file (begin (displayln html-start) html-start)])
(define/override (html-loaded)
(ww-debug "HTML LOADED")
(super html-loaded)
(ww-debug "CONNECTING BUTTONS")
(let* ((dialog-btn (send this element 'app-button))
)
(send dialog-btn connect 'click (λ (data)
(new test-dialog% [parent this])))
)
(ww-debug "SETTING MENU")
(let* ((div-open (send this element 'div-open))
(c-open 0)
(div-close (send this element 'div-close))
(c-close 0)
(div-copy (send this element 'div-copy))
(c-copy 0)
(div-cut (send this element 'div-cut))
(c-cut 0)
(div-paste (send this element 'div-paste))
(c-paste 0)
(div-counter (send this element 'div-counter))
(go-on-counter #f)
(c-counter 0)
(counter-thread #f)
)
(send this set-menu! test-menu)
(send this connect-menu! 'm-quit (λ () (send this close)))
(let ((make-menu-executor (λ (item elem string count)
(send this connect-menu! item
(λ ()
(send elem set-inner-html (format "~a ~a" string (count)))))))
)
(make-menu-executor 'm-open div-open "Open file" (inc c-open))
(make-menu-executor 'm-close div-close "Close file" (inc c-close))
(make-menu-executor 'm-copy div-copy "Edit Copy" (inc c-copy))
(make-menu-executor 'm-cut div-cut "Edit Cut" (inc c-cut))
(make-menu-executor 'm-paste div-paste "Edit Paste" (inc c-paste))
(send this connect-menu! 'm-start
(λ ()
(set! counter-thread
(thread (λ ()
(letrec ((f (λ ()
(when go-on-counter
(set! c-counter (+ c-counter 1))
(send div-counter set-inner-html (format "Count = ~a" c-counter))
(sleep 0.01)
(f)))))
(set! go-on-counter #t)
(f)))))))
(send this connect-menu! 'm-stop
(λ ()
(set! go-on-counter #f)))
)
)
)
(begin
(displayln html-start)
)
)
)