index.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Blockly Generator Tests</title>
  6. <script src="../../blockly_uncompressed.js"></script>
  7. <script src="../../generators/javascript.js"></script>
  8. <script src="unittest_javascript.js"></script>
  9. <script src="../../generators/javascript/logic.js"></script>
  10. <script src="../../generators/javascript/loops.js"></script>
  11. <script src="../../generators/javascript/math.js"></script>
  12. <script src="../../generators/javascript/text.js"></script>
  13. <script src="../../generators/javascript/lists.js"></script>
  14. <script src="../../generators/javascript/colour.js"></script>
  15. <script src="../../generators/javascript/variables.js"></script>
  16. <script src="../../generators/javascript/procedures.js"></script>
  17. <script src="../../generators/python.js"></script>
  18. <script src="unittest_python.js"></script>
  19. <script src="../../generators/python/logic.js"></script>
  20. <script src="../../generators/python/loops.js"></script>
  21. <script src="../../generators/python/math.js"></script>
  22. <script src="../../generators/python/text.js"></script>
  23. <script src="../../generators/python/lists.js"></script>
  24. <script src="../../generators/python/colour.js"></script>
  25. <script src="../../generators/python/variables.js"></script>
  26. <script src="../../generators/python/procedures.js"></script>
  27. <script src="../../generators/php.js"></script>
  28. <script src="unittest_php.js"></script>
  29. <script src="../../generators/php/logic.js"></script>
  30. <script src="../../generators/php/loops.js"></script>
  31. <script src="../../generators/php/math.js"></script>
  32. <script src="../../generators/php/text.js"></script>
  33. <script src="../../generators/php/lists.js"></script>
  34. <script src="../../generators/php/colour.js"></script>
  35. <script src="../../generators/php/variables.js"></script>
  36. <script src="../../generators/php/procedures.js"></script>
  37. <script src="../../generators/lua.js"></script>
  38. <script src="unittest_lua.js"></script>
  39. <script src="../../generators/lua/logic.js"></script>
  40. <script src="../../generators/lua/loops.js"></script>
  41. <script src="../../generators/lua/math.js"></script>
  42. <script src="../../generators/lua/text.js"></script>
  43. <script src="../../generators/lua/lists.js"></script>
  44. <script src="../../generators/lua/colour.js"></script>
  45. <script src="../../generators/lua/variables.js"></script>
  46. <script src="../../generators/lua/procedures.js"></script>
  47. <script src="../../generators/dart.js"></script>
  48. <script src="unittest_dart.js"></script>
  49. <script src="../../generators/dart/logic.js"></script>
  50. <script src="../../generators/dart/loops.js"></script>
  51. <script src="../../generators/dart/math.js"></script>
  52. <script src="../../generators/dart/text.js"></script>
  53. <script src="../../generators/dart/lists.js"></script>
  54. <script src="../../generators/dart/colour.js"></script>
  55. <script src="../../generators/dart/variables.js"></script>
  56. <script src="../../generators/dart/procedures.js"></script>
  57. <script src="unittest.js"></script>
  58. <script src="../../msg/messages.js"></script>
  59. <script src="../../blocks/logic.js"></script>
  60. <script src="../../blocks/loops.js"></script>
  61. <script src="../../blocks/math.js"></script>
  62. <script src="../../blocks/text.js"></script>
  63. <script src="../../blocks/lists.js"></script>
  64. <script src="../../blocks/colour.js"></script>
  65. <script src="../../blocks/variables.js"></script>
  66. <script src="../../blocks/procedures.js"></script>
  67. <script>
  68. 'use strict';
  69. var workspace = null;
  70. function start() {
  71. workspace = Blockly.inject('blocklyDiv',
  72. {grid:
  73. {spacing: 25,
  74. length: 3,
  75. colour: '#ccc',
  76. snap: true},
  77. media: '../../media/',
  78. toolbox: document.getElementById('toolbox'),
  79. zoom: {controls: true, wheel: true}
  80. });
  81. }
  82. function loadXml() {
  83. var dropdown = document.getElementById('testUrl');
  84. var url = dropdown.options[dropdown.selectedIndex].value;
  85. if (!url) {
  86. url = window.prompt('Enter URL of test file.');
  87. if (!url) {
  88. return;
  89. }
  90. }
  91. var xmlText = fetchFile(url);
  92. if (xmlText !== null) {
  93. fromXml(xmlText);
  94. }
  95. }
  96. function fetchFile(xmlUrl) {
  97. try {
  98. var xmlHttp = new XMLHttpRequest();
  99. xmlHttp.open('GET', xmlUrl, false);
  100. xmlHttp.setRequestHeader('Content-Type', 'text/xml');
  101. xmlHttp.send('');
  102. } catch (e) {
  103. // Attempt to diagnose the problem.
  104. var msg = 'Error: Unable to load XML data.\n';
  105. if (window.location.protocol == 'file:') {
  106. msg += 'This may be due to a security restriction preventing\n' +
  107. 'access when using the file:// protocol.\n' +
  108. 'Use an http webserver, or a less paranoid browser.\n';
  109. }
  110. alert(msg + '\n' + e);
  111. return null;
  112. }
  113. return xmlHttp.responseText;
  114. }
  115. function fromXml(xmlText) {
  116. var output = document.getElementById('importExport');
  117. output.value = xmlText;
  118. output.scrollTop = 0;
  119. output.scrollLeft = 0;
  120. workspace.clear();
  121. try {
  122. var xmlDoc = Blockly.Xml.textToDom(xmlText);
  123. } catch (e) {
  124. alert('Error parsing XML:\n' + e);
  125. return;
  126. }
  127. Blockly.Xml.domToWorkspace(xmlDoc, workspace);
  128. }
  129. function setOutput(text) {
  130. var output = document.getElementById('importExport');
  131. output.value = text;
  132. output.focus();
  133. output.select();
  134. }
  135. function toXml() {
  136. var xmlDom = Blockly.Xml.workspaceToDom(workspace);
  137. var xmlText = Blockly.Xml.domToPrettyText(xmlDom);
  138. xmlText = xmlText.replace(/ id="\d+"/g, '');
  139. setOutput(xmlText);
  140. }
  141. function toJavaScript() {
  142. var oneBasedIndexing = document.getElementById('indexing').checked;
  143. Blockly.JavaScript.ONE_BASED_INDEXING = oneBasedIndexing;
  144. var code = '\'use strict\';\n\n'
  145. code += Blockly.JavaScript.workspaceToCode(workspace);
  146. setOutput(code);
  147. }
  148. function toPython() {
  149. var oneBasedIndexing = document.getElementById('indexing').checked;
  150. Blockly.Python.ONE_BASED_INDEXING = oneBasedIndexing;
  151. var code = Blockly.Python.workspaceToCode(workspace);
  152. setOutput(code);
  153. }
  154. function toPhp() {
  155. var oneBasedIndexing = document.getElementById('indexing').checked;
  156. Blockly.PHP.ONE_BASED_INDEXING = oneBasedIndexing;
  157. var code = Blockly.PHP.workspaceToCode(workspace);
  158. setOutput(code);
  159. }
  160. function toLua() {
  161. var code = Blockly.Lua.workspaceToCode(workspace);
  162. setOutput(code);
  163. }
  164. function toDart() {
  165. var oneBasedIndexing = document.getElementById('indexing').checked;
  166. Blockly.Dart.ONE_BASED_INDEXING = oneBasedIndexing;
  167. var code = Blockly.Dart.workspaceToCode(workspace);
  168. setOutput(code);
  169. }
  170. </script>
  171. <style>
  172. html, body {
  173. height: 100%;
  174. overflow: hidden;
  175. }
  176. body {
  177. background-color: #fff;
  178. font-family: sans-serif;
  179. margin: 0 5px;
  180. }
  181. h1 {
  182. font-weight: normal;
  183. font-size: 140%;
  184. }
  185. #blocklyDiv {
  186. float: right;
  187. height: 95%;
  188. width: 69%;
  189. margin-top: 5px;
  190. }
  191. #importExport {
  192. height: 100%;
  193. width: 100%;
  194. }
  195. </style>
  196. </head>
  197. <body onload="start()">
  198. <div id="blocklyDiv"></div>
  199. <xml id="toolbox" style="display: none">
  200. <category name="Unit test" colour="65">
  201. <block type="unittest_main"></block>
  202. <block type="unittest_assertequals">
  203. <value name="MESSAGE">
  204. <block type="text">
  205. <field name="TEXT"></field>
  206. </block>
  207. </value>
  208. </block>
  209. <block type="unittest_assertvalue">
  210. <value name="MESSAGE">
  211. <block type="text">
  212. <field name="TEXT"></field>
  213. </block>
  214. </value>
  215. </block>
  216. <block type="unittest_fail"></block>
  217. <block type="unittest_adjustindex"></block>
  218. </category>
  219. <category name="Logic" colour="210">
  220. <block type="controls_if"></block>
  221. <block type="logic_compare"></block>
  222. <block type="logic_operation"></block>
  223. <block type="logic_negate"></block>
  224. <block type="logic_boolean"></block>
  225. <block type="logic_null"></block>
  226. <block type="logic_ternary"></block>
  227. </category>
  228. <category name="Loops" colour="120">
  229. <block type="controls_repeat_ext"></block>
  230. <block type="controls_whileUntil"></block>
  231. <block type="controls_for"></block>
  232. <block type="controls_forEach"></block>
  233. <block type="controls_flow_statements"></block>
  234. </category>
  235. <category name="Math" colour="230">
  236. <block type="math_number"></block>
  237. <block type="math_arithmetic"></block>
  238. <block type="math_single"></block>
  239. <block type="math_trig"></block>
  240. <block type="math_constant"></block>
  241. <block type="math_number_property"></block>
  242. <block type="math_change"></block>
  243. <block type="math_round"></block>
  244. <block type="math_on_list"></block>
  245. <block type="math_modulo"></block>
  246. <block type="math_constrain"></block>
  247. <block type="math_random_int"></block>
  248. <block type="math_random_float"></block>
  249. </category>
  250. <category name="Text" colour="160">
  251. <block type="text"></block>
  252. <block type="text_join"></block>
  253. <block type="text_append"></block>
  254. <block type="text_length"></block>
  255. <block type="text_isEmpty"></block>
  256. <block type="text_indexOf"></block>
  257. <block type="text_charAt"></block>
  258. <block type="text_getSubstring"></block>
  259. <block type="text_changeCase"></block>
  260. <block type="text_trim"></block>
  261. <block type="text_print"></block>
  262. <block type="text_prompt_ext"></block>
  263. </category>
  264. <category name="Lists" colour="260">
  265. <block type="lists_create_empty"></block>
  266. <block type="lists_create_with"></block>
  267. <block type="lists_repeat"></block>
  268. <block type="lists_length"></block>
  269. <block type="lists_isEmpty"></block>
  270. <block type="lists_indexOf"></block>
  271. <block type="lists_getIndex"></block>
  272. <block type="lists_setIndex"></block>
  273. <block type="lists_getSublist"></block>
  274. <block type="lists_sort"></block>
  275. <block type="lists_split"></block>
  276. </category>
  277. <category name="Colour" colour="20">
  278. <block type="colour_picker"></block>
  279. <block type="colour_random"></block>
  280. <block type="colour_rgb"></block>
  281. <block type="colour_blend"></block>
  282. </category>
  283. <sep></sep>
  284. <category name="Variables" colour="330" custom="VARIABLE"></category>
  285. <category name="Functions" colour="290" custom="PROCEDURE"></category>
  286. </xml>
  287. <table height="95%" width="30%"><tr><td valign="top">
  288. <h1>Blockly Generator Tests</h1>
  289. <p>
  290. <select id="testUrl">
  291. <option value="logic.xml">Logic</option>
  292. <option value="loops1.xml">Loops 1 (repeat, while, foreach)</option>
  293. <option value="loops2.xml">Loops 2 (count)</option>
  294. <option value="loops3.xml">Loops 3 (continue, break)</option>
  295. <option value="math.xml">Math</option>
  296. <option value="text.xml">Text</option>
  297. <option value="lists.xml">Lists</option>
  298. <option value="colour.xml">Colour</option>
  299. <option value="variables.xml">Variables</option>
  300. <option value="functions.xml">Functions</option>
  301. <option value="">Other...</option>
  302. </select>
  303. <input type="button" value="Load" onclick="loadXml()">
  304. </p>
  305. <p>
  306. <input id="indexing" type="checkbox" checked> Generate with one-based indexing
  307. </p>
  308. <p>
  309. Generate:
  310. <input type="button" value="XML" onclick="toXml()">
  311. <input type="button" value="JavaScript" onclick="toJavaScript()">
  312. <input type="button" value="Python" onclick="toPython()">
  313. <input type="button" value="PHP" onclick="toPhp()">
  314. <input type="button" value="Lua" onclick="toLua()">
  315. <input type="button" value="Dart" onclick="toDart()">
  316. </p>
  317. </td></tr><tr><td height="99%">
  318. <textarea id="importExport" readonly="readonly" wrap="off"></textarea>
  319. </td></tr></table>
  320. </body>
  321. </html>