toolbar.js.html 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>JSDoc: Source: toolbar.js</title>
  6. <script src="scripts/prettify/prettify.js"> </script>
  7. <script src="scripts/prettify/lang-css.js"> </script>
  8. <!--[if lt IE 9]>
  9. <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  10. <![endif]-->
  11. <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
  12. <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
  13. </head>
  14. <body>
  15. <div id="main">
  16. <h1 class="page-title">Source: toolbar.js</h1>
  17. <section>
  18. <article>
  19. <pre class="prettyprint source linenums"><code>/**
  20. * An object that manages the main toolbar, including the different mode buttons.
  21. * This doesn't actually have many responsibilities after the initial load.
  22. *
  23. * @constructor
  24. * @this {BlockPyToolbar}
  25. * @param {Object} main - The main BlockPy instance
  26. * @param {HTMLElement} tag - The HTML object this is attached to.
  27. */
  28. function BlockPyToolbar(main, tag) {
  29. this.main = main;
  30. this.tag = tag;
  31. // Holds the HTMLElement tags for each of the toolbar items
  32. this.tags = {};
  33. this.tags.mode_set_text = this.tag.find('.blockpy-mode-set-text');
  34. this.tags.filename_picker = this.tag.find('.blockpy-toolbar-filename-picker');
  35. // Set up each of the relevant Button Groups
  36. var groupHtml = '&lt;div class="btn-group" role="group">&lt;/div>';
  37. var runGroup = $(groupHtml).appendTo(tag);
  38. var modeGroup = $(groupHtml).appendTo(tag);
  39. var doGroup = $(groupHtml).appendTo(tag);
  40. var blocksGroup = $(groupHtml).appendTo(tag);
  41. var codeGroup = $(groupHtml).appendTo(tag);
  42. var programsGroup = $(groupHtml).appendTo(tag);
  43. // this used to hold many items, but now we store them directly in the
  44. // html of interface.js
  45. this.elements = {
  46. 'programs': $("&lt;div>&lt;/div>")
  47. .addClass('btn-group blockpy-programs')
  48. .attr("data-toggle", "buttons")
  49. .appendTo(programsGroup)
  50. };
  51. this.elements.programs.hide();
  52. this.elements.editor_mode = this.tag.find('.blockpy-change-mode');
  53. // Actually set up the toolbar!
  54. this.activateToolbar();
  55. }
  56. /**
  57. * Add a new button for the given filename in the Programs button group.
  58. * These programs will be things like "__main__".
  59. *
  60. * @param {String} name - The name of the new program.
  61. */
  62. BlockPyToolbar.prototype.addProgram = function(name) {
  63. this.elements.programs.append("&lt;label class='btn btn-default'>"+
  64. "&lt;input type='radio' id='"+name+"' "+
  65. "data-name='"+name+"' autocomplete='off'>"+
  66. name+
  67. "&lt;/label>");
  68. }
  69. /**
  70. * Show the programs button group.
  71. */
  72. BlockPyToolbar.prototype.showPrograms = function() {
  73. this.elements.programs.show();
  74. }
  75. /**
  76. * Hide the programs button group.
  77. */
  78. BlockPyToolbar.prototype.hidePrograms = function() {
  79. this.elements.programs.hide();
  80. }
  81. /**
  82. * Register click events for more complex toolbar actions.
  83. */
  84. BlockPyToolbar.prototype.activateToolbar = function() {
  85. var main = this.main;
  86. this.tag.find('.blockpy-run').click(function() {
  87. main.components.engine.run();
  88. main.components.server.logEvent('editor', 'run')
  89. });
  90. this.tags.mode_set_text.click(function() {
  91. main.model.settings.editor("Text");
  92. main.components.server.logEvent('editor', 'text')
  93. });
  94. this.tag.find('.blockpy-toolbar-reset').click(function() {
  95. main.model.programs['__main__'](main.model.programs['starting_code']());
  96. //main.components.editor.updateBlocks();
  97. main.components.server.logEvent('editor', 'reset');
  98. if (main.model.assignment.parsons()) {
  99. main.components.editor.blockly.shuffle();
  100. }
  101. });
  102. this.tag.find('.blockpy-mode-set-blocks').click(function() {
  103. main.model.settings.editor("Blocks");
  104. main.components.server.logEvent('editor', 'blocks')
  105. });
  106. this.tag.find('.blockpy-mode-set-instructor').click(function() {
  107. main.model.settings.editor("Instructor");
  108. main.components.server.logEvent('editor', 'instructor')
  109. });
  110. this.tag.find('.blockpy-mode-set-split').click(function() {
  111. main.model.settings.editor("Split");
  112. main.components.server.logEvent('editor', 'split')
  113. });
  114. this.tag.find('.blockpy-toolbar-import').click(function() {
  115. main.components.corgis.openDialog();
  116. main.components.server.logEvent('editor', 'import')
  117. });
  118. this.tag.find('.blockpy-toolbar-history').click(function() {
  119. main.components.history.openDialog();
  120. main.components.server.logEvent('editor', 'history')
  121. });
  122. this.tag.find('.blockpy-toolbar-english').click(function() {
  123. main.components.english.openDialog();
  124. main.components.server.logEvent('editor', 'english')
  125. });
  126. }</code></pre>
  127. </article>
  128. </section>
  129. </div>
  130. <nav>
  131. <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="BlockPy.html">BlockPy</a></li><li><a href="BlockPyCorgis.html">BlockPyCorgis</a></li><li><a href="BlockPyDialog.html">BlockPyDialog</a></li><li><a href="BlockPyEditor.html">BlockPyEditor</a></li><li><a href="BlockPyEngine.html">BlockPyEngine</a></li><li><a href="BlockPyEnglish.html">BlockPyEnglish</a></li><li><a href="BlockPyFeedback.html">BlockPyFeedback</a></li><li><a href="BlockPyHistory.html">BlockPyHistory</a></li><li><a href="BlockPyPresentation.html">BlockPyPresentation</a></li><li><a href="BlockPyPrinter.html">BlockPyPrinter</a></li><li><a href="BlockPyServer.html">BlockPyServer</a></li><li><a href="BlockPyToolbar.html">BlockPyToolbar</a></li><li><a href="LocalStorageWrapper.html">LocalStorageWrapper</a></li><li><a href="PythonToBlocks.html">PythonToBlocks</a></li></ul><h3>Global</h3><ul><li><a href="global.html#BlockPyInterface">BlockPyInterface</a></li><li><a href="global.html#cloneNode">cloneNode</a></li><li><a href="global.html#encodeHTML">encodeHTML</a></li><li><a href="global.html#expandArray">expandArray</a></li><li><a href="global.html#EXTENDED_ERROR_EXPLANATION">EXTENDED_ERROR_EXPLANATION</a></li><li><a href="global.html#indent">indent</a></li><li><a href="global.html#instructor_module">instructor_module</a></li><li><a href="global.html#prettyPrintDateTime">prettyPrintDateTime</a></li><li><a href="global.html#randomInteger">randomInteger</a></li><li><a href="global.html#set_button_loaded">set_button_loaded</a></li><li><a href="global.html#timerGuard">timerGuard</a></li></ul>
  132. </nav>
  133. <br class="clear">
  134. <footer>
  135. Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.3</a> on Sun Mar 26 2017 09:45:03 GMT-0400 (Eastern Daylight Time)
  136. </footer>
  137. <script> prettyPrint(); </script>
  138. <script src="scripts/linenumber.js"> </script>
  139. </body>
  140. </html>