hackable with a repl

This commit is contained in:
BirDt_ 2026-07-11 00:16:04 +08:00
parent 2ffabddba4
commit f9970858d4
3 changed files with 70 additions and 8 deletions

62
app.scm
View file

@ -1,13 +1,63 @@
(load "lib/mithril.scm") (load "lib/mithril.scm")
(define click-count 0) (define click-count
0
"Number of times the button has been clicked.")
(define-macro (add-hook hook fn)
"(add-hook HOOK FN)
Adds FN to HOOK."
`(set! ,hook (cons ,fn ,hook)))
(define (run-hook hook)
"(run-hook HOOK)
Runs all functions in HOOK."
(map
(lambda (fn) (fn))
hook))
(define handle-click-hook
'()
"Hooks to run after the button is clicked.")
(define (handle-click)
"(handle-click)
The function that runs after the button is pressed.
Increments `click-count', and runs `handle-click-hook'."
(set! click-count (+ 1 click-count))
(run-hook handle-click-hook))
(define Heading
(component
(sxml
(h1 ~vnode.state.title))
:title "LIPS! PWA!")
"The page heading component.
Attributes:
* title: The title to display.
__note__: Call (m.redraw) after attribute update.")
(mount-root (mount-root
(component (component
(sxml (sxml
(main (main
(h1 "LIPS! PWA!") (Heading (@ (text "LIPS! PWA!")))
(button (@ (onclick (lambda () (button (@ (onclick handle-click))
(set! click-count (+ 1 click-count)) ~(format "~a clicks" click-count))
(print click-count)))) (div (@ (id "term")))
~(format "~a clicks" click-count)))))) (script
"
const term = terminal({
selector: '#term', // you can use body for full screen terminal
dynamic: false, // dynamic scope, to have normal Scheme you should use false
name: 'demo', // name of the terminal if you want multiple REPL on same page
lips // LIPS namespace
});
")))))

View file

@ -5,6 +5,15 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>LIPS PWA</title> <title>LIPS PWA</title>
<link rel="manifest" href="/manifest.json"/> <link rel="manifest" href="/manifest.json"/>
<script src="https://cdn.jsdelivr.net/npm/jquery"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.46.1/js/jquery.terminal.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.46.1/css/jquery.terminal.min.css" rel="stylesheet"/>
<link href="https://cdn.jsdelivr.net/npm/lips@beta/lib/css/terminal.css"
rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/lips@beta/lib/js/terminal.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/terminal-prism/css/prism-coy.css"/>
</head> </head>
<body> <body>
<!-- Load the scheme interpreter --> <!-- Load the scheme interpreter -->

View file

@ -5,7 +5,10 @@
document.body document.body
component)) component))
(define-macro (component view) (define-macro (component view . args)
(when (= (remainder (length args) 2) 1)
(error "Component expected even length args."))
`(object `(object
:view :view
(lambda () (,@view)))) (lambda (vnode) (,@view))
,@args))