diff --git a/editor/editor_utility.php b/editor/editor_utility.php
index 39a5a4d48cab5c18150c2f12fe718685b8acc4df..70a5099091a7f7734a7c072b7cd70cbc28a248c2 100644
--- a/editor/editor_utility.php
+++ b/editor/editor_utility.php
@@ -57,172 +57,23 @@ class vpl_editor_util {
$PAGE->requires->js_init_call('M.util.init_colour_picker', array('interfacetheme-colorpicker-secondary'));
echo '<style type="text/css" title="custom-interfacetheme-css"></style>';
}
+
public static function print_editor() {
global $OUTPUT;
- echo $OUTPUT->box_start();
-?>
-<div id="vplide" class="vpl_ide vpl_ide_root vpl_theme_<?php p(get_user_preferences('vpl_interfacetheme', 'modernblue'))?>">
- <div id="vpl_menu" class="vpl_ide_menu"></div>
- <div id="vpl_tr" class="vpl_ide_tr">
- <div id="vpl_filelist" style="display: none;">
- <div id="vpl_filelist_header"><?php p(get_string('filelist', VPL));?></div>
- <div id="vpl_filelist_content"></div>
- </div>
- <div id="vpl_tabs" class="vpl_ide_tabs">
- <div id="vpl_tabs_scroll">
- <ul id="vpl_tabs_ul"></ul>
- </div>
- </div>
- <div id="vpl_results" class="vpl_ide_results">
- <div id="vpl_results_accordion"></div>
- </div>
- </div>
- <div id="vpl_ide_dialog_new" class="vpl_ide_dialog"
- style="display: none;">
- <fieldset>
- <label for="vpl_ide_input_newfilename">
- <?php p(get_string('new_file_name', VPL));?></label> <input
- type="text" id="vpl_ide_input_newfilename"
- name="vpl_ide_input_newfilename" value=""
- class="ui-widget-content ui-corner-all" autofocus /><br>
- </fieldset>
- </div>
- <div id="vpl_ide_dialog_rename" class="vpl_ide_dialog"
- style="display: none;">
- <fieldset>
- <label for="vpl_ide_input_renamefilename">
- <?php p(get_string('rename'));?></label> <input
- type="text" id="vpl_ide_input_renamefilename"
- name="vpl_ide_input_renamefilename" value=""
- class="ui-widget-content ui-corner-all" autofocus /><br>
- </fieldset>
- </div>
- <div id="vpl_ide_dialog_delete" class="vpl_ide_dialog"
- style="display: none;">
- <fieldset>
- <label for="vpl_ide_input_deletefilename">
- <?php p(get_string('delete'));?></label> <input
- type="text" id="vpl_ide_input_deletefilename"
- name="vpl_ide_input_deletefilename" value=""
- class="ui-widget-content ui-corner-all" autofocus /><br>
- </fieldset>
- </div>
- <div id="vpl_ide_dialog_sort" class="vpl_ide_dialog"
- style="display: none;">
- <ol id="vpl_sort_list"></ol>
- </div>
- <div id="vpl_ide_dialog_multidelete" class="vpl_ide_dialog"
- style="display: none;">
- <fieldset id="vpl_multidelete_list"></fieldset>
- </div>
- <div id="vpl_ide_dialog_fontsize" class="vpl_ide_dialog"
- style="display: none;">
- <div class="vpl_fontsize_slider_value"></div>
- <div class="vpl_fontsize_slider"></div>
- </div>
- <div id="vpl_ide_dialog_theme" class="vpl_ide_dialog" style="display: none;">
- <span><?php p(get_string('acetheme', VPL));?></span>
- <select class="acetheme">
- <?php
- foreach (self::get_installed_themes() as $theme => $name) {
- echo '<option value="' . $theme . '">' . $name . '</option>';
- }
- ?>
- </select>
- <hr>
- <span><?php p(get_string('interfacetheme', VPL));?></span>
- <select class="interfacetheme">
- <option value="default"><?php p(get_string('default'));?></option>
- <option value="modernblue"><?php p('Modern Blue');?></option>
- <option value="custom"><?php p(get_string('custom', VPL));?></option>
- </select>
- <div class="custom-theme-colorpicker">
- <br>
- <span><?php p(get_string('primarycolor', VPL));?></span>
- <input type="text" id="interfacetheme-colorpicker-primary"
- value="<?php p(get_user_preferences('vpl_custom_interface_theme_color_primary', '#000000'));?>">
- <div class="admin_colourpicker"></div>
- </div>
- <div class="custom-theme-colorpicker">
- <span><?php p(get_string('secondarycolor', VPL));?></span>
- <input type="text" id="interfacetheme-colorpicker-secondary"
- value="<?php p(get_user_preferences('vpl_custom_interface_theme_color_secondary', '#FFFFFF'));?>">
- <div class="admin_colourpicker"></div>
- </div>
- </div>
- <div id="vpl_ide_dialog_comments" class="vpl_ide_dialog"
- style="display: none;">
- <fieldset>
- <label for="vpl_ide_input_comments">
- <?php p(get_string('comments', VPL));?></label> <textarea
- id="vpl_ide_input_comments" name="vpl_ide_input_comments"
- class="ui-widget-content ui-corner-all" autofocus ></textarea>
- </fieldset>
- </div>
- <div id="vpl_ide_dialog_about" class="vpl_ide_dialog"
- style="display: none;">
- <div>
- <h3>IDE for VPL</h3>
- This IDE is part of VPL <a href="http://vpl.dis.ulpgc.es"
- target="_blank">Virtual Programming Lab for Moodle</a><br> Author:
- Juan Carlos RodrÃguez del Pino <jcrodriguez@dis.ulpgc.es><br>
- Licence: <a href="http://www.gnu.org/copyleft/gpl.html"
- target="_blank">GNU GPL v3</a><br> This software uses/includes the
- following software under the corresponding licence:
- <ul>
- <li><a href="http://ace.c9.io" target="_blank">ACE</a>: an embeddable
- code editor written in JavaScript. Copyright (c) 2010, Ajax.org B.V.
- (<a href="../editor/ace9/LICENSE" target="_blank">licence</a>)</li>
- <li><a href="https://github.com/chjj/term.js/" target="_blank">term.js</a>:
- A full xterm clone written in javascript. Copyright (c) 2012-2013,
- Christopher Jeffrey (MIT License)</li>
- <li><a href="http://kanaka.github.io/noVNC/" target="_blank">noVNC</a>:
- VNC client using HTML5 (WebSockets, Canvas). noVNC is Copyright (C)
- 2011 Joel Martin <github@martintribe.org> (<a
- href="../editor/noVNC/LICENSE.txt" target="_blank">licence</a>)</li>
- <li>unzip.js: August Lilleaas</li>
- <li>inflate.js: August Lilleaas and Masanao Izumo <iz@onicos.co.jp></li>
- <li><a href="https://developers.google.com/blockly" target="_blank">Blockly</a>:
- A library for building visual programming editors
- (<a href="../editor/blockly/LICENSE" target="_blank">licence</a>)</li>
- <li><a href="https://github.com/NeilFraser/JS-Interpreter" target="_blank">JS-Interpreter</a>:
- A sandboxed JavaScript interpreter in JavaScript
- (<a href="../editor/acorn/LICENSE" target="_blank">licence</a>)</li>
- </ul>
- </div>
- </div>
- <form style="display: none;">
- <input type="file" multiple="multiple" id="vpl_ide_input_file" />
- </form>
- <div id="vpl_ide_dialog_shortcuts" class="vpl_ide_dialog" style="display: none;" >
- <div class="vpl_ide_dialog_content"></div>
- </div>
- <div id="vpl_dialog_terminal">
- <pre id="vpl_terminal" class="vpl_terminal"></pre>
- </div>
- <div id="vpl_dialog_terminal_clipboard" class="vpl_ide_dialog vpl_clipboard" style="display: none;">
- <div class="vpl_clipboard_label1"></div><br>
- <textarea readonly="readonly" class="vpl_clipboard_entry1"></textarea><br>
- <div class="vpl_clipboard_label2"></div><br>
- <textarea class="vpl_clipboard_entry2"></textarea>
- </div>
- <div id="vpl_dialog_vnc_clipboard" class="vpl_ide_dialog vpl_clipboard" style="display: none;">
- <div class="vpl_clipboard_label1"></div><br>
- <textarea readonly="readonly" class="vpl_clipboard_entry1"></textarea><br>
- <div class="vpl_clipboard_label2"></div><br>
- <textarea class="vpl_clipboard_entry2"></textarea>
- </div>
- <div id="vpl_dialog_vnc" style="display: none;">
- <canvas class="vpl_noVNC_canvas">
- Canvas not supported.
- </canvas>
- </div>
-</div>
-<?php
- echo $OUTPUT->box_end();
+ $context = new stdClass();
+ $context->currenttheme = get_user_preferences('vpl_interfacetheme', 'modernblue');
+ $context->currentprimarycolor = get_user_preferences('vpl_custom_interface_theme_color_primary', '#000000');
+ $context->currentsecondarycolor = get_user_preferences('vpl_custom_interface_theme_color_secondary', '#FFFFFF');
+ $context->installedthemes = array();
+ foreach (self::get_installed_themes() as $id => $name) {
+ $theme = new stdClass();
+ $theme->id = $id;
+ $theme->name = $name;
+ $context->installedthemes[] = $theme;
+ }
+ echo $OUTPUT->box($OUTPUT->render_from_template('mod_vpl/editor', $context));
}
-
public static function strings_for_js() {
global $PAGE;
$PAGE->requires->strings_for_js(
diff --git a/templates/editor.mustache b/templates/editor.mustache
new file mode 100644
index 0000000000000000000000000000000000000000..3edc4839976a19c6cb833842a546abdf16857f78
--- /dev/null
+++ b/templates/editor.mustache
@@ -0,0 +1,208 @@
+{{!
+ This file is part of Moodle - http://moodle.org/
+
+ Moodle is free software: you can redistribute it and/or modify
+ it under the terms of the GNU General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+
+ Moodle is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License
+ along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+ @template mod_vpl/editor
+
+ Classes required for JS:
+ * none
+
+ Data attributes required for JS:
+ * none
+
+ Context variables required for this template:
+ * currenttheme Current interface theme.
+ * installedthemes Array of all installed editor themes.
+ * id Editor theme actual name.
+ * name Editor theme displayable name.
+ * currentprimarycolor Current primary color for custom interface theme.
+ * currentsecondarycolor Current secondary color for custom interface theme.
+
+ Example context (json):
+ {
+ "currenttheme": "custom",
+ "installedthemes": [
+ {
+ "id": "ambiance",
+ "name": "Ambiance"
+ },
+ {
+ "id": "chrome",
+ "name": "Chrome"
+ }
+ ]
+ "currentprimarycolor": "#000000",
+ "currentsecondarycolor": "#FFFFFF"
+ }
+}}
+<div id="vplide" class="vpl_ide vpl_ide_root vpl_theme_{{currenttheme}}">
+ <div id="vpl_menu" class="vpl_ide_menu"></div>
+ <div id="vpl_tr" class="vpl_ide_tr">
+ <div id="vpl_filelist" style="display: none;">
+ <div id="vpl_filelist_header">{{# str}} filelist, mod_vpl {{/ str}}</div>
+ <div id="vpl_filelist_content"></div>
+ </div>
+ <div id="vpl_tabs" class="vpl_ide_tabs">
+ <div id="vpl_tabs_scroll">
+ <ul id="vpl_tabs_ul"></ul>
+ </div>
+ </div>
+ <div id="vpl_results" class="vpl_ide_results">
+ <div id="vpl_results_accordion"></div>
+ </div>
+ </div>
+ <div id="vpl_ide_dialog_new" class="vpl_ide_dialog" style="display: none;">
+ <fieldset>
+ <label for="vpl_ide_input_newfilename">{{# str}} new_file_name, mod_vpl {{/ str}}</label>
+ <input
+ type="text" id="vpl_ide_input_newfilename"
+ name="vpl_ide_input_newfilename" value=""
+ class="ui-widget-content ui-corner-all" autofocus />
+ <br>
+ </fieldset>
+ </div>
+ <div id="vpl_ide_dialog_rename" class="vpl_ide_dialog" style="display: none;">
+ <fieldset>
+ <label for="vpl_ide_input_renamefilename">{{# str}} rename, moodle {{/ str}}</label>
+ <input
+ type="text" id="vpl_ide_input_renamefilename"
+ name="vpl_ide_input_renamefilename" value=""
+ class="ui-widget-content ui-corner-all" autofocus />
+ <br>
+ </fieldset>
+ </div>
+ <div id="vpl_ide_dialog_delete" class="vpl_ide_dialog" style="display: none;">
+ <fieldset>
+ <label for="vpl_ide_input_deletefilename">{{# str}} delete, moodle {{/ str}}</label>
+ <input
+ type="text" id="vpl_ide_input_deletefilename"
+ name="vpl_ide_input_deletefilename" value=""
+ class="ui-widget-content ui-corner-all" autofocus />
+ <br>
+ </fieldset>
+ </div>
+ <div id="vpl_ide_dialog_sort" class="vpl_ide_dialog" style="display: none;">
+ <ol id="vpl_sort_list"></ol>
+ </div>
+ <div id="vpl_ide_dialog_multidelete" class="vpl_ide_dialog" style="display: none;">
+ <fieldset id="vpl_multidelete_list"></fieldset>
+ </div>
+ <div id="vpl_ide_dialog_fontsize" class="vpl_ide_dialog" style="display: none;">
+ <div class="vpl_fontsize_slider_value"></div>
+ <div class="vpl_fontsize_slider"></div>
+ </div>
+ <div id="vpl_ide_dialog_theme" class="vpl_ide_dialog" style="display: none;">
+ <span>{{# str}} acetheme, mod_vpl {{/ str}}</span>
+ <select class="acetheme">
+ {{# installedthemes}}
+ <option value="{{id}}">{{name}}</option>
+ {{/ installedthemes}}
+ </select>
+ <hr>
+ <span>{{# str}} interfacetheme, mod_vpl {{/ str}}</span>
+ <select class="interfacetheme">
+ <option value="default">{{# str}} default, moodle {{/ str}}</option>
+ <option value="modernblue">Modern Blue</option>
+ <option value="custom">{{# str}} custom, mod_vpl {{/ str}}</option>
+ </select>
+ <div class="custom-theme-colorpicker">
+ <br>
+ <span>{{# str}} primarycolor, mod_vpl {{/ str}}</span>
+ <input type="text" id="interfacetheme-colorpicker-primary" value="{{currentprimarycolor}}" />
+ <div class="admin_colourpicker"></div>
+ </div>
+ <div class="custom-theme-colorpicker">
+ <span>{{# str}} secondarycolor, mod_vpl {{/ str}}</span>
+ <input type="text" id="interfacetheme-colorpicker-secondary" value="{{currentsecondarycolor}}" />
+ <div class="admin_colourpicker"></div>
+ </div>
+ </div>
+ <div id="vpl_ide_dialog_comments" class="vpl_ide_dialog" style="display: none;">
+ <fieldset>
+ <label for="vpl_ide_input_comments">{{# str}} comments, mod_vpl {{/ str}}</label>
+ <textarea id="vpl_ide_input_comments" name="vpl_ide_input_comments" class="ui-widget-content ui-corner-all" autofocus>
+ </textarea>
+ </fieldset>
+ </div>
+ <div id="vpl_ide_dialog_about" class="vpl_ide_dialog" style="display: none;">
+ <div>
+ <h3>IDE for VPL</h3>
+ This IDE is part of VPL <a href="http://vpl.dis.ulpgc.es" target="_blank">Virtual Programming Lab for Moodle</a><br>
+ Author: Juan Carlos Rodríguez del Pino <jcrodriguez@dis.ulpgc.es><br>
+ Licence: <a href="http://www.gnu.org/copyleft/gpl.html" target="_blank">GNU GPL v3</a><br>
+ This software uses/includes the following software under the corresponding licence:
+ <ul>
+ <li>
+ <a href="http://ace.c9.io" target="_blank">ACE</a>:
+ an embeddable code editor written in JavaScript. Copyright (c) 2010, Ajax.org B.V.
+ (<a href="../editor/ace9/LICENSE" target="_blank">licence</a>)
+ </li>
+ <li>
+ <a href="https://github.com/chjj/term.js/" target="_blank">term.js</a>:
+ A full xterm clone written in javascript. Copyright (c) 2012-2013, Christopher Jeffrey
+ (MIT License)
+ </li>
+ <li>
+ <a href="http://kanaka.github.io/noVNC/" target="_blank">noVNC</a>:
+ VNC client using HTML5 (WebSockets, Canvas). noVNC is Copyright (C) 2011 Joel Martin <github@martintribe.org>
+ (<a href="../editor/noVNC/LICENSE.txt" target="_blank">licence</a>)
+ </li>
+ <li>
+ unzip.js: August Lilleaas
+ </li>
+ <li>
+ inflate.js: August Lilleaas and Masanao Izumo <iz@onicos.co.jp>
+ </li>
+ <li>
+ <a href="https://developers.google.com/blockly" target="_blank">Blockly</a>:
+ A library for building visual programming editors
+ (<a href="../editor/blockly/LICENSE" target="_blank">licence</a>)
+ </li>
+ <li>
+ <a href="https://github.com/NeilFraser/JS-Interpreter" target="_blank">JS-Interpreter</a>:
+ A sandboxed JavaScript interpreter in JavaScript
+ (<a href="../editor/acorn/LICENSE" target="_blank">licence</a>)
+ </li>
+ </ul>
+ </div>
+ </div>
+ <form style="display: none;">
+ <input type="file" multiple="multiple" id="vpl_ide_input_file" />
+ </form>
+ <div id="vpl_ide_dialog_shortcuts" class="vpl_ide_dialog" style="display: none;" >
+ <div class="vpl_ide_dialog_content"></div>
+ </div>
+ <div id="vpl_dialog_terminal">
+ <pre id="vpl_terminal" class="vpl_terminal"></pre>
+ </div>
+ <div id="vpl_dialog_terminal_clipboard" class="vpl_ide_dialog vpl_clipboard" style="display: none;">
+ <div class="vpl_clipboard_label1"></div><br>
+ <textarea readonly="readonly" class="vpl_clipboard_entry1"></textarea><br>
+ <div class="vpl_clipboard_label2"></div><br>
+ <textarea class="vpl_clipboard_entry2"></textarea>
+ </div>
+ <div id="vpl_dialog_vnc_clipboard" class="vpl_ide_dialog vpl_clipboard" style="display: none;">
+ <div class="vpl_clipboard_label1"></div><br>
+ <textarea readonly="readonly" class="vpl_clipboard_entry1"></textarea><br>
+ <div class="vpl_clipboard_label2"></div><br>
+ <textarea class="vpl_clipboard_entry2"></textarea>
+ </div>
+ <div id="vpl_dialog_vnc" style="display: none;">
+ <canvas class="vpl_noVNC_canvas">
+ Canvas not supported.
+ </canvas>
+ </div>
+</div>
\ No newline at end of file