visibletabs.html 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>CodeMirror: Visible tabs demo</title>
  6. <link rel="stylesheet" href="../lib/codemirror.css">
  7. <script src="../lib/codemirror.js"></script>
  8. <script src="../mode/clike/clike.js"></script>
  9. <link rel="stylesheet" href="../doc/docs.css">
  10. <style type="text/css">
  11. .CodeMirror {border-top: 1px solid #eee; border-bottom: 1px solid #eee;}
  12. .cm-tab {
  13. background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAMCAYAAAAkuj5RAAAAAXNSR0IArs4c6QAAAGFJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kFFWY0qV8foQwS4MKBCS3qR6ixBJvElOobYAtivseIE120FaowJPN75GMu8j/LfMwNjh4HUpwg4LUAAAAASUVORK5CYII=);
  14. background-position: right;
  15. background-repeat: no-repeat;
  16. }
  17. </style>
  18. </head>
  19. <body>
  20. <h1>CodeMirror: Visible tabs demo</h1>
  21. <form><textarea id="code" name="code">
  22. #include "syscalls.h"
  23. /* getchar: simple buffered version */
  24. int getchar(void)
  25. {
  26. static char buf[BUFSIZ];
  27. static char *bufp = buf;
  28. static int n = 0;
  29. if (n == 0) { /* buffer is empty */
  30. n = read(0, buf, sizeof buf);
  31. bufp = buf;
  32. }
  33. return (--n >= 0) ? (unsigned char) *bufp++ : EOF;
  34. }
  35. </textarea></form>
  36. <p>Tabs inside the editor are spans with the
  37. class <code>cm-tab</code>, and can be styled.</p>
  38. <script>
  39. var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
  40. lineNumbers: true,
  41. tabSize: 4,
  42. indentUnit: 4,
  43. indentWithTabs: true,
  44. mode: "text/x-csrc"
  45. });
  46. </script>
  47. </body>
  48. </html>