Added button to maximise the output window

This commit is contained in:
n1474335 2016-12-20 20:18:16 +00:00
parent a9f15b2c64
commit 9c1fb7ddf4
14 changed files with 328 additions and 98 deletions

View file

@ -205,14 +205,14 @@ HTMLApp.prototype.populate_operations_list = function() {
* Sets up the adjustable splitter to allow the user to resize areas of the page.
*/
HTMLApp.prototype.initialise_splitter = function() {
Split(["#operations", "#recipe", "#IO"], {
this.column_splitter = Split(["#operations", "#recipe", "#IO"], {
sizes: [20, 30, 50],
minSize: [240, 325, 500],
gutterSize: 4,
onDrag: this.manager.controls.adjust_width.bind(this.manager.controls)
});
Split(["#input", "#output"], {
this.io_splitter = Split(["#input", "#output"], {
direction: "vertical",
gutterSize: 4,
});
@ -463,11 +463,8 @@ HTMLApp.prototype.set_recipe_config = function(recipe_config) {
* Resets the splitter positions to default.
*/
HTMLApp.prototype.reset_layout = function() {
document.getElementById("operations").style.width = "calc(20% - 2px)";
document.getElementById("recipe").style.width = "calc(30% - 4px)";
document.getElementById("IO").style.width = "calc(50% - 2px)";
document.getElementById("input").style.height = "calc(50% - 2px)";
document.getElementById("output").style.height = "calc(50% - 2px)";
this.column_splitter.setSizes([20, 30, 50]);
this.io_splitter.setSizes([50, 50]);
this.manager.controls.adjust_width();
};

View file

@ -125,6 +125,7 @@ Manager.prototype.initialise_event_listeners = function() {
document.getElementById("save-to-file").addEventListener("click", this.output.save_click.bind(this.output));
document.getElementById("switch").addEventListener("click", this.output.switch_click.bind(this.output));
document.getElementById("undo-switch").addEventListener("click", this.output.undo_switch_click.bind(this.output));
document.getElementById("maximise-output").addEventListener("click", this.output.maximise_output_click.bind(this.output));
document.getElementById("output-text").addEventListener("scroll", this.highlighter.output_scroll.bind(this.highlighter));
document.getElementById("output-text").addEventListener("mouseup", this.highlighter.output_mouseup.bind(this.highlighter));
document.getElementById("output-text").addEventListener("mousemove", this.highlighter.output_mousemove.bind(this.highlighter));

View file

@ -137,3 +137,23 @@ OutputWaiter.prototype.undo_switch_click = function() {
this.app.set_input(this.switch_orig_data);
document.getElementById("undo-switch").disabled = true;
};
/**
* Handler for maximise output click events.
* Resizes the output frame to be as large as possible, or restores it to its original size.
*/
OutputWaiter.prototype.maximise_output_click = function(e) {
var el = e.target;
if (el.textContent.indexOf("Max") >= 0) {
this.app.column_splitter.collapse(0);
this.app.column_splitter.collapse(1);
this.app.io_splitter.collapse(0);
el.innerHTML = "<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAlUlEQVQ4y93RwQpBQRQG4C9ba1fxBteGPIj38BTejFJKLFnwCJIiCsW1mcV0k9yx82/OzGK+OXMGOpiiLTFjFNiilQI0sQ7IJiAjLKsgGVYB2YdaVO0kwy46/BVQi9ZDNPyQWen2ub/KufS8y7shfkq9tF9U7SC+/YluKvAI9YZeFeCECXJcA3JHP2WgMXJM/ZUcBwxeM+YuSWTgMtUAAAAASUVORK5CYII='> Restore";
} else {
this.app.reset_layout();
el.innerHTML = "<img src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAi0lEQVQ4y83TMQrCQBCF4S+5g4rJEdJ7KE+RQ1lrIQQCllroEULuoM0Ww3a7aXwwLAzMPzDvLcz4hnooUItT1rsoVNy+4lgLWNL7RlcCmDBij2eCfNCrUITc0dRCrhj8m5otw0O6SV8LuAV3uhrAAa8sJ2Np7KPFawhgscVLjH9bCDhjt8WNKft88w/HjCvuVqu53QAAAABJRU5ErkJggg=='> Max";
}
};