diff --git a/example1/example-1-dialog.html b/example1/example-1-dialog.html new file mode 100644 index 0000000..1ce1f50 --- /dev/null +++ b/example1/example-1-dialog.html @@ -0,0 +1,17 @@ + + + + + + This is a Dialog for Example 1 + + +

Preferences for Example 1

+ + + + + +
Input 1
Input 2
Input 3
+ + diff --git a/example1/example-1-second.html b/example1/example-1-second.html new file mode 100644 index 0000000..b552a53 --- /dev/null +++ b/example1/example-1-second.html @@ -0,0 +1,20 @@ + + + + + + + This is test 1 + + +

This is test 1

+

+

+

+
+
  • Back to test1
+
+ + diff --git a/example1/example-1.html b/example1/example-1.html new file mode 100644 index 0000000..9b67683 --- /dev/null +++ b/example1/example-1.html @@ -0,0 +1,67 @@ + + + + + + This is Example 1 + + + + +

This is Example 1

+
+ +
+

screen coöords

+

Opening a link to some website

+

+

+

+

Opening a second page

+
+ + +
+

And some other buttons

+
+ + +
+

Menu responses

+ + + + + + + + + + + + + + +
+ + counter = 0 +
OpenClose
CopyCutPaste
+

Some inputs

+
+

This is replacable text

