index.html 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <title>Uppy :tl: playground</title>
  7. </head>
  8. <body>
  9. <style>
  10. html {
  11. background: #f1f1f1;
  12. }
  13. main {
  14. padding: 20px;
  15. font: 12pt sans-serif;
  16. background: white;
  17. width: 800px;
  18. margin: auto;
  19. }
  20. hr {
  21. border: 0;
  22. background-color: #111e33;
  23. height: 1px;
  24. }
  25. .error { color: red; }
  26. #logo { height: 1em; vertical-align: middle; }
  27. </style>
  28. <main>
  29. <h1>Uppy <img src="https://transloadit.edgly.net/assets/images/logo-small.svg" alt="Transloadit" id="logo"> playground</h1>
  30. <hr>
  31. <h2>transloadit.form()</h2>
  32. <form id="test-form" method="post" action="http://localhost:9967/test">
  33. <p><strong>leave a message</strong>
  34. <p>
  35. <label>name:
  36. <input type="text" name="name">
  37. </label>
  38. <p>
  39. <label>message: <br>
  40. <textarea name="message"></textarea>
  41. </label>
  42. <p>
  43. <label>
  44. attachments:
  45. <input type="file">
  46. </label>
  47. <p>
  48. <button type="submit">
  49. Upload
  50. </button>
  51. <span class="error"></span>
  52. </form>
  53. <hr>
  54. <h2>transloadit.modal()</h2>
  55. <p>
  56. <button onclick="openModal()">Open</button>
  57. <hr>
  58. <h2>transloadit.upload()</h2>
  59. <p>
  60. An &lt;input type=file&gt; backed by `transloadit.upload`:
  61. <p>
  62. <input type="file" multiple onchange="doUpload(event)">
  63. </main>
  64. <link href="uppy.min.css" rel="stylesheet">
  65. <script src="bundle.js"></script>
  66. </body>
  67. </html>