index.html 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Tauri</title>
  7. </head>
  8. <body>
  9. <h1>Tauri Commands</h1>
  10. <div>Response: <span id="response"></span></div>
  11. <div>Without Args: <span id="response-optional"></span></div>
  12. <div id="container"></div>
  13. <script>
  14. function runCommand(commandName, args, optional) {
  15. const id = optional ? '#response-optional' : '#response'
  16. const result = document.querySelector(id)
  17. window.__TAURI__.core
  18. .invoke(commandName, args)
  19. .then((response) => {
  20. const val =
  21. response instanceof ArrayBuffer
  22. ? new TextDecoder().decode(response)
  23. : response
  24. result.innerText = `Ok(${val})`
  25. })
  26. .catch((error) => {
  27. result.innerText = `Err(${error})`
  28. })
  29. }
  30. const container = document.querySelector('#container')
  31. const commands = [
  32. { name: 'borrow_cmd' },
  33. { name: 'raw_request' },
  34. { name: 'window_label' },
  35. { name: 'simple_command' },
  36. { name: 'stateful_command' },
  37. { name: 'async_simple_command' },
  38. { name: 'async_simple_command_snake' },
  39. { name: 'future_simple_command' },
  40. { name: 'async_stateful_command' },
  41. { name: 'simple_command_with_result' },
  42. // snake
  43. { name: 'future_simple_command_snake' },
  44. { name: 'future_simple_command_with_return_snake' },
  45. { name: 'future_simple_command_with_result_snake' },
  46. { name: 'force_async_snake' },
  47. { name: 'force_async_with_result_snake' },
  48. { name: 'simple_command_with_result_snake' },
  49. { name: 'stateful_command_with_result_snake' },
  50. // state
  51. { name: 'stateful_command_with_result' },
  52. { name: 'async_simple_command_with_result' },
  53. { name: 'future_simple_command_with_return' },
  54. { name: 'future_simple_command_with_result' },
  55. { name: 'async_stateful_command_with_result' },
  56. { name: 'command_arguments_wild' },
  57. {
  58. name: 'command_arguments_struct',
  59. args: { person: { name: 'ferris', age: 6 } }
  60. },
  61. {
  62. name: 'command_arguments_tuple_struct',
  63. args: { inlinePerson: ['ferris', 6] }
  64. }
  65. ]
  66. for (const command of commands) {
  67. const { name } = command
  68. const args = command.args ?? {
  69. [name.endsWith('snake') ? 'the_argument' : 'theArgument']: 'value'
  70. }
  71. const button = document.createElement('button')
  72. button.innerHTML = `Run ${name}`
  73. button.addEventListener('click', function () {
  74. runCommand(name, args, false)
  75. runCommand(name, Object.create(null), true)
  76. })
  77. container.appendChild(button)
  78. }
  79. </script>
  80. </body>
  81. </html>