+
+ +
+ + +
+ + diff --git a/example1/example.rkt b/example1/example.rkt new file mode 100644 index 0000000..0d8b11c --- /dev/null +++ b/example1/example.rkt @@ -0,0 +1,267 @@ +#lang racket/gui + +(require "../main.rkt" + racket/runtime-path + racket/gui + simple-ini/class + ) + +(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") + +(define test-menu (menu 'main-menu + (menu-item 'm-file "File" + #:submenu + (menu (menu-item 'm-open "Open File") + (menu-item 'm-close "Close File") + (menu-item 'm-select-dir "Select Folder" #:separator #t) + (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-sub "Submenu" + #:submenu + (menu (menu-item 'm-sub1 "Submenu 1") + (menu-item 'm-sub2 "Submenu 2") + (menu-item 'm-sub3 "Submenu 3") + ) + ) + (menu-item 'm-stop "Stop counter") + ) + ) + )) + +(define example-1-dialog% + (class ww-webview-dialog% + (inherit-field settings) + (super-new [html-file dialog-html] + [width 400] + [height 300]) + + (define/override (html-loaded) + (super html-loaded) + + (ww-debug "html-loaded for example-1-dialog%") + (let* ((btn (send this element 'ok-btn))) + (send btn connect 'click (λ (data) + (send this close)))) + + (let* ((inp1 (send this element 'inp1)) + (inp2 (send this element 'inp2)) + (inp3 (send this element 'inp3))) + (send inp1 set! (send settings get 'inp1 "")) + (send inp2 set! (send settings get 'inp2 "")) + (send inp3 set! (send settings get 'inp3 "")) + (send inp1 on-change! + (λ (val) + (send settings set! 'inp1 val))) + (send inp2 on-change! (λ (val) (send settings set! 'inp2 val))) + (send inp3 on-change! (λ (val) (send settings set! 'inp3 val))) + ) + ) + ) + ) + +(define-syntax inc + (syntax-rules () + ((_ var) + (λ () + (set! var (+ var 1)) + var)))) + +(define example-1-window% + (class ww-webview% + + (inherit-field settings) + (super-new [html-file html-start] + ) + + (define go-on-counter #f) + (define c-counter 0) + (define counter-inc 1) + (define counter-thread #f) + (define div-counter #f) + (define my-dir (send settings get 'folder ".")) + + + (define/override (can-close?) + (eq? counter-thread #f)) + + (define/public (reset-counter) + (set! go-on-counter #f) + (set! counter-thread #f) + ) + + (define/public (inc-counter) + (set! c-counter (+ c-counter counter-inc)) + (when (>= c-counter 1000) + (set! counter-inc -1)) + (when (<= c-counter 0) + (set! counter-inc 1)) + (send this update-counter)) + + (define/public (update-counter) + (send div-counter set-inner-html! (format "Count = ~a" c-counter)) + (when (and (> c-counter 0) (<= c-counter 100)) + (send div-counter set-style! + (css-style '((background white))))) + (when (and (> c-counter 100) (<= c-counter 200)) + (send div-counter set-style! + (css-style '((background green) (color white))))) + (when (and (> c-counter 200) (<= c-counter 300)) + (send div-counter set-style! + (css-style '((background yellow) (font-size: 120%))))) + (when (and (> c-counter 300) (<= c-counter 400)) + (send div-counter set-style! + (css-style '((color white) (background orange) (font-size 110%))))) + (when (and (> c-counter 400)) + (send div-counter set-style! + (css-style '((color white) (background red) (font-size 120%) (font-weight bold))))) + ) + + (define/public (start-counter) + (set! counter-thread + (thread + (λ () + (letrec ((f (λ () + (when go-on-counter + (send this inc-counter) + (sleep 0.01) + (f))))) + (set! go-on-counter #t) + (f))))) + ) + + (define/public (set-folder new-dir) + (set! my-dir new-dir) + (send settings set 'folder new-dir) + (let ((el (send this element 'folder))) + (send el set-inner-html! (format "Selected folder: ~a" my-dir)) + ) + ) + + (define/override (choose-dir) + (let ((handle (super choose-dir "Select a folder" my-dir))) + (displayln (format "choosen dir handle: ~a" handle)) + ) + ) + + (define/override (dir-choosen handle choosen dir) + (displayln (format "dir-choosen: ~a ~a ~a" handle choosen dir)) + (when choosen + (send this set-folder dir))) + + (define/public (prefs) + (new example-1-dialog% [parent this] [settings (send this clone-settings 'example-1-dialog)])) + + (define/override (handle-navigate url type kind) + (send this reset-counter) + (super handle-navigate url type kind)) + + (define/override (html-loaded) + (ww-debug "HTML LOADED") + (super html-loaded) + + (set! div-counter (send this element 'div-counter)) + (send this update-counter) + (send this set-folder my-dir) + + (ww-debug "CONNECTING BUTTONS") + (let* ((dialog-btn (send this element 'dialog-button)) + (start-stop-btn (send this element 'start-stop-button)) + (choose-dir-btn (send this element 'select-dir-button)) + ) + (send dialog-btn connect 'click + (λ (data) (send this prefs))) + + (send start-stop-btn connect 'click + (λ (data) + (if (eq? counter-thread #f) + (begin + (send this start-counter) + (send start-stop-btn set-inner-html! "Stop Counter")) + (begin + (send this reset-counter) + (send start-stop-btn set-inner-html! "Start Counter")) + ) + ) + ) + (send choose-dir-btn connect 'click + (λ (data) + (send this choose-dir))) + ) + + (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) + ) + + (send this set-menu! test-menu) + (send this connect-menu! 'm-quit + (λ () + (send this reset-counter) + (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 + (λ () (send this start-counter))) + + (send this connect-menu! 'm-stop + (λ () (send this reset-counter))) + + (send this connect-menu! 'm-prefs + (λ () (send this prefs))) + + (send this connect-menu! 'm-select-dir + (λ () (send this choose-dir))) + + ) + ) + ) + + (begin + (displayln "Yes this works!") + ) + ) + ) + +(define (run-example) + (let* ((ini (new ini% [file 'web-racket-example1])) + (settings (new ww-simple-ini% [ini ini] [section 'example-1-window])) + (window (new example-1-window% [settings settings])) + ) + window)) diff --git a/example1/racket-logo.png b/example1/racket-logo.png new file mode 100644 index 0000000..4c4717e Binary files /dev/null and b/example1/racket-logo.png differ diff --git a/example1/styles.css b/example1/styles.css new file mode 100644 index 0000000..c31f01a --- /dev/null +++ b/example1/styles.css @@ -0,0 +1,68 @@ +body { + font-family: Arial; + font-size: 11pt; +} + +h1 { + color: #303030; +} + +h1:hover { + color: #606060; +} + +a { + text-decoration: none; +} + +button.btn-1 { + background: #1adb4e; + border: 1px solid black; + padding: 1em; +} + +button.btn-2 { + color: white; + background: #3e5c46; + border: 1px solid green; + padding: 1em; + margin-left: 1em; +} + +button.btn-2 a { + color: white; +} + +table { + margin: 1em; + border: 1px solid black; + border-collapse: collapse; +} + +table td { + border: 1px solid #909090; + padding: 0.5em; + width: 70%; +} + +table th { + border-collapse: collapse; + border: 1px solid #909090; + padding: 0.5em; + width: 30%; +} + +td span.counter { + padding: 1em; + border: 1px solid grey; +} + +.right { + float: right; +} + +.right img.logo { + margin: 2em; + border: 2px solid grey; + max-width: 250px; +}