imagetest.html 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title></title>
  5. <script src="skulpt.min.js" type="text/javascript"></script>
  6. <script src="skulpt-stdlib.js" type="text/javascript"></script>
  7. </head>
  8. <body>
  9. <p>To use this as a test file, you need to run it in a local server. python -m http.server --port 8889 should work.</p>
  10. <img id="meme" src="logo.png">
  11. <script type="text/javascript">
  12. function outf(text) {
  13. var mypre = document.getElementById(Sk.pre);
  14. mypre.innerHTML = mypre.innerHTML + text;
  15. }
  16. function builtinRead(x)
  17. {
  18. if (Sk.builtinFiles === undefined || Sk.builtinFiles["files"][x] === undefined)
  19. throw "File not found: '" + x + "'";
  20. return Sk.builtinFiles["files"][x];
  21. }
  22. function runit(myDiv) {
  23. var prog = document.getElementById(myDiv+"_code").value;
  24. var mypre = document.getElementById(myDiv+"_pre");
  25. mypre.innerHTML = '';
  26. Sk.canvas = myDiv+"_canvas";
  27. var can = document.getElementById(Sk.canvas);
  28. can.style.display = 'block';
  29. if (can) {
  30. can.width = can.width;
  31. if (Sk.tg) {
  32. Sk.tg.canvasInit = false;
  33. Sk.tg.turtleList = [];
  34. }
  35. }
  36. Sk.pre = myDiv+"_pre";
  37. Sk.configure({output:outf,
  38. read: builtinRead
  39. });
  40. var myPromise = Sk.misceval.asyncToPromise(function() {
  41. return Sk.importMainWithBody("<stdin>",false,prog,true);
  42. });
  43. myPromise.then(function(mod) {}, function(err) {
  44. console.log(err.toString());
  45. });
  46. }
  47. </script>
  48. <h3>Try This</h3>
  49. <div id="example1">
  50. <form>
  51. <textarea edit_id="eta_5" id="example1_code" cols="60" rows="10">
  52. import image
  53. img = image.Image("meme")
  54. win = image.ImageWin()
  55. img.draw(win)
  56. img.setDelay(1,15)
  57. for col in range(img.getWidth()):
  58. for row in range(img.getHeight()):
  59. p = img.getPixel(col,row)
  60. p.setRed(255-p.getRed())
  61. p.setGreen(255-p.getGreen())
  62. p.setBlue(255-p.getBlue())
  63. img.setPixel(col,row,p)
  64. </textarea>
  65. <button onclick="runit('example1')" type="button">Run</button>
  66. </form>
  67. <div id="example1_canvas" height="500" width="800"
  68. style="border-style: solid; display: none"></div>
  69. <pre id="example1_pre"></pre>
  70. </div>
  71. </body>
  72. </html>