WebUI - Call JavaScript from C
43 |44 |
0
45 |46 | 47 |
48 | 49 |
50 | 51 | 64 | 65 | 66 | """ 67 | 68 | proc main = 69 | # Create a window 70 | let window = newWindow() 71 | 72 | window.bind("MyButton1") do (e: Event): 73 | # This function gets called every time the user clicks on "MyButton1" 74 | 75 | # Run Javascript and hold the response in `js` 76 | let js = e.window.script("return GetCount();") 77 | 78 | if js.error: 79 | echo "JavaScript Error: ", js.data 80 | else: 81 | echo "JavaScript Response: ", js.data 82 | 83 | # Get the count 84 | var count = parseInt(js.data) 85 | 86 | # Increment 87 | inc count 88 | 89 | # Run JavaScript (Quick Way) 90 | e.window.run("SetCount($1);" % $count) 91 | 92 | window.bind("MyButton2") do (_: Event): 93 | exit() 94 | 95 | # Show the window 96 | window.show(html) # window.show(html, wbChrome); 97 | 98 | # Wait until all windows get closed 99 | wait() 100 | 101 | # Free all memory resources (Optional) 102 | clean() 103 | 104 | main() 105 | -------------------------------------------------------------------------------- /examples/call_nim_from_js.nim: -------------------------------------------------------------------------------- 1 | import webui 2 | 3 | const html = """ 4 | 5 | 6 | 7 | 8 | 9 |
WebUI - Call C from JavaScript
40 |Call C functions with arguments (See the logs in your terminal)
41 | 42 |43 | 44 |
45 | 46 |
47 | 49 |
50 |
Call a C function that returns a response
51 | 52 |Double:
53 |
66 |
67 |
68 | """
69 |
70 | proc main =
71 | # Create a window
72 | let window = newWindow()
73 |
74 | window.bind("One") do (e: Event):
75 | # JavaScript:
76 | # webui.call('One', 'Hello', 'World`);
77 |
78 | let
79 | str1 = e.getString()
80 | str2 = e.getString(1)
81 |
82 | echo "function_one: ", str1 # Hello
83 | echo "function_one: ", str2 # World
84 |
85 | window.bind("Two") do (e: Event):
86 | # JavaScript:
87 | # webui.call('Two', 123, 456, 789);
88 |
89 | let
90 | number1 = e.getInt()
91 | number2 = e.getInt(1)
92 | number3 = e.getInt(2)
93 |
94 | echo "function_two: ", number1 # 123
95 | echo "function_two: ", number2 # 456
96 | echo "function_two: ", number3 # 789
97 |
98 | window.bind("Three") do (e: Event):
99 | # JavaScript:
100 | # webui.call('MyID_Three', true, false);
101 |
102 | let
103 | status1 = e.getBool()
104 | status2 = e.getBool(1)
105 |
106 | echo "function_three: ", status1 # true
107 | echo "function_three: ", status2 # false
108 |
109 | window.bind("Four") do (e: Event) -> int:
110 | # JavaScript:
111 | # webui.call('Four', number, 2).then(...)
112 |
113 | let
114 | number = e.getInt()
115 | times = e.getInt(1)
116 |
117 | result = number * times
118 |
119 | echo "function_four: ", number, " * ", times, " = ", result
120 |
121 | # result is sent back to Javascript for you
122 |
123 | window.bind("RawBinary") do (e: Event):
124 | # JavaScript:
125 | # webui.call('RawBinary', new Uint8Array([0x41]), new Uint8Array([0x42, 0x43]));
126 |
127 | let
128 | raw1 = e.getString()
129 | raw2 = e.getString(1)
130 |
131 | len1 = e.getSize()
132 | len2 = e.getSize(1)
133 |
134 | # print raw1
135 | echo "function_raw_binary 1 (", len1, " bytes): ", raw1
136 |
137 | # check raw2 (Big)
138 | if raw2[0] == chr(0xa1) and raw2[^1] == chr(0xa2):
139 | echo "function_raw_binary 2 (", len2, " bytes): valid data? ", "Yes"
140 | else:
141 | echo "function_raw_binary 2 (", len2, " bytes): valid data? ", "No"
142 |
143 | # Show the window
144 | window.show(html)
145 |
146 | # Wait until all windows get closed
147 | wait()
148 |
149 | # Free all memory resources (Optional)
150 | clean()
151 |
152 | main()
153 |
--------------------------------------------------------------------------------
/examples/custom_web_server/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Custom Web-Server Example (Nim)
11 |
12 | This HTML page is handled by a custom Web-Server other than WebUI.
13 | This window is connected to the back-end because we used:
http://localhost:8081/webui.js14 | 15 |
Simple link example (Local file)
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /examples/custom_web_server/main.nim: -------------------------------------------------------------------------------- 1 | 2 | import webui 3 | 4 | proc main = 5 | # Create new windows 6 | let window = newWindow() 7 | 8 | # Bind all events 9 | window.bind("") do (e: Event): 10 | # This function gets called every time 11 | # there is an event 12 | 13 | case e.eventType 14 | of weConnected: 15 | echo "Connected" 16 | of weDisconnected: 17 | echo "Disconnected" 18 | of weMouseClick: 19 | echo "Click" 20 | of weNavigation: 21 | let url = e.getString() 22 | echo "Starting navigation to: ", url 23 | 24 | # Because we used `window.bind("")` 25 | # WebUI will block all `href` link clicks and sent here instead. 26 | # We can then control the behavior of links as needed. 27 | 28 | e.window.navigate(url) 29 | else: 30 | discard 31 | 32 | # Bind HTML elements with Nim function 33 | window.bind("my_backend_func") do (e: Event): 34 | let 35 | number1 = e.getInt(0) 36 | number2 = e.getInt(1) 37 | number3 = e.getInt(2) 38 | 39 | echo "my_backend_func 1: ", number1 # 123 40 | echo "my_backend_func 2: ", number2 # 456 41 | echo "my_backend_func 3: ", number3 # 789 42 | 43 | # Set web server network port WebUI should use 44 | # this means `webui.js` will be available at: 45 | # http://localhost:8081/webui.js 46 | window.port = 8081 47 | 48 | # Show a new window and show our custom web server 49 | # Assuming the custom web server is running on port 50 | # 8080... 51 | window.show("http://localhost:8080") 52 | 53 | # Wait until all windows get closed 54 | wait() 55 | 56 | # Free all memory resources (Optional) 57 | clean() 58 | 59 | main() -------------------------------------------------------------------------------- /examples/custom_web_server/second.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 |This is the second page !
11 |Back
12 | 13 | 14 | -------------------------------------------------------------------------------- /examples/custom_web_server/server.nim: -------------------------------------------------------------------------------- 1 | import std/asynchttpserver 2 | import std/asyncdispatch 3 | 4 | proc main {.async.} = 5 | var server = newAsyncHttpServer() 6 | 7 | proc cb(req: Request) {.async.} = 8 | # echo (req.reqMethod, req.url, req.headers) 9 | 10 | let headers = {"Content-type": "text/plain; charset=utf-8"} 11 | await req.respond(Http200, "Hello World", headers.newHttpHeaders()) 12 | 13 | server.listen(Port(8080)) 14 | 15 | while true: 16 | if server.shouldAcceptRequest(): 17 | await server.acceptRequest(cb) 18 | else: 19 | await sleepAsync(500) 20 | 21 | waitFor main() -------------------------------------------------------------------------------- /examples/hello_world.nim: -------------------------------------------------------------------------------- 1 | import webui 2 | 3 | # HTML 4 | const loginHtml = """ 5 | 6 | 7 | 8 |WebUI 2 - Nim Example
27 | 28 |29 | 30 | 31 | 32 |
33 |
34 |
35 | 36 | - 37 | 38 | 39 | """ 40 | 41 | const dashboardHtml = """ 42 | 43 | 44 | 45 |
Welcome !
64 | 65 |66 |
67 | 68 | 69 | 70 | 71 | """ 72 | 73 | proc main = 74 | # Create a window 75 | let window = newWindow() 76 | 77 | window.bind("CheckPassword") do (e: Event): # Check the password function 78 | 79 | # This function gets called every time the user clicks on "MyButton1" 80 | 81 | # Run the JavaScript on the UI (Web Browser) 82 | var js = e.window.script("return document.getElementById(\"MyInput\").value;") 83 | 84 | # Check if there is any JavaScript error 85 | if js.error: 86 | echo "JavaScript Error: ", js.data 87 | return 88 | 89 | # Get the password 90 | let password = js.data 91 | 92 | # Check the password 93 | if password == "123456": 94 | # Correct password 95 | 96 | echo "Password is correct." 97 | e.window.show(dashboardHtml) 98 | else: 99 | # Wrong password 100 | 101 | echo "Wrong password: ", password 102 | 103 | discard e.window.script("document.getElementById('err').innerHTML = 'Sorry. Wrong password';") 104 | 105 | window.bind("Exit") do (_: Event): 106 | # Close all opened windows 107 | 108 | webui.exit() 109 | 110 | # Show the window 111 | window.show(loginHtml) 112 | 113 | # Wait until all windows get closed 114 | wait() 115 | 116 | main() 117 | -------------------------------------------------------------------------------- /examples/hello_world_c.nim: -------------------------------------------------------------------------------- 1 | import webui 2 | 3 | # HTML 4 | const html = """ 5 | 6 | 7 | 8 | 9 | 10 |
WebUI 2 - Nim Example
42 | 43 |44 | 45 | 46 | 47 |
48 |
49 | 50 | - 51 | 52 | 53 | """ 54 | 55 | proc main = 56 | # Create a window 57 | let window = newWindow() 58 | 59 | window.bind("MyButton1") do (e: Event): # Check the password function 60 | 61 | # This function gets called every time the user clicks on "MyButton1" 62 | 63 | # Run the JavaScript on the UI (Web Browser) 64 | var js = e.window.script("return document.getElementById('MyInput').value;") 65 | 66 | # Check if there is any JavaScript error 67 | if js.error: 68 | echo "JavaScript Error: ", js.data 69 | return 70 | 71 | # Get the password 72 | let password = js.data 73 | echo "Password: ", password 74 | 75 | # Check the password 76 | if password == "123456": 77 | # Correct password 78 | 79 | discard e.window.script("alert('Good. Password is correct.')") 80 | else: 81 | # Wrong password 82 | 83 | discard e.window.script("alert('Sorry. Wrong password.')") 84 | 85 | window.bind("MyButton2") do (_: Event): 86 | # Close all opened windows 87 | 88 | webui.exit() 89 | 90 | # Show the window 91 | window.show(html) 92 | 93 | # Wait until all windows get closed 94 | wait() 95 | 96 | main() 97 | -------------------------------------------------------------------------------- /examples/minimal.nim: -------------------------------------------------------------------------------- 1 | import webui 2 | 3 | let window = newWindow() # Create a new Window 4 | window.show(" Hello World ! ") # Show the window with html content 5 | 6 | wait() # Wait until the window gets closed -------------------------------------------------------------------------------- /examples/nim.cfg: -------------------------------------------------------------------------------- 1 | # markAndSweep & refc need --threads:off. everything else needs --threads:on 2 | --threads:on 3 | --path:".." 4 | --mm:orc 5 | 6 | # -d:useWebuiDll 7 | # -d:release -------------------------------------------------------------------------------- /examples/public_network_access.nim: -------------------------------------------------------------------------------- 1 | import webui 2 | 3 | const 4 | privateHtml = """ 5 | 6 | 7 | 8 | 9 | 10 |
WebUI - Public Network Access Example
40 |41 | The second public window is configured to be accessible from
42 | any device in the public network.
43 |
44 | Second public window link:
45 |
...
46 | Second public window events:47 | 48 |
49 | 50 | 51 | 52 | """ 53 | 54 | publicHtml = """ 55 | 56 | 57 | 58 | 59 | 60 |
Welcome to Public UI!
64 | 65 | 66 | """ 67 | 68 | proc main = 69 | let # Create windows 70 | private_window = newWindow() 71 | public_window = newWindow() 72 | 73 | # App 74 | setTimeout(0) # Wait forever (never timeout) 75 | 76 | # Public Window 77 | public_window.public = true # Make URL accessible from public networks 78 | public_window.bind("") do (e: Event): # Bind all events 79 | if e.eventType == weConnected: 80 | private_window.run("document.getElementById('Logs').value += 'New connection.\\n';") 81 | elif e.eventType == weDisconnected: 82 | private_window.run("document.getElementById('Logs').value += 'Disconnected.\\n';") 83 | 84 | public_window.show(publicHtml, wbNoBrowser) # Set public window HTML 85 | let public_win_url = public_window.url # Get URL of public window 86 | 87 | # Main Private Window 88 | private_window.bind("Exit") do (_: Event): # Bind exit button 89 | exit() 90 | 91 | private_window.show(privateHtml) # Show the window 92 | 93 | # Set URL in the UI 94 | private_window.run("document.getElementById('urlSpan').innerHTML = '" & public_win_url & "';") 95 | 96 | # Wait until all windows get closed 97 | wait() 98 | 99 | # Free all memory resources (Optional) 100 | clean() 101 | 102 | main() 103 | -------------------------------------------------------------------------------- /examples/qxexample/README.md: -------------------------------------------------------------------------------- 1 | **qxexample** is an example of a simple console application with two-way binding. 2 | 3 | Nim rewrite of the same example in [Free Pascal](https://github.com/webui-dev/pascal-webui/tree/main/examples/qxexample) 4 | 5 | [Qooxdoo](https://github.com/qooxdoo/qooxdoo) universal JavaScript framework is used to generate the interface in the browser. 6 | 7 |  8 | -------------------------------------------------------------------------------- /examples/qxexample/data_binding.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/data_binding.png -------------------------------------------------------------------------------- /examples/qxexample/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 38 | 39 |
13 |
24 |
25 |
26 |
27 |
--------------------------------------------------------------------------------
/examples/qxexample/qxexample.nim:
--------------------------------------------------------------------------------
1 | import std/strutils
2 | import std/os
3 |
4 | import webui
5 |
6 | const
7 | html = """
8 |
9 |
10 |
11 |
12 |
25 |
26 |
27 | """
28 |
29 | var counter: int
30 |
31 | proc main() =
32 | let window = newWindow()
33 |
34 | window.bind("Button1Click") do (e: Event) -> string:
35 | echo "Received callback: ", e.getString()
36 | inc counter
37 |
38 | return """{"label1": "Message from Nim", "label2": "$1"}""" % $counter
39 |
40 | window.rootFolder = currentSourcePath().parentDir()
41 |
42 | window.show(html)
43 |
44 | wait()
45 |
46 | main()
--------------------------------------------------------------------------------
/examples/qxexample/resource/myapp/app.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/myapp/app.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/myapp/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/myapp/favicon.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/myapp/js_256x256.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/myapp/js_256x256.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/myapp/test.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/myapp/test.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows-combined.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows-combined.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/arrows/down-invert.gif": [7, 4, "gif", "qx/decoration/Classic/arrows-combined.gif", -38, 0], "qx/decoration/Classic/arrows/down-small-invert.gif": [5, 3, "gif", "qx/decoration/Classic/arrows-combined.gif", -87, 0], "qx/decoration/Classic/arrows/down-small.gif": [5, 3, "gif", "qx/decoration/Classic/arrows-combined.gif", -53, 0], "qx/decoration/Classic/arrows/down.gif": [7, 4, "gif", "qx/decoration/Classic/arrows-combined.gif", -113, 0], "qx/decoration/Classic/arrows/forward-invert.gif": [8, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -30, 0], "qx/decoration/Classic/arrows/forward.gif": [8, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -18, 0], "qx/decoration/Classic/arrows/left-invert.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -92, 0], "qx/decoration/Classic/arrows/left-small-invert.gif": [3, 5, "gif", "qx/decoration/Classic/arrows-combined.gif", -58, 0], "qx/decoration/Classic/arrows/left-small.gif": [3, 5, "gif", "qx/decoration/Classic/arrows-combined.gif", -15, 0], "qx/decoration/Classic/arrows/left.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -120, 0], "qx/decoration/Classic/arrows/next-invert.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -80, 0], "qx/decoration/Classic/arrows/next.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -109, 0], "qx/decoration/Classic/arrows/previous-invert.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -69, 0], "qx/decoration/Classic/arrows/previous.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -65, 0], "qx/decoration/Classic/arrows/rewind-invert.gif": [8, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -45, 0], "qx/decoration/Classic/arrows/rewind.gif": [8, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -101, 0], "qx/decoration/Classic/arrows/right-invert.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -61, 0], "qx/decoration/Classic/arrows/right-small-invert.gif": [3, 5, "gif", "qx/decoration/Classic/arrows-combined.gif", 0, 0], "qx/decoration/Classic/arrows/right-small.gif": [3, 5, "gif", "qx/decoration/Classic/arrows-combined.gif", -84, 0], "qx/decoration/Classic/arrows/right.gif": [4, 7, "gif", "qx/decoration/Classic/arrows-combined.gif", -26, 0], "qx/decoration/Classic/arrows/up-invert.gif": [7, 4, "gif", "qx/decoration/Classic/arrows-combined.gif", -73, 0], "qx/decoration/Classic/arrows/up-small-invert.gif": [5, 3, "gif", "qx/decoration/Classic/arrows-combined.gif", -96, 0], "qx/decoration/Classic/arrows/up-small.gif": [5, 3, "gif", "qx/decoration/Classic/arrows-combined.gif", -3, 0], "qx/decoration/Classic/arrows/up.gif": [7, 4, "gif", "qx/decoration/Classic/arrows-combined.gif", -8, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/down-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/down-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/down-small-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/down-small-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/down-small.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/down-small.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/down.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/down.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/forward-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/forward-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/forward.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/forward.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/left-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/left-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/left-small-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/left-small-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/left-small.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/left-small.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/left.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/left.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/next-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/next-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/next.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/next.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/previous-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/previous-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/previous.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/previous.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/rewind-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/rewind-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/rewind.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/rewind.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/right-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/right-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/right-small-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/right-small-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/right-small.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/right-small.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/right.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/right.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/up-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/up-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/up-small-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/up-small-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/up-small.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/up-small.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/arrows/up.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/arrows/up.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/checkbox-radiobutton-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/form/checkbox-checked-disabled.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -336, 0], "qx/decoration/Classic/form/checkbox-checked-focused-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -28, 0], "qx/decoration/Classic/form/checkbox-checked-focused.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -462, 0], "qx/decoration/Classic/form/checkbox-checked-hovered-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -112, 0], "qx/decoration/Classic/form/checkbox-checked-hovered.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -140, 0], "qx/decoration/Classic/form/checkbox-checked-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -98, 0], "qx/decoration/Classic/form/checkbox-checked-pressed-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -308, 0], "qx/decoration/Classic/form/checkbox-checked-pressed.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", 0, 0], "qx/decoration/Classic/form/checkbox-checked.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -266, 0], "qx/decoration/Classic/form/checkbox-disabled.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -84, 0], "qx/decoration/Classic/form/checkbox-focused-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -476, 0], "qx/decoration/Classic/form/checkbox-focused.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -392, 0], "qx/decoration/Classic/form/checkbox-hovered-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -196, 0], "qx/decoration/Classic/form/checkbox-hovered.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -154, 0], "qx/decoration/Classic/form/checkbox-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -350, 0], "qx/decoration/Classic/form/checkbox-pressed-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -448, 0], "qx/decoration/Classic/form/checkbox-pressed.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -70, 0], "qx/decoration/Classic/form/checkbox.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -490, 0], "qx/decoration/Classic/form/radiobutton-checked-disabled.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -210, 0], "qx/decoration/Classic/form/radiobutton-checked-focused-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -406, 0], "qx/decoration/Classic/form/radiobutton-checked-focused.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -378, 0], "qx/decoration/Classic/form/radiobutton-checked-hovered-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -252, 0], "qx/decoration/Classic/form/radiobutton-checked-hovered.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -182, 0], "qx/decoration/Classic/form/radiobutton-checked-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -294, 0], "qx/decoration/Classic/form/radiobutton-checked-pressed-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -420, 0], "qx/decoration/Classic/form/radiobutton-checked-pressed.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -56, 0], "qx/decoration/Classic/form/radiobutton-checked.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -322, 0], "qx/decoration/Classic/form/radiobutton-disabled.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -364, 0], "qx/decoration/Classic/form/radiobutton-focused-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -434, 0], "qx/decoration/Classic/form/radiobutton-focused.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -168, 0], "qx/decoration/Classic/form/radiobutton-hovered-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -126, 0], "qx/decoration/Classic/form/radiobutton-hovered.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -42, 0], "qx/decoration/Classic/form/radiobutton-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -280, 0], "qx/decoration/Classic/form/radiobutton-pressed-invalid.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -238, 0], "qx/decoration/Classic/form/radiobutton-pressed.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -14, 0], "qx/decoration/Classic/form/radiobutton.png": [14, 14, "png", "qx/decoration/Classic/checkbox-radiobutton-combined.png", -224, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/checkbox-radiobutton-combined.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/checkbox-radiobutton-combined.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/colorselector-combined.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/colorselector-combined.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/colorselector-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/colorselector/brightness-handle.gif": [35, 11, "gif", "qx/decoration/Classic/colorselector-combined.gif", -11, 0], "qx/decoration/Classic/colorselector/huesaturation-handle.gif": [11, 11, "gif", "qx/decoration/Classic/colorselector-combined.gif", 0, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/colorselector/brightness-field.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/colorselector/brightness-field.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/colorselector/brightness-handle.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/colorselector/brightness-handle.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/colorselector/huesaturation-field.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/colorselector/huesaturation-field.jpg
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/colorselector/huesaturation-handle.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/colorselector/huesaturation-handle.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/cursors-combined.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/cursors-combined.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/cursors-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/cursors/alias.gif": [19, 15, "gif", "qx/decoration/Classic/cursors-combined.gif", -52, 0], "qx/decoration/Classic/cursors/copy.gif": [19, 15, "gif", "qx/decoration/Classic/cursors-combined.gif", -20, 0], "qx/decoration/Classic/cursors/move.gif": [13, 9, "gif", "qx/decoration/Classic/cursors-combined.gif", -39, 0], "qx/decoration/Classic/cursors/nodrop.gif": [20, 20, "gif", "qx/decoration/Classic/cursors-combined.gif", 0, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/cursors/alias.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/cursors/alias.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/cursors/copy.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/cursors/copy.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/cursors/move.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/cursors/move.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/cursors/nodrop.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/cursors/nodrop.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-month-invert.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-month-invert.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-month.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-month.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-year-invert.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-year-invert.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-year.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/last-year.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-month-invert.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-month-invert.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-month.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-month.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-year-invert.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-year-invert.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-year.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/datechooser/next-year.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-disabled.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-disabled.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-focused-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-focused-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-focused.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-focused.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-hovered-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-hovered-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-hovered.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-hovered.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-pressed-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-pressed-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-pressed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked-pressed.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-checked.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-disabled.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-disabled.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-focused-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-focused-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-focused.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-focused.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-hovered-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-hovered-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-hovered.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-hovered.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-pressed-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-pressed-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-pressed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-pressed.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-disabled.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-disabled.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-focused-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-focused-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-focused.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-focused.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-hovered-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-hovered-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-hovered.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-hovered.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox-undetermined.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/checkbox.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/checkbox.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-disabled.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-disabled.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-focused-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-focused-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-focused.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-focused.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-hovered-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-hovered-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-hovered.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-hovered.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-pressed-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-pressed-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-pressed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked-pressed.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-checked.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-disabled.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-disabled.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-focused-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-focused-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-focused.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-focused.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-hovered-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-hovered-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-hovered.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-hovered.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-pressed-invalid.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-pressed-invalid.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-pressed.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton-pressed.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/form/radiobutton.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/menu-combined.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/menu-combined.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/menu-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/menu/checkbox-invert.gif": [16, 7, "gif", "qx/decoration/Classic/menu-combined.gif", -16, 0], "qx/decoration/Classic/menu/checkbox.gif": [16, 7, "gif", "qx/decoration/Classic/menu-combined.gif", -32, 0], "qx/decoration/Classic/menu/radiobutton-invert.gif": [16, 5, "gif", "qx/decoration/Classic/menu-combined.gif", 0, 0], "qx/decoration/Classic/menu/radiobutton.gif": [16, 5, "gif", "qx/decoration/Classic/menu-combined.gif", -48, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/menu/checkbox-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/menu/checkbox-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/menu/checkbox.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/menu/checkbox.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/menu/radiobutton-invert.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/menu/radiobutton-invert.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/menu/radiobutton.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/menu/radiobutton.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-lr-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/shadow/shadow-l.png": [15, 382, "png", "qx/decoration/Classic/shadow-lr-combined.png", -15, 0], "qx/decoration/Classic/shadow/shadow-r.png": [15, 382, "png", "qx/decoration/Classic/shadow-lr-combined.png", 0, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-lr-combined.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow-lr-combined.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-small-lr-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/shadow/shadow-small-l.png": [5, 136, "png", "qx/decoration/Classic/shadow-small-lr-combined.png", 0, 0], "qx/decoration/Classic/shadow/shadow-small-r.png": [5, 136, "png", "qx/decoration/Classic/shadow-small-lr-combined.png", -5, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-small-lr-combined.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow-small-lr-combined.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-small-tb-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/shadow/shadow-small-b.png": [5, 5, "png", "qx/decoration/Classic/shadow-small-tb-combined.png", 0, -25], "qx/decoration/Classic/shadow/shadow-small-bl.png": [5, 5, "png", "qx/decoration/Classic/shadow-small-tb-combined.png", 0, -20], "qx/decoration/Classic/shadow/shadow-small-br.png": [5, 5, "png", "qx/decoration/Classic/shadow-small-tb-combined.png", 0, 0], "qx/decoration/Classic/shadow/shadow-small-t.png": [5, 5, "png", "qx/decoration/Classic/shadow-small-tb-combined.png", 0, -5], "qx/decoration/Classic/shadow/shadow-small-tl.png": [5, 5, "png", "qx/decoration/Classic/shadow-small-tb-combined.png", 0, -15], "qx/decoration/Classic/shadow/shadow-small-tr.png": [5, 5, "png", "qx/decoration/Classic/shadow-small-tb-combined.png", 0, -10]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-small-tb-combined.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow-small-tb-combined.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-tb-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/shadow/shadow-b.png": [15, 15, "png", "qx/decoration/Classic/shadow-tb-combined.png", 0, -30], "qx/decoration/Classic/shadow/shadow-bl.png": [15, 15, "png", "qx/decoration/Classic/shadow-tb-combined.png", 0, 0], "qx/decoration/Classic/shadow/shadow-br.png": [15, 15, "png", "qx/decoration/Classic/shadow-tb-combined.png", 0, -60], "qx/decoration/Classic/shadow/shadow-t.png": [15, 15, "png", "qx/decoration/Classic/shadow-tb-combined.png", 0, -75], "qx/decoration/Classic/shadow/shadow-tl.png": [15, 15, "png", "qx/decoration/Classic/shadow-tb-combined.png", 0, -45], "qx/decoration/Classic/shadow/shadow-tr.png": [15, 15, "png", "qx/decoration/Classic/shadow-tb-combined.png", 0, -15]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow-tb-combined.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow-tb-combined.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-b.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-b.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-bl.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-bl.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-br.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-br.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-c.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-c.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-l.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-l.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-r.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-r.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-b.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-b.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-bl.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-bl.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-br.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-br.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-c.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-c.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-l.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-l.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-r.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-r.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-t.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-t.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-tl.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-tl.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-tr.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small-tr.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-small.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-t.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-t.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-tl.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-tl.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-tr.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow-tr.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/shadow/shadow.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/splitpane/knob-horizontal.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/splitpane/knob-horizontal.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/splitpane/knob-vertical.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/splitpane/knob-vertical.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/table/ascending-invert.png": [10, 10, "png", "qx/decoration/Classic/table-combined.png", -62, 0], "qx/decoration/Classic/table/ascending.png": [10, 10, "png", "qx/decoration/Classic/table-combined.png", -52, 0], "qx/decoration/Classic/table/boolean-false.png": [11, 11, "png", "qx/decoration/Classic/table-combined.png", -31, 0], "qx/decoration/Classic/table/boolean-true.png": [11, 11, "png", "qx/decoration/Classic/table-combined.png", -10, 0], "qx/decoration/Classic/table/descending-invert.png": [10, 10, "png", "qx/decoration/Classic/table-combined.png", -42, 0], "qx/decoration/Classic/table/descending.png": [10, 10, "png", "qx/decoration/Classic/table-combined.png", 0, 0], "qx/decoration/Classic/table/select-column-order.png": [10, 9, "png", "qx/decoration/Classic/table-combined.png", -21, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table-combined.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table-combined.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table/ascending-invert.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table/ascending-invert.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table/ascending.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table/ascending.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table/boolean-false.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table/boolean-false.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table/boolean-true.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table/boolean-true.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table/descending-invert.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table/descending-invert.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table/descending.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table/descending.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/table/select-column-order.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/table/select-column-order.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/tree/minus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/tree/minus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/tree/plus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/tree/plus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/cross.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/cross.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/cross_minus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/cross_minus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/cross_plus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/cross_plus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/end.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/end.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/end_minus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/end_minus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/end_plus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/end_plus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/line.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/line.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/only_minus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/only_minus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/only_plus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/only_plus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/start.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/start.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/start_minus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/start_minus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/treevirtual/start_plus.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/treevirtual/start_plus.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/window-captionbar-buttons-combined.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/window-captionbar-buttons-combined.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/window-captionbar-buttons-combined.meta:
--------------------------------------------------------------------------------
1 | {"qx/decoration/Classic/window/close.gif": [10, 9, "gif", "qx/decoration/Classic/window-captionbar-buttons-combined.gif", 0, 0], "qx/decoration/Classic/window/maximize.gif": [9, 9, "gif", "qx/decoration/Classic/window-captionbar-buttons-combined.gif", -10, 0], "qx/decoration/Classic/window/minimize.gif": [9, 9, "gif", "qx/decoration/Classic/window-captionbar-buttons-combined.gif", -19, 0], "qx/decoration/Classic/window/restore.gif": [8, 9, "gif", "qx/decoration/Classic/window-captionbar-buttons-combined.gif", -28, 0]}
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/window/close.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/window/close.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/window/maximize.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/window/maximize.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/window/minimize.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/window/minimize.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/decoration/Classic/window/restore.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/decoration/Classic/window/restore.gif
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/actions/dialog-cancel.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/actions/dialog-cancel.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/actions/dialog-ok.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/actions/dialog-ok.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/actions/view-refresh.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/actions/view-refresh.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/actions/window-close.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/actions/window-close.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/apps/office-calendar.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/apps/office-calendar.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/mimetypes/text-plain.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/mimetypes/text-plain.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/places/folder-open.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/places/folder-open.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/icon/Oxygen/16/places/folder.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/icon/Oxygen/16/places/folder.png
--------------------------------------------------------------------------------
/examples/qxexample/resource/qx/static/blank.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/qxexample/resource/qx/static/blank.gif
--------------------------------------------------------------------------------
/examples/serve_folder/deno_test.ts:
--------------------------------------------------------------------------------
1 | // This file gets called like follow:
2 | // `Index.html` ->
3 | // `http://localhost:xxx/deno_test.ts?foo=123&bar=456` ->
4 | // `deno run --allow-all --unstable "deno_test.ts" "foo=123&bar=456"`
5 |
6 | // Import parse()
7 | import { parse } from 'https://deno.land/std/flags/mod.ts';
8 |
9 | // Get Query (HTTP GET)
10 | const args = parse(Deno.args);
11 | const query = args._[0] as string;
12 |
13 | // Variables
14 | let foo: string = '';
15 | let bar: string = '';
16 |
17 | // Read Query
18 | const params = new URLSearchParams(query);
19 | for (const [key, value] of params.entries()) {
20 | if (key == 'foo') foo = value; // 123
21 | else if (key == 'bar') bar = value; // 456
22 | }
23 |
24 | console.error('foo + bar = ' + (parseInt(foo) + parseInt(bar))); // 579
--------------------------------------------------------------------------------
/examples/serve_folder/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
14 |
23 |
15 |
22 |
16 | 
17 |
18 |
19 | This application requires JavaScript. Please enable it and reload this page. 20 |
21 |
17 | 18 |
19 | This application requires JavaScript. Please enable it and reload this page. 20 |
Serve a Folder Example (Nim)
55 |56 |
57 | You can edit this HTML file as you need.
58 | Also, you can config WebUI to use Deno or Nodejs runtime for your JS/TS files.
59 |
60 | Please click on the link to switch to the second page
61 | Or click on the button to switch to the second page programmatically.
62 |
64 | Click on [deno_test.ts] to interpret the TypeScript file (If deno is installed) 65 |
66 | By a simple HTTP request "deno_test.ts?foo=60&bar=40" 67 |
68 |
69 | 70 |
71 |
Second Page As A Simple Link (Local file)
72 |73 | 74 |
75 |
76 | 77 |
78 |
Static file example (Embedded)
79 |Dynamic file example (Embedded)
80 |
81 | Unicode Test:
82 | مرحبًا
83 |
84 | 你好
85 |
86 | こんにちは
87 |
88 |
This is the second page !
42 |43 | 44 | 45 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /examples/serve_folder/serve_folder.nim: -------------------------------------------------------------------------------- 1 | import std/strformat 2 | import std/os 3 | 4 | import webui 5 | 6 | var 7 | window: Window 8 | window2: Window 9 | 10 | count: int 11 | 12 | proc exitApp(_: Event) = 13 | exit() 14 | 15 | proc main = 16 | # Create new windows 17 | 18 | window = newWindow(1) 19 | window2 = newWindow(2) 20 | 21 | window.bind("SwitchToSecondPage") do (e: Event): 22 | # This function gets called every 23 | # time the user clicks on "SwitchToSecondPage" 24 | 25 | # Switch to `./second.html` in the same opened window. 26 | 27 | e.window.show("second.html") 28 | 29 | window.bind("OpenNewWindow") do (e: Event): 30 | # This function gets called every 31 | # time the user clicks on "OpenNewWindow" 32 | 33 | # Show a new window, and navigate to `/second.html` 34 | # if it's already open, then switch in the same window 35 | 36 | window2.show("second.html") 37 | 38 | window.bind("") do (e: Event): 39 | # This function gets called every time 40 | # there is an event 41 | 42 | case e.eventType: 43 | of weConnected: 44 | echo "Connected" 45 | of weDisconnected: 46 | echo "Disconnected" 47 | of weMouseClick: 48 | echo "Click" 49 | of weNavigation: 50 | echo "Starting navigation to: ", e.getString() 51 | else: 52 | discard 53 | 54 | window.setFileHandler() do (filename: string) -> string: 55 | echo "File: ", filename 56 | 57 | case filename 58 | of "/test.txt": 59 | # Const static file example 60 | # Note: The connection will drop if the content 61 | # does not have `` 62 | 63 | return "This is a embedded file content example." 64 | of "/dynamic.html": 65 | # Dynamic file example 66 | inc count 67 | 68 | return fmt""" 69 | 70 | This is a dynamic file content example. 71 |
72 | Count: {count} [Refresh] 73 |
74 | 75 | 76 | 77 | """ 78 | 79 | # By default, this function returns an empty string 80 | # returning an empty string will make WebUI look for 81 | # the requested file locally 82 | 83 | window.bind("Exit", exitApp) 84 | window2.bind("Exit", exitApp) 85 | 86 | # Make Deno as the `.ts` and `.js` interpreter 87 | window.runtime = wrDeno 88 | 89 | # Set root folder to current directory 90 | window.rootFolder = currentSourcePath().parentDir() 91 | window2.rootFolder = currentSourcePath().parentDir() 92 | 93 | # Set window size 94 | window.setSize(800, 600) 95 | 96 | # Set window position 97 | window.setPosition(100, 100) 98 | 99 | # Show a new window 100 | window.show("index.html") 101 | 102 | # Wait until all windows get closed 103 | wait() 104 | 105 | main() 106 | -------------------------------------------------------------------------------- /examples/serve_folder/serve_folder.nim.cfg: -------------------------------------------------------------------------------- 1 | --path:"../.." -------------------------------------------------------------------------------- /examples/text_editor/src/nim.cfg: -------------------------------------------------------------------------------- 1 | --threads:on 2 | --app:gui 3 | --mm:orc 4 | 5 | -d:release -------------------------------------------------------------------------------- /examples/text_editor/src/text_editor.nim: -------------------------------------------------------------------------------- 1 | import std/strutils 2 | import std/os 3 | 4 | import os_files/dialog 5 | import webui 6 | 7 | var 8 | filePath: string 9 | 10 | proc main = 11 | let window = newWindow() 12 | 13 | window.bind("Open") do (e: Event): 14 | var di: DialogInfo 15 | 16 | di.kind = dkOpenFile 17 | di.title = "Text Editor" 18 | di.filters = @[ 19 | (name: "Text files", ext: "*.txt"), 20 | (name: "HTML/XHTML source files", ext: "*.html;*.html;*.xhtml"), 21 | (name: "Javascript Files", ext: "*.js;*.jsx;*.ts;*.tsx"), 22 | (name: "Stylesheets", ext: "*.css;*.less;*.sass;*.scss;*.styl;*.bass"), 23 | (name: "Nim source files", ext: "*.nim;*.nims;*.nimble;*.nimf;nim.cfg;nimdoc.cfg"), 24 | (name: "Any file", ext: "*") 25 | ] 26 | 27 | let tfp = di.show() 28 | 29 | if tfp.len == 0: 30 | return 31 | else: 32 | filePath = tfp 33 | 34 | e.window.run("addText('$1')" % encode(readFile(filePath))) 35 | e.window.run("SetFile('$1')" % encode(filePath)) 36 | 37 | window.bind("Save") do (e: Event): 38 | writeFile(filePath, e.getString()) 39 | 40 | window.bind("Close") do (_: Event): 41 | echo "Exit." 42 | 43 | exit() 44 | 45 | # Set root folder 46 | window.rootFolder = currentSourcePath().parentDir() / "ui" 47 | 48 | window.show("MainWindow.html") 49 | 50 | wait() 51 | 52 | main() 53 | -------------------------------------------------------------------------------- /examples/text_editor/src/ui/MainWindow.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 |
38 |
39 |
40 |
41 |
48 |
49 |
50 |
51 |
52 |
--------------------------------------------------------------------------------
/examples/text_editor/src/ui/css/codemirror.min.css:
--------------------------------------------------------------------------------
1 | .CodeMirror{font-family:monospace;height:300px;color:#000;direction:ltr}.CodeMirror-lines{padding:4px 0}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{padding:0 4px}.CodeMirror-gutter-filler,.CodeMirror-scrollbar-filler{background-color:#fff}.CodeMirror-gutters{border-right:1px solid #ddd;background-color:#f7f7f7;white-space:nowrap}.CodeMirror-linenumber{padding:0 3px 0 5px;min-width:20px;text-align:right;color:#999;white-space:nowrap}.CodeMirror-guttermarker{color:#000}.CodeMirror-guttermarker-subtle{color:#999}.CodeMirror-cursor{border-left:1px solid #000;border-right:none;width:0}.CodeMirror div.CodeMirror-secondarycursor{border-left:1px solid silver}.cm-fat-cursor .CodeMirror-cursor{width:auto;border:0!important;background:#7e7}.cm-fat-cursor div.CodeMirror-cursors{z-index:1}.cm-fat-cursor .CodeMirror-line::selection,.cm-fat-cursor .CodeMirror-line>span::selection,.cm-fat-cursor .CodeMirror-line>span>span::selection{background:0 0}.cm-fat-cursor .CodeMirror-line::-moz-selection,.cm-fat-cursor .CodeMirror-line>span::-moz-selection,.cm-fat-cursor .CodeMirror-line>span>span::-moz-selection{background:0 0}.cm-fat-cursor{caret-color:transparent}@-moz-keyframes blink{50%{background-color:transparent}}@-webkit-keyframes blink{50%{background-color:transparent}}@keyframes blink{50%{background-color:transparent}}.cm-tab{display:inline-block;text-decoration:inherit}.CodeMirror-rulers{position:absolute;left:0;right:0;top:-50px;bottom:0;overflow:hidden}.CodeMirror-ruler{border-left:1px solid #ccc;top:0;bottom:0;position:absolute}.cm-s-default .cm-header{color:#00f}.cm-s-default .cm-quote{color:#090}.cm-negative{color:#d44}.cm-positive{color:#292}.cm-header,.cm-strong{font-weight:700}.cm-em{font-style:italic}.cm-link{text-decoration:underline}.cm-strikethrough{text-decoration:line-through}.cm-s-default .cm-keyword{color:#708}.cm-s-default .cm-atom{color:#219}.cm-s-default .cm-number{color:#164}.cm-s-default .cm-def{color:#00f}.cm-s-default .cm-variable-2{color:#05a}.cm-s-default .cm-type,.cm-s-default .cm-variable-3{color:#085}.cm-s-default .cm-comment{color:#a50}.cm-s-default .cm-string{color:#a11}.cm-s-default .cm-string-2{color:#f50}.cm-s-default .cm-meta{color:#555}.cm-s-default .cm-qualifier{color:#555}.cm-s-default .cm-builtin{color:#30a}.cm-s-default .cm-bracket{color:#997}.cm-s-default .cm-tag{color:#170}.cm-s-default .cm-attribute{color:#00c}.cm-s-default .cm-hr{color:#999}.cm-s-default .cm-link{color:#00c}.cm-s-default .cm-error{color:red}.cm-invalidchar{color:red}.CodeMirror-composing{border-bottom:2px solid}div.CodeMirror span.CodeMirror-matchingbracket{color:#0b0}div.CodeMirror span.CodeMirror-nonmatchingbracket{color:#a22}.CodeMirror-matchingtag{background:rgba(255,150,0,.3)}.CodeMirror-activeline-background{background:#e8f2ff}.CodeMirror{position:relative;overflow:hidden;background:#fff}.CodeMirror-scroll{overflow:scroll!important;margin-bottom:-50px;margin-right:-50px;padding-bottom:50px;height:100%;outline:0;position:relative;z-index:0}.CodeMirror-sizer{position:relative;border-right:50px solid transparent}.CodeMirror-gutter-filler,.CodeMirror-hscrollbar,.CodeMirror-scrollbar-filler,.CodeMirror-vscrollbar{position:absolute;z-index:6;display:none;outline:0}.CodeMirror-vscrollbar{right:0;top:0;overflow-x:hidden;overflow-y:scroll}.CodeMirror-hscrollbar{bottom:0;left:0;overflow-y:hidden;overflow-x:scroll}.CodeMirror-scrollbar-filler{right:0;bottom:0}.CodeMirror-gutter-filler{left:0;bottom:0}.CodeMirror-gutters{position:absolute;left:0;top:0;min-height:100%;z-index:3}.CodeMirror-gutter{white-space:normal;height:100%;display:inline-block;vertical-align:top;margin-bottom:-50px}.CodeMirror-gutter-wrapper{position:absolute;z-index:4;background:0 0!important;border:none!important}.CodeMirror-gutter-background{position:absolute;top:0;bottom:0;z-index:4}.CodeMirror-gutter-elt{position:absolute;cursor:default;z-index:4}.CodeMirror-gutter-wrapper ::selection{background-color:transparent}.CodeMirror-gutter-wrapper ::-moz-selection{background-color:transparent}.CodeMirror-lines{cursor:text;min-height:1px}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;border-width:0;background:0 0;font-family:inherit;font-size:inherit;margin:0;white-space:pre;word-wrap:normal;line-height:inherit;color:inherit;z-index:2;position:relative;overflow:visible;-webkit-tap-highlight-color:transparent;-webkit-font-variant-ligatures:contextual;font-variant-ligatures:contextual}.CodeMirror-wrap pre.CodeMirror-line,.CodeMirror-wrap pre.CodeMirror-line-like{word-wrap:break-word;white-space:pre-wrap;word-break:normal}.CodeMirror-linebackground{position:absolute;left:0;right:0;top:0;bottom:0;z-index:0}.CodeMirror-linewidget{position:relative;z-index:2;padding:.1px}.CodeMirror-rtl pre{direction:rtl}.CodeMirror-code{outline:0}.CodeMirror-gutter,.CodeMirror-gutters,.CodeMirror-linenumber,.CodeMirror-scroll,.CodeMirror-sizer{-moz-box-sizing:content-box;box-sizing:content-box}.CodeMirror-measure{position:absolute;width:100%;height:0;overflow:hidden;visibility:hidden}.CodeMirror-cursor{position:absolute;pointer-events:none}.CodeMirror-measure pre{position:static}div.CodeMirror-cursors{visibility:hidden;position:relative;z-index:3}div.CodeMirror-dragcursors{visibility:visible}.CodeMirror-focused div.CodeMirror-cursors{visibility:visible}.CodeMirror-selected{background:#d9d9d9}.CodeMirror-focused .CodeMirror-selected{background:#d7d4f0}.CodeMirror-crosshair{cursor:crosshair}.CodeMirror-line::selection,.CodeMirror-line>span::selection,.CodeMirror-line>span>span::selection{background:#d7d4f0}.CodeMirror-line::-moz-selection,.CodeMirror-line>span::-moz-selection,.CodeMirror-line>span>span::-moz-selection{background:#d7d4f0}.cm-searching{background-color:#ffa;background-color:rgba(255,255,0,.4)}.cm-force-border{padding-right:.1px}@media print{.CodeMirror div.CodeMirror-cursors{visibility:hidden}}.cm-tab-wrap-hack:after{content:''}span.CodeMirror-selectedtext{background:0 0}
--------------------------------------------------------------------------------
/examples/text_editor/src/ui/css/lucario.css:
--------------------------------------------------------------------------------
1 | /*
2 | Name: lucario
3 | Author: Raphael Amorim
4 | Original Lucario color scheme (https://github.com/raphamorim/lucario)
5 | Modified for WebUI Text Editor.
6 | */
7 |
8 | .cm-s-lucario.CodeMirror, .cm-s-lucario .CodeMirror-gutters {
9 | /* background-color: #2b3e50 !important; */
10 | color: #f8f8f2 !important;
11 | border: none;
12 | background: #f8f9fa !important;
13 | background-color: rgba(0, 0, 0, .0) !important;
14 | }
15 | .cm-s-lucario .CodeMirror-gutters { color: #2b3e50; }
16 | .cm-s-lucario .CodeMirror-cursor { border-left: solid thin #E6C845; }
17 | .cm-s-lucario .CodeMirror-linenumber { color: #f8f8f2; background-color: rgba(0, 0, 0, .2) !important; }
18 | .cm-s-lucario .CodeMirror-selected { background: #243443; }
19 | .cm-s-lucario .CodeMirror-line::selection, .cm-s-lucario .CodeMirror-line > span::selection, .cm-s-lucario .CodeMirror-line > span > span::selection { background: #243443; }
20 | .cm-s-lucario .CodeMirror-line::-moz-selection, .cm-s-lucario .CodeMirror-line > span::-moz-selection, .cm-s-lucario .CodeMirror-line > span > span::-moz-selection { background: #243443; }
21 | .cm-s-lucario span.cm-comment { color: #5c98cd; }
22 | .cm-s-lucario span.cm-string, .cm-s-lucario span.cm-string-2 { color: #E6DB74; }
23 | .cm-s-lucario span.cm-number { color: #ca94ff; }
24 | .cm-s-lucario span.cm-variable { color: #f8f8f2; }
25 | .cm-s-lucario span.cm-variable-2 { color: #f8f8f2; }
26 | .cm-s-lucario span.cm-def { color: #72C05D; }
27 | .cm-s-lucario span.cm-operator { color: #66D9EF; }
28 | .cm-s-lucario span.cm-keyword { color: #ff6541; }
29 | .cm-s-lucario span.cm-atom { color: #bd93f9; }
30 | .cm-s-lucario span.cm-meta { color: #f8f8f2; }
31 | .cm-s-lucario span.cm-tag { color: #ff6541; }
32 | .cm-s-lucario span.cm-attribute { color: #66D9EF; }
33 | .cm-s-lucario span.cm-qualifier { color: #72C05D; }
34 | .cm-s-lucario span.cm-property { color: #f8f8f2; }
35 | .cm-s-lucario span.cm-builtin { color: #72C05D; }
36 | .cm-s-lucario span.cm-variable-3, .cm-s-lucario span.cm-type { color: #ffb86c; }
37 | .cm-s-lucario .CodeMirror-activeline-background { background: #243443; }
38 | .cm-s-lucario .CodeMirror-matchingbracket { text-decoration: underline; color: white !important; }
39 | .cm-s-lucario .CodeMirror-scroll { overflow: hidden; }
40 |
--------------------------------------------------------------------------------
/examples/text_editor/src/ui/css/style.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | padding: 0;
4 | height: 100vh;
5 | font-family: 'Courier New', Courier, monospace;
6 | background-image: linear-gradient(to right top, #8e44ad 0%, #3498db 100%);
7 | background-repeat: no-repeat;
8 | background-position: center center;
9 | background-size: cover;
10 | background-attachment : fixed;
11 | color: #ddecf9;
12 | }
13 |
14 | .topbar {
15 | width: 100%;
16 | height: 4px;
17 | background-image: linear-gradient(to right, #4ed2e7 0%, #db57eb 50%, #f98818 100%);
18 | }
19 |
20 | header {
21 | color: #fff;
22 | }
23 |
24 | /* Nav */
25 |
26 | nav {
27 | margin: 0 auto;
28 | padding: 0px;
29 | text-shadow: 1px 1px 2px #000000;
30 | position: relative;
31 | z-index: 99;
32 | font-family: 'Font Awesome 5 Free';
33 | font-size: 18px;
34 | }
35 |
36 | nav ul {
37 | margin-top: 0px;
38 | margin-bottom: 0px;
39 | text-align: center;
40 | background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.2) 25%, rgba(255, 255, 255, 0.2) 75%, rgba(255, 255, 255, 0) 100%);
41 | box-shadow: 0 0 25px rgba(0, 0, 0, 0.1), inset 0 0 1px rgba(255, 255, 255, 0.6);
42 | cursor: pointer;
43 | }
44 |
45 | nav ul li {
46 | display: inline-block;
47 | }
48 |
49 | nav ul li a {
50 | padding: 18px;
51 | font-family: "Open Sans";
52 | text-transform:uppercase;
53 | text-decoration: none;
54 | display: block;
55 | }
56 |
57 | nav ul li a:hover {
58 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.1), inset 0 0 1px rgba(255, 255, 255, 0.6);
59 | background: rgba(255, 255, 255, 0.1);
60 | }
61 |
62 | /* Code */
63 |
64 | .main {
65 | padding: 0px;
66 | }
67 |
68 | /* About */
69 |
70 | .about-box {
71 | display: none;
72 | position: fixed;
73 | z-index: 1;
74 | left: 0;
75 | top: 0;
76 | width: 100%;
77 | height: 100%;
78 | background-image: linear-gradient(to right top, #8e44ad 0%, #3498db 100%);
79 | }
80 |
81 | .about-box-content {
82 | background-image: linear-gradient(to right top, #8e44ad 0%, #3498db 100%);
83 | position: absolute;
84 | margin: 0;
85 | padding: 10px;
86 | width: 30%;
87 | border-radius: 5px;
88 | top: 50%;
89 | left: 50%;
90 | transform: translate(-50%, -50%);
91 | }
92 |
93 | .about-box-content h1 {
94 | text-align: center;
95 | }
96 |
97 | .about-box-content a {
98 | color: inherit;
99 | }
100 |
101 | .CodeMirror {
102 | height: 100%;
103 | font-family: 'Courier New', Courier, monospace;
104 | font-size: 16px;
105 | text-shadow: 1px 1px 2px #000000;
106 | }
107 |
108 | .CodeMirror-scroll {
109 |
110 | }
111 |
--------------------------------------------------------------------------------
/examples/text_editor/src/ui/img/icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/examples/text_editor/src/ui/img/icon.png
--------------------------------------------------------------------------------
/examples/text_editor/src/ui/js/javascript.min.js:
--------------------------------------------------------------------------------
1 | !function(e){"object"==typeof exports&&"object"==typeof module?e(require("../../lib/codemirror")):"function"==typeof define&&define.amd?define(["../../lib/codemirror"],e):e(CodeMirror)}(function(rt){"use strict";rt.defineMode("javascript",function(e,l){var t,r,O,P,f=e.indentUnit,N=l.statementIndent,U=l.jsonld,o=l.json||U,W=!1!==l.trackScope,u=l.typescript,B=l.wordCharacters||/[\w$\xa1-\uffff]/,F=(e=n("keyword a"),t=n("keyword b"),r=n("keyword c"),O=n("keyword d"),P=n("operator"),{if:n("if"),while:e,with:e,else:t,do:t,try:t,finally:t,return:O,break:O,continue:O,new:n("new"),delete:r,void:r,throw:r,debugger:n("debugger"),var:n("var"),const:n("var"),let:n("var"),function:n("function"),catch:n("catch"),for:n("for"),switch:n("switch"),case:n("case"),default:n("default"),in:P,typeof:P,instanceof:P,true:e={type:"atom",style:"atom"},false:e,null:e,undefined:e,NaN:e,Infinity:e,this:n("this"),class:n("class"),super:n("atom"),yield:r,export:n("export"),import:n("import"),extends:r,await:r});function n(e){return{type:e,style:"keyword"}}var H,D,G=/[+\-*&%=<>!?|~^@]/,J=/^@(context|id|value|language|type|container|list|set|reverse|index|base|vocab|graph)"/;function i(e,t,r){return H=e,D=r,t}function d(e,t){var a,r=e.next();if('"'==r||"'"==r)return t.tokenize=(a=r,function(e,t){var r,n=!1;if(U&&"@"==e.peek()&&e.match(J))return t.tokenize=d,i("jsonld-keyword","meta");for(;null!=(r=e.next())&&(r!=a||n);)n=!n&&"\\"==r;return n||(t.tokenize=d),i("string","string")}),t.tokenize(e,t);if("."==r&&e.match(/^\d[\d_]*(?:[eE][+\-]?[\d_]+)?/))return i("number","number");if("."==r&&e.match(".."))return i("spread","meta");if(/[\[\]{}\(\),;\:\.]/.test(r))return i(r);if("="==r&&e.eat(">"))return i("=>","operator");if("0"==r&&e.match(/^(?:x[\dA-Fa-f_]+|o[0-7_]+|b[01_]+)n?/))return i("number","number");if(/\d/.test(r))return e.match(/^[\d_]*(?:n|(?:\.[\d_]*)?(?:[eE][+\-]?[\d_]+)?)?/),i("number","number");if("/"==r)return e.eat("*")?(t.tokenize=K)(e,t):e.eat("/")?(e.skipToEnd(),i("comment","comment")):tt(e,t,1)?(function(e){for(var t,r=!1,n=!1;null!=(t=e.next());){if(!r){if("/"==t&&!n)return;"["==t?n=!0:n&&"]"==t&&(n=!1)}r=!r&&"\\"==t}}(e),e.match(/^\b(([gimyus])(?![gimyus]*\2))+\b/),i("regexp","string-2")):(e.eat("="),i("operator","operator",e.current()));if("`"==r)return(t.tokenize=L)(e,t);if("#"==r&&"!"==e.peek())return e.skipToEnd(),i("meta","meta");if("#"==r&&e.eatWhile(B))return i("variable","property");if("<"==r&&e.match("!--")||"-"==r&&e.match("->")&&!/\S/.test(e.string.slice(0,e.start)))return e.skipToEnd(),i("comment","comment");if(G.test(r))return">"==r&&t.lexical&&">"==t.lexical.type||(e.eat("=")?"!"!=r&&"="!=r||e.eat("="):/[<>*+\-|&?]/.test(r)&&(e.eat(r),">"==r&&e.eat(r))),"?"==r&&e.eat(".")?i("."):i("operator","operator",e.current());if(B.test(r)){e.eatWhile(B);r=e.current();if("."!=t.lastType){if(F.propertyIsEnumerable(r))return i((t=F[r]).type,t.style,r);if("async"==r&&e.match(/^(\s|\/\*([^*]|\*(?!\/))*?\*\/)*[\[\(\w]/,!1))return i("async","keyword",r)}return i("variable","variable",r)}}function K(e,t){for(var r,n=!1;r=e.next();){if("/"==r&&n){t.tokenize=d;break}n="*"==r}return i("comment","comment")}function L(e,t){for(var r,n=!1;null!=(r=e.next());){if(!n&&("`"==r||"$"==r&&e.eat("{"))){t.tokenize=d;break}n=!n&&"\\"==r}return i("quasi","string-2",e.current())}function Q(e,t){t.fatArrowAt&&(t.fatArrowAt=null);var r=e.string.indexOf("=>",e.start);if(!(r<0)){!u||(n=/:\s*(?:\w+(?:<[^>]*>|\[\])?|\{[^}]*\})\s*$/.exec(e.string.slice(e.start,r)))&&(r=n.index);for(var n,a=0,i=!1,o=r-1;0<=o;--o){var c=e.string.charAt(o),s="([{}])".indexOf(c);if(0<=s&&s<3){if(!a){++o;break}if(0==--a){"("==c&&(i=!0);break}}else if(3<=s&&s<6)++a;else if(B.test(c))i=!0;else if(/["'\/`]/.test(c))for(;;--o){if(0==o)return;if(e.string.charAt(o-1)==c&&"\\"!=e.string.charAt(o-2)){o--;break}}else if(i&&!a){++o;break}}i&&!a&&(t.fatArrowAt=o)}}var R={atom:!0,number:!0,variable:!0,string:!0,regexp:!0,this:!0,import:!0,"jsonld-keyword":!0};function X(e,t,r,n,a,i){this.indented=e,this.column=t,this.type=r,this.prev=a,this.info=i,null!=n&&(this.align=n)}function Y(e,t,r,n,a){var i=e.cc;for(c.state=e,c.stream=a,c.marked=null,c.cc=i,c.style=t,e.lexical.hasOwnProperty("align")||(e.lexical.align=!0);;)if((i.length?i.pop():o?x:b)(r,n)){for(;i.length&&i[i.length-1].lex;)i.pop()();return c.marked?c.marked:"variable"==r&&function(e,t){if(W){for(var r=e.localVars;r;r=r.next)if(r.name==t)return 1;for(var n=e.context;n;n=n.prev)for(r=n.vars;r;r=r.next)if(r.name==t)return 1}}(e,n)?"variable-2":t}}var c={state:null,column:null,marked:null,cc:null};function s(){for(var e=arguments.length-1;0<=e;e--)c.cc.push(arguments[e])}function p(){return s.apply(null,arguments),!0}function Z(e,t){for(var r=t;r;r=r.next)if(r.name==e)return 1}function a(e){var t=c.state;if(c.marked="def",W){if(t.context)if("var"==t.lexical.info&&t.context&&t.context.block){var r=function e(t,r){{var n;return r?r.block?(n=e(t,r.prev))?n==r.prev?r:new te(n,r.vars,!0):null:Z(t,r.vars)?r:new te(r.prev,new re(t,r.vars),!1):null}}(e,t.context);if(null!=r)return void(t.context=r)}else if(!Z(e,t.localVars))return void(t.localVars=new re(e,t.localVars));l.globalVars&&!Z(e,t.globalVars)&&(t.globalVars=new re(e,t.globalVars))}}function ee(e){return"public"==e||"private"==e||"protected"==e||"abstract"==e||"readonly"==e}function te(e,t,r){this.prev=e,this.vars=t,this.block=r}function re(e,t){this.name=e,this.next=t}var ne=new re("this",new re("arguments",null));function m(){c.state.context=new te(c.state.context,c.state.localVars,!1),c.state.localVars=ne}function ae(){c.state.context=new te(c.state.context,c.state.localVars,!0),c.state.localVars=null}function k(){c.state.localVars=c.state.context.vars,c.state.context=c.state.context.prev}function v(n,a){function e(){var e=c.state,t=e.indented;if("stat"==e.lexical.type)t=e.lexical.indented;else for(var r=e.lexical;r&&")"==r.type&&r.align;r=r.prev)t=r.indented;e.lexical=new X(t,c.stream.column(),n,null,e.lexical,a)}return e.lex=!0,e}function y(){var e=c.state;e.lexical.prev&&(")"==e.lexical.type&&(e.indented=e.lexical.indented),e.lexical=e.lexical.prev)}function w(r){return function e(t){return t==r?p():";"==r||"}"==t||")"==t||"]"==t?s():p(e)}}function b(e,t){return"var"==e?p(v("vardef",t),qe,w(";"),y):"keyword a"==e?p(v("form"),oe,b,y):"keyword b"==e?p(v("form"),b,y):"keyword d"==e?c.stream.match(/^\s*$/,!1)?p():p(v("stat"),g,w(";"),y):"debugger"==e?p(w(";")):"{"==e?p(v("}"),ae,be,y,k):";"==e?p():"if"==e?("else"==c.state.lexical.info&&c.state.cc[c.state.cc.length-1]==y&&c.state.cc.pop()(),p(v("form"),oe,b,y,Oe)):"function"==e?p(q):"for"==e?p(v("form"),ae,Pe,b,k,y):"class"==e||u&&"interface"==t?(c.marked="keyword",p(v("form","class"==e?e:t),Fe,y)):"variable"==e?u&&"declare"==t?(c.marked="keyword",p(b)):u&&("module"==t||"enum"==t||"type"==t)&&c.stream.match(/^\s*\w/,!1)?(c.marked="keyword","enum"==t?p(Ze):"type"==t?p(We,w("operator"),z,w(";")):p(v("form"),T,w("{"),v("}"),be,y,y)):u&&"namespace"==t?(c.marked="keyword",p(v("form"),x,b,y)):u&&"abstract"==t?(c.marked="keyword",p(b)):p(v("stat"),me):"switch"==e?p(v("form"),oe,w("{"),v("}","switch"),ae,be,y,y,k):"case"==e?p(x,w(":")):"default"==e?p(w(":")):"catch"==e?p(v("form"),m,ie,b,y,k):"export"==e?p(v("stat"),Ge,y):"import"==e?p(v("stat"),Ke,y):"async"==e?p(b):"@"==t?p(x,b):s(v("stat"),x,w(";"),y)}function ie(e){if("("==e)return p(S,w(")"))}function x(e,t){return ce(e,t,!1)}function h(e,t){return ce(e,t,!0)}function oe(e){return"("!=e?s():p(v(")"),g,w(")"),y)}function ce(e,t,r){if(c.state.fatArrowAt==c.stream.start){var n=r?fe:le;if("("==e)return p(m,v(")"),V(S,")"),y,w("=>"),n,k);if("variable"==e)return s(m,T,w("=>"),n,k)}var a,n=r?M:j;return R.hasOwnProperty(e)?p(n):"function"==e?p(q,n):"class"==e||u&&"interface"==t?(c.marked="keyword",p(v("form"),Be,y)):"keyword c"==e||"async"==e?p(r?h:x):"("==e?p(v(")"),g,w(")"),y,n):"operator"==e||"spread"==e?p(r?h:x):"["==e?p(v("]"),Ye,y,n):"{"==e?we(ve,"}",null,n):"quasi"==e?s(se,n):"new"==e?p((a=r,function(e){return"."==e?p(a?pe:de):"variable"==e&&u?p(Ie,a?M:j):s(a?h:x)})):p()}function g(e){return e.match(/[;\}\)\],]/)?s():s(x)}function j(e,t){return","==e?p(g):M(e,t,!1)}function M(e,t,r){var n=0==r?j:M,a=0==r?x:h;return"=>"==e?p(m,r?fe:le,k):"operator"==e?/\+\+|--/.test(t)||u&&"!"==t?p(n):u&&"<"==t&&c.stream.match(/^([^<>]|<[^<>]*>)*>\s*\(/,!1)?p(v(">"),V(z,">"),y,n):"?"==t?p(x,w(":"),a):p(a):"quasi"==e?s(se,n):";"!=e?"("==e?we(h,")","call",n):"."==e?p(ke,n):"["==e?p(v("]"),g,w("]"),y,n):u&&"as"==t?(c.marked="keyword",p(z,n)):"regexp"==e?(c.state.lastType=c.marked="operator",c.stream.backUp(c.stream.pos-c.stream.start-1),p(a)):void 0:void 0}function se(e,t){return"quasi"!=e?s():"${"!=t.slice(t.length-2)?p(se):p(g,ue)}function ue(e){if("}"==e)return c.marked="string-2",c.state.tokenize=L,p(se)}function le(e){return Q(c.stream,c.state),s("{"==e?b:x)}function fe(e){return Q(c.stream,c.state),s("{"==e?b:h)}function de(e,t){if("target"==t)return c.marked="keyword",p(j)}function pe(e,t){if("target"==t)return c.marked="keyword",p(M)}function me(e){return":"==e?p(y,b):s(j,w(";"),y)}function ke(e){if("variable"==e)return c.marked="property",p()}function ve(e,t){return"async"==e?(c.marked="property",p(ve)):"variable"!=e&&"keyword"!=c.style?"number"==e||"string"==e?(c.marked=U?"property":c.style+" property",p(A)):"jsonld-keyword"==e?p(A):u&&ee(t)?(c.marked="keyword",p(ve)):"["==e?p(x,E,w("]"),A):"spread"==e?p(h,A):"*"==t?(c.marked="keyword",p(ve)):":"==e?s(A):void 0:(c.marked="property","get"==t||"set"==t?p(ye):(u&&c.state.fatArrowAt==c.stream.start&&(e=c.stream.match(/^\s*:\s*/,!1))&&(c.state.fatArrowAt=c.stream.pos+e[0].length),p(A)))}function ye(e){return"variable"!=e?s(A):(c.marked="property",p(q))}function A(e){return":"==e?p(h):"("==e?s(q):void 0}function V(n,a,i){function o(e,t){var r;return(i?-1
42 |
47 | WebUI Text Editor
43 | v1.1 44 |Example of a text editor software in Nim using WebUI library.
45 |webui.me | (C)2023 Hassan Draga
46 |Virtual File System Example
55 |56 |
57 | 58 |
59 | This file is embedded in this application.
60 |
/sub
62 |63 | 64 | 65 | 66 | 67 | 68 | 69 | 135 | 136 | -------------------------------------------------------------------------------- /examples/virtual_file_system/ui/sub/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 |
55 | This is another file embedded in this application.
56 |
58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /examples/virtual_file_system/ui/svg/webui.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /examples/virtual_file_system/vfs.nim: -------------------------------------------------------------------------------- 1 | import std/strformat 2 | import std/httpcore 3 | import std/tables 4 | import std/os 5 | 6 | import webui 7 | 8 | type 9 | HttpResponse = ref object 10 | code: HttpCode 11 | headers: Table[string, string] # TODO use TableRef 12 | body: string 13 | 14 | const 15 | fileRoot = currentSourcePath /../ "ui" 16 | virtualFiles = toTable({ 17 | "/index.html": slurp(fileRoot / "index.html"), 18 | "/sub/index.html": slurp(fileRoot / "sub/index.html"), 19 | "/svg/webui.svg": slurp(fileRoot / "svg/webui.svg") 20 | }) 21 | indexFiles = toTable({ 22 | "//": "/index.html", 23 | "/sub/": "/sub/index.html" 24 | }) 25 | 26 | HttpNewLine = "\r\n" 27 | 28 | proc `$`*(resp: HttpResponse): string = 29 | # build status line 30 | result.add(fmt"HTTP/1.1 {resp.code}" & HttpNewLine) 31 | 32 | # add headers 33 | for key, val in resp.headers: 34 | result.add(fmt"{key}: {val}" & HttpNewLine) 35 | 36 | # add seperator between headers and message body 37 | result.add HttpNewLine 38 | 39 | # finally, add response body 40 | result.add resp.body 41 | 42 | proc fileHandler*(path: string): string = 43 | let redirectPath = 44 | if path[^1] != '/': path & '/' 45 | else: path 46 | 47 | var resp = new HttpResponse 48 | defer: result = $resp 49 | 50 | if virtualFiles.hasKey(path): 51 | resp.code = Http200 52 | resp.headers["Content-Type"] = path.getMimeType() 53 | resp.headers["Content-Length"] = $virtualFiles[path].len 54 | resp.headers["Cache-Control"] = "no-cache" 55 | 56 | resp.body = virtualFiles[path] 57 | elif indexFiles.hasKey(redirectPath): 58 | resp.code = Http302 59 | resp.headers["Location"] = indexFiles[redirectPath] 60 | resp.headers["Cache-Control"] = "no-cache" 61 | # webui will handle the 404 62 | -------------------------------------------------------------------------------- /examples/web_app_multi_client/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 |
Web App Multi-Client Example
59 |60 | Connecting... 61 |
62 |
63 | You are user number 0 64 |
65 |
66 | Your connection number is 0 67 |
68 |
69 | There are 0 users connected, and 0 tabs opened. 70 |
71 |
72 | Current user input: Reload This Page 73 |
74 |
75 | All users input: 76 |
77 |
78 | Open New Tab 79 |
80 |
81 | 82 |
83 |
84 |
85 | Note:
Copy URL, and open it in a private window, or another web browser to create new users. 86 | 87 | 88 | 89 | 90 | 91 | 155 | 156 | -------------------------------------------------------------------------------- /examples/web_app_multi_client/main.nim: -------------------------------------------------------------------------------- 1 | import std/strformat 2 | 3 | import webui 4 | 5 | # Arrays to hold permanent data 6 | var 7 | privateInput: array[256, string] # One for each user 8 | publicInput: string # One for all users 9 | usersCount: int 10 | tabCount: int 11 | 12 | proc save(e: Event) = 13 | # Get input value and save it in the array 14 | privateInput[e.clientId] = e.getString() 15 | 16 | proc saveAll(e: Event) = 17 | # Get input value and save it in the array 18 | publicInput = e.getString() 19 | 20 | # Update all users 21 | e.window.run(fmt"document.getElementById('publicInput').value = '{publicInput}';") 22 | 23 | proc events(e: Event) = 24 | # This function gets called every time there is an event 25 | 26 | # Get full web browser cookies 27 | # this is a port of the C example, which declares, 28 | # but doesnt use the `cookies` variable 29 | let cookies {.used.} = e.cookies 30 | 31 | # Static client (Based on web browser cookies) 32 | let clientId = e.clientId 33 | 34 | # Dynamic client connection ID (Changes on connect/disconnect events) 35 | let connectionId = e.connectionId 36 | 37 | case e.eventType 38 | of weConnected: # New connection 39 | if users_count < (client_id + 1): # +1 because it starts from 0 40 | users_count = client_id + 1 41 | 42 | inc tabCount 43 | of weDisconnected: # Disconnection 44 | if tab_count > 0: 45 | dec tab_count 46 | else: 47 | discard 48 | 49 | # --- Update this current user only 50 | 51 | # status 52 | e.runClient("document.getElementById('status').innerText = 'Connected!';") 53 | 54 | # userNumber 55 | e.runClient(fmt"document.getElementById('userNumber').innerText = '{clientId}';") 56 | 57 | # connectionId 58 | e.runClient(fmt"document.getElementById('connectionNumber').innerText = '{connectionId}';") 59 | 60 | # privateInput 61 | e.runClient(fmt"document.getElementById('privateInput').value = '{privateInput[clientId]}';") 62 | 63 | # publicInput 64 | e.runClient(fmt"document.getElementById('publicInput').value = '{publicInput}';") 65 | 66 | # --- Update all connected users 67 | 68 | # userCount 69 | e.runClient(fmt"document.getElementById('userCount').innerText = '{usersCount}';") 70 | 71 | # tabCount 72 | e.runClient(fmt"document.getElementById('tabCount').innerText = '{tabCount}';") 73 | 74 | proc main() = 75 | # Allow multi-user connection and cookies 76 | setConfig({wcMultiClient, wcUseCookies}, true) 77 | 78 | # Create new window 79 | let window = newWindow() 80 | 81 | # Bind HTML with Nim functions 82 | window.bind("save", save) 83 | window.bind("saveAll", saveAll) 84 | window.bind("exit_app", exit) 85 | 86 | # Bind all events 87 | window.bind("", events) 88 | 89 | # Start server only 90 | let url = window.startServer("index.html") 91 | 92 | # Open a new page in the default native web browser 93 | openUrl(url) 94 | 95 | # Wait until all windows get closed 96 | wait() 97 | 98 | # Free all memory resources (Optional) 99 | clean() 100 | 101 | main() 102 | -------------------------------------------------------------------------------- /nim_example.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/webui-dev/nim-webui/a97eff8a766bda7f0b7c21b9a1c061b28f7ae59c/nim_example.png -------------------------------------------------------------------------------- /nimdoc.cfg: -------------------------------------------------------------------------------- 1 | # `nim doc` config 2 | 3 | outDir = docs 4 | docCmd = skip 5 | 6 | git.url = "https://github.com/webui-dev/nim-webui" 7 | git.devel = main 8 | git.commit = main 9 | 10 | project = on -------------------------------------------------------------------------------- /tests/config.nims: -------------------------------------------------------------------------------- 1 | switch("path", "$projectDir") -------------------------------------------------------------------------------- /tests/test1.nim: -------------------------------------------------------------------------------- 1 | import webui 2 | 3 | let window = newWindow() 4 | window.show("Hello") 5 | 6 | wait() -------------------------------------------------------------------------------- /webui.nimble: -------------------------------------------------------------------------------- 1 | # Package 2 | 3 | version = "2.5.0.0" 4 | author = "Jasmine" 5 | description = "Wrapper for WebUI" 6 | license = "MIT" 7 | installFiles = @["webui.nim"] 8 | installDirs = @["webui"] 9 | 10 | 11 | # Dependencies 12 | 13 | requires "nim >= 1.2.0" 14 | -------------------------------------------------------------------------------- /webui/handlers.nim: -------------------------------------------------------------------------------- 1 | import std/pathnorm 2 | import std/macros 3 | import std/os 4 | 5 | macro dynamicHandler*(dir: string = ".", isStatic: bool): untyped = 6 | ## Dynamic file handler, serving files from `dir`. 7 | 8 | var branches: seq[tuple[cond, body: NimNode]] 9 | 10 | for file in walkDirRec($dir, relative=true): 11 | var currBranch: tuple[cond, body: NimNode] 12 | 13 | currBranch.cond = infix(ident"filename", "==", newStrLitNode("/" & file.normalizePath('/'))) 14 | currBranch.body = newNimNode(nnkReturnStmt).add(newCall(ident"readFile", newStrLitNode($dir / file))) 15 | 16 | branches.add currBranch 17 | 18 | let body = newNimNode(nnkIfStmt) 19 | 20 | for branch in branches: 21 | body.add newTree(nnkElifBranch, branch.cond, branch.body) 22 | 23 | result = newProc(params=[ident"string", newIdentDefs(ident"filename", ident"string")], body=body) 24 | 25 | # better approach? 26 | macro staticHandler*(dir: string = "."): untyped = 27 | ## Static file handler, serving files from `dir`. 28 | ## `dir` should not be too large or have files that are too big. 29 | ## 30 | ## `dir` is relative to the current working directory. 31 | ## 32 | ## **ISSUE**: results in MUCH longer compilation times 33 | 34 | var branches: seq[tuple[cond, body: NimNode]] 35 | 36 | for file in walkDirRec($dir, relative=true): 37 | var currBranch: tuple[cond, body: NimNode] 38 | let cont = readFile($dir / file) 39 | 40 | currBranch.cond = infix(ident"filename", "==", newStrLitNode("/" & file.normalizePath('/'))) 41 | currBranch.body = newNimNode(nnkReturnStmt).add(newStrLitNode(cont)) 42 | 43 | branches.add currBranch 44 | 45 | let body = newNimNode(nnkIfStmt) 46 | 47 | for branch in branches: 48 | body.add newTree(nnkElifBranch, branch.cond, branch.body) 49 | 50 | result = newProc(params=[ident"string", newIdentDefs(ident"filename", ident"string")], body=body) 51 | --------------------------------------------------------------------------------