index.html 11 KB

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