CyberChef/docs/views_html_Manager.js.html
2016-11-28 11:01:54 +00:00

494 lines
22 KiB
HTML
Executable file

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>CyberChef Source: views/html/Manager.js</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/sunlight.default.css">
<link type="text/css" rel="stylesheet" href="styles/site.cerulean.css">
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top navbar-inverse">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="index.html"><img class="branding-logo" src="../build/prod/images/cyberchef-32x32.png"
alt="logo"/>CyberChef</a>
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#topNavigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="topNavigation">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="namespaces.list.html" class="dropdown-toggle" data-toggle="dropdown">Namespaces<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="FlowControl.html">FlowControl</a></li><li><a href="Utils.html">Utils</a></li><li><a href="Base.html">Base</a></li><li><a href="Base64.html">Base64</a></li><li><a href="BitwiseOp.html">BitwiseOp</a></li><li><a href="ByteRepr.html">ByteRepr</a></li><li><a href="CharEnc.html">CharEnc</a></li><li><a href="Checksum.html">Checksum</a></li><li><a href="Cipher.html">Cipher</a></li><li><a href="Code.html">Code</a></li><li><a href="Compress.html">Compress</a></li><li><a href="Convert.html">Convert</a></li><li><a href="DateTime.html">DateTime</a></li><li><a href="Endian.html">Endian</a></li><li><a href="Entropy.html">Entropy</a></li><li><a href="Extract.html">Extract</a></li><li><a href="FileType.html">FileType</a></li><li><a href="HTML.html">HTML</a></li><li><a href="HTTP.html">HTTP</a></li><li><a href="Hash.html">Hash</a></li><li><a href="Hexdump.html">Hexdump</a></li><li><a href="IP.html">IP</a></li><li><a href="JS.html">JS</a></li><li><a href="MAC.html">MAC</a></li><li><a href="Numberwang.html">Numberwang</a></li><li><a href="OS.html">OS</a></li><li><a href="PublicKey.html">PublicKey</a></li><li><a href="Punycode.html">Punycode</a></li><li><a href="QuotedPrintable.html">QuotedPrintable</a></li><li><a href="Rotate.html">Rotate</a></li><li><a href="SeqUtils.html">SeqUtils</a></li><li><a href="StrUtils.html">StrUtils</a></li><li><a href="Tidy.html">Tidy</a></li><li><a href="URL_.html">URL_</a></li><li><a href="UUID.html">UUID</a></li><li><a href="Unicode.html">Unicode</a></li>
</ul>
</li>
<li class="dropdown">
<a href="classes.list.html" class="dropdown-toggle" data-toggle="dropdown">Classes<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="Chef.html">Chef</a></li><li><a href="Dish.html">Dish</a></li><li><a href="Ingredient.html">Ingredient</a></li><li><a href="Operation.html">Operation</a></li><li><a href="Recipe.html">Recipe</a></li><li><a href="ControlsWaiter.html">ControlsWaiter</a></li><li><a href="HTMLApp.html">HTMLApp</a></li><li><a href="HTMLCategory.html">HTMLCategory</a></li><li><a href="HTMLIngredient.html">HTMLIngredient</a></li><li><a href="HTMLOperation.html">HTMLOperation</a></li><li><a href="HighlighterWaiter.html">HighlighterWaiter</a></li><li><a href="InputWaiter.html">InputWaiter</a></li><li><a href="Manager.html">Manager</a></li><li><a href="OperationsWaiter.html">OperationsWaiter</a></li><li><a href="OptionsWaiter.html">OptionsWaiter</a></li><li><a href="OutputWaiter.html">OutputWaiter</a></li><li><a href="RecipeWaiter.html">RecipeWaiter</a></li><li><a href="SeasonalWaiter.html">SeasonalWaiter</a></li><li><a href="WindowWaiter.html">WindowWaiter</a></li>
</ul>
</li>
<li class="dropdown">
<a href="events.list.html" class="dropdown-toggle" data-toggle="dropdown">Events<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="Manager.html#event:appstart">Manager#event:appstart</a></li><li><a href="Manager.html#event:operationadd">Manager#event:operationadd</a></li><li><a href="Manager.html#event:operationremove">Manager#event:operationremove</a></li><li><a href="Manager.html#event:oplistcreate">Manager#event:oplistcreate</a></li><li><a href="Manager.html#event:statechange">Manager#event:statechange</a></li>
</ul>
</li>
<li class="dropdown">
<a href="global.html" class="dropdown-toggle" data-toggle="dropdown">Global<b class="caret"></b></a>
<ul class="dropdown-menu inline">
<li><a href="global.html#Categories">Categories</a></li><li><a href="global.html#OperationConfig">OperationConfig</a></li><li><a href="global.html#main">main</a></li>
</ul>
</li>
</ul>
<div class="col-sm-3 col-md-3">
<form class="navbar-form" role="search">
<div class="input-group">
<input type="text" class="form-control" placeholder="Search" name="q" id="search-input">
<div class="input-group-btn">
<button class="btn btn-default" id="search-submit"><i class="glyphicon glyphicon-search"></i></button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="container" id="toc-content">
<div class="row">
<div class="col-md-12">
<div id="main">
<h1 class="page-title">Source: views/html/Manager.js</h1>
<section>
<article>
<pre
class="sunlight-highlight-javascript linenums">/**
* This object controls the Waiters responsible for handling events from all areas of the app.
*
* @author n1474335 [n1474335@gmail.com]
* @copyright Crown Copyright 2016
* @license Apache-2.0
*
* @constructor
* @param {HTMLApp} app - The main view object for CyberChef.
*/
var Manager = function(app) {
this.app = app;
// Define custom events
/**
* @event Manager#appstart
*/
this.appstart = new CustomEvent("appstart", {bubbles: true});
/**
* @event Manager#operationadd
*/
this.operationadd = new CustomEvent("operationadd", {bubbles: true});
/**
* @event Manager#operationremove
*/
this.operationremove = new CustomEvent("operationremove", {bubbles: true});
/**
* @event Manager#oplistcreate
*/
this.oplistcreate = new CustomEvent("oplistcreate", {bubbles: true});
/**
* @event Manager#statechange
*/
this.statechange = new CustomEvent("statechange", {bubbles: true});
// Define Waiter objects to handle various areas
this.window = new WindowWaiter(this.app);
this.controls = new ControlsWaiter(this.app, this);
this.recipe = new RecipeWaiter(this.app, this);
this.ops = new OperationsWaiter(this.app, this);
this.input = new InputWaiter(this.app, this);
this.output = new OutputWaiter(this.app, this);
this.options = new OptionsWaiter(this.app);
this.highlighter = new HighlighterWaiter(this.app);
this.seasonal = new SeasonalWaiter(this.app, this);
// Object to store dynamic handlers to fire on elements that may not exist yet
this.dynamic_handlers = {};
this.initialise_event_listeners();
};
/**
* Sets up the various components and listeners.
*/
Manager.prototype.setup = function() {
this.recipe.initialise_operation_drag_n_drop();
this.controls.auto_bake_change();
this.seasonal.load();
};
/**
* Main function to handle the creation of the event listeners.
*/
Manager.prototype.initialise_event_listeners = function() {
// Global
window.addEventListener("resize", this.window.window_resize.bind(this.window));
window.addEventListener("blur", this.window.window_blur.bind(this.window));
window.addEventListener("focus", this.window.window_focus.bind(this.window));
window.addEventListener("statechange", this.app.state_change.bind(this.app));
window.addEventListener("popstate", this.app.pop_state.bind(this.app));
// Controls
document.getElementById("bake").addEventListener("click", this.controls.bake_click.bind(this.controls));
document.getElementById("auto-bake").addEventListener("change", this.controls.auto_bake_change.bind(this.controls));
document.getElementById("step").addEventListener("click", this.controls.step_click.bind(this.controls));
document.getElementById("clr-recipe").addEventListener("click", this.controls.clear_recipe_click.bind(this.controls));
document.getElementById("clr-breaks").addEventListener("click", this.controls.clear_breaks_click.bind(this.controls));
document.getElementById("save").addEventListener("click", this.controls.save_click.bind(this.controls));
document.getElementById("save-button").addEventListener("click", this.controls.save_button_click.bind(this.controls));
document.getElementById("save-link-recipe-checkbox").addEventListener("change", this.controls.slr_check_change.bind(this.controls));
document.getElementById("save-link-input-checkbox").addEventListener("change", this.controls.sli_check_change.bind(this.controls));
document.getElementById("load").addEventListener("click", this.controls.load_click.bind(this.controls));
document.getElementById("load-delete-button").addEventListener("click", this.controls.load_delete_click.bind(this.controls));
document.getElementById("load-name").addEventListener("change", this.controls.load_name_change.bind(this.controls));
document.getElementById("load-button").addEventListener("click", this.controls.load_button_click.bind(this.controls));
this.add_multi_event_listener("#save-text", "keyup paste", this.controls.save_text_change, this.controls);
// Operations
this.add_multi_event_listener("#search", "keyup paste search", this.ops.search_operations, this.ops);
this.add_dynamic_listener(".op_list li.operation", "dblclick", this.ops.operation_dblclick, this.ops);
document.getElementById("edit-favourites").addEventListener("click", this.ops.edit_favourites_click.bind(this.ops));
document.getElementById("save-favourites").addEventListener("click", this.ops.save_favourites_click.bind(this.ops));
document.getElementById("reset-favourites").addEventListener("click", this.ops.reset_favourites_click.bind(this.ops));
this.add_dynamic_listener(".op_list .op-icon", "mouseover", this.ops.op_icon_mouseover, this.ops);
this.add_dynamic_listener(".op_list .op-icon", "mouseleave", this.ops.op_icon_mouseleave, this.ops);
this.add_dynamic_listener(".op_list", "oplistcreate", this.ops.op_list_create, this.ops);
this.add_dynamic_listener("li.operation", "operationadd", this.recipe.op_add.bind(this.recipe));
// Recipe
this.add_dynamic_listener(".arg", "keyup", this.recipe.ing_change, this.recipe);
this.add_dynamic_listener(".arg", "change", this.recipe.ing_change, this.recipe);
this.add_dynamic_listener(".disable-icon", "click", this.recipe.disable_click, this.recipe);
this.add_dynamic_listener(".breakpoint", "click", this.recipe.breakpoint_click, this.recipe);
this.add_dynamic_listener("#rec_list li.operation", "dblclick", this.recipe.operation_dblclick, this.recipe);
this.add_dynamic_listener("#rec_list li.operation > div", "dblclick", this.recipe.operation_child_dblclick, this.recipe);
this.add_dynamic_listener("#rec_list .input-group .dropdown-menu a", "click", this.recipe.dropdown_toggle_click, this.recipe);
this.add_dynamic_listener("#rec_list", "operationremove", this.recipe.op_remove.bind(this.recipe));
// Input
this.add_multi_event_listener("#input-text", "keyup paste", this.input.input_change, this.input);
document.getElementById("reset-layout").addEventListener("click", this.app.reset_layout.bind(this.app));
document.getElementById("clr-io").addEventListener("click", this.input.clear_io_click.bind(this.input));
document.getElementById("input-text").addEventListener("dragover", this.input.input_dragover.bind(this.input));
document.getElementById("input-text").addEventListener("dragleave", this.input.input_dragleave.bind(this.input));
document.getElementById("input-text").addEventListener("drop", this.input.input_drop.bind(this.input));
document.getElementById("input-text").addEventListener("scroll", this.highlighter.input_scroll.bind(this.highlighter));
document.getElementById("input-text").addEventListener("mouseup", this.highlighter.input_mouseup.bind(this.highlighter));
document.getElementById("input-text").addEventListener("mousemove", this.highlighter.input_mousemove.bind(this.highlighter));
this.add_multi_event_listener("#input-text", "mousedown dblclick select", this.highlighter.input_mousedown, this.highlighter);
// Output
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("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));
document.getElementById("output-html").addEventListener("mouseup", this.highlighter.output_html_mouseup.bind(this.highlighter));
document.getElementById("output-html").addEventListener("mousemove", this.highlighter.output_html_mousemove.bind(this.highlighter));
this.add_multi_event_listener("#output-text", "mousedown dblclick select", this.highlighter.output_mousedown, this.highlighter);
this.add_multi_event_listener("#output-html", "mousedown dblclick select", this.highlighter.output_html_mousedown, this.highlighter);
// Options
document.getElementById("options").addEventListener("click", this.options.options_click.bind(this.options));
document.getElementById("reset-options").addEventListener("click", this.options.reset_options_click.bind(this.options));
$(".option-item input:checkbox").on("switchChange.bootstrapSwitch", this.options.switch_change.bind(this.options));
$(".option-item input:checkbox").on("switchChange.bootstrapSwitch", this.options.set_word_wrap.bind(this.options));
this.add_dynamic_listener(".option-item input[type=number]", "keyup", this.options.number_change, this.options);
this.add_dynamic_listener(".option-item input[type=number]", "change", this.options.number_change, this.options);
this.add_dynamic_listener(".option-item select", "change", this.options.select_change, this.options);
// Misc
document.getElementById("alert-close").addEventListener("click", this.app.alert_close_click.bind(this.app));
};
/**
* Adds an event listener to each element in the specified group.
*
* @param {string} selector - A selector string for the element group to add the event to, see
* this.get_all()
* @param {string} event_type - The event to listen for
* @param {function} callback - The function to execute when the event is triggered
* @param {Object} [scope=this] - The object to bind to the callback function
*
* @example
* // Calls the clickable function whenever any element with the .clickable class is clicked
* this.add_listeners(".clickable", "click", this.clickable, this);
*/
Manager.prototype.add_listeners = function(selector, event_type, callback, scope) {
scope = scope || this;
[].forEach.call(document.querySelectorAll(selector), function(el) {
el.addEventListener(event_type, callback.bind(scope));
});
};
/**
* Adds multiple event listeners to the specified element.
*
* @param {string} selector - A selector string for the element to add the events to
* @param {string} event_types - A space-separated string of all the event types to listen for
* @param {function} callback - The function to execute when the events are triggered
* @param {Object} [scope=this] - The object to bind to the callback function
*
* @example
* // Calls the search function whenever the the keyup, paste or search events are triggered on the
* // search element
* this.add_multi_event_listener("search", "keyup paste search", this.search, this);
*/
Manager.prototype.add_multi_event_listener = function(selector, event_types, callback, scope) {
var evs = event_types.split(" ");
for (var i = 0; i &lt; evs.length; i++) {
document.querySelector(selector).addEventListener(evs[i], callback.bind(scope));
}
};
/**
* Adds multiple event listeners to each element in the specified group.
*
* @param {string} selector - A selector string for the element group to add the events to
* @param {string} event_types - A space-separated string of all the event types to listen for
* @param {function} callback - The function to execute when the events are triggered
* @param {Object} [scope=this] - The object to bind to the callback function
*
* @example
* // Calls the save function whenever the the keyup or paste events are triggered on any element
* // with the .saveable class
* this.add_multi_event_listener(".saveable", "keyup paste", this.save, this);
*/
Manager.prototype.add_multi_event_listeners = function(selector, event_types, callback, scope) {
var evs = event_types.split(" ");
for (var i = 0; i &lt; evs.length; i++) {
this.add_listeners(selector, evs[i], callback, scope);
}
};
/**
* Adds an event listener to the global document object which will listen on dynamic elements which
* may not exist in the DOM yet.
*
* @param {string} selector - A selector string for the element(s) to add the event to
* @param {string} event_type - The event(s) to listen for
* @param {function} callback - The function to execute when the event(s) is/are triggered
* @param {Object} [scope=this] - The object to bind to the callback function
*
* @example
* // Pops up an alert whenever any button is clicked, even if it is added to the DOM after this
* // listener is created
* this.add_dynamic_listener("button", "click", alert, this);
*/
Manager.prototype.add_dynamic_listener = function(selector, event_type, callback, scope) {
var event_config = {
selector: selector,
callback: callback.bind(scope || this)
};
if (this.dynamic_handlers.hasOwnProperty(event_type)) {
// Listener already exists, add new handler to the appropriate list
this.dynamic_handlers[event_type].push(event_config);
} else {
this.dynamic_handlers[event_type] = [event_config];
// Set up listener for this new type
document.addEventListener(event_type, this.dynamic_listener_handler.bind(this));
}
};
/**
* Handler for dynamic events. This function is called for any dynamic event and decides which
* callback(s) to execute based on the type and selector.
*
* @param {Event} e - The event to be handled
*/
Manager.prototype.dynamic_listener_handler = function(e) {
var handlers = this.dynamic_handlers[e.type],
matches = e.target.matches ||
e.target.webkitMatchesSelector ||
e.target.mozMatchesSelector ||
e.target.msMatchesSelector ||
e.target.oMatchesSelector;
for (var i = 0; i &lt; handlers.length; i++) {
if (matches &amp;&amp; e.target[matches.name](handlers[i].selector)) {
handlers[i].callback(e);
}
}
};
</pre>
</article>
</section>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
<div class="modal fade" id="searchResults">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Search results</h4>
</div>
<div class="modal-body"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>
<footer>
<span class="copyright">
&copy; Crown Copyright 2016
</span>
<span class="jsdoc-message">
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.4.3</a>
on Mon Nov 28th 2016
using the <a href="https://github.com/docstrap/docstrap">DocStrap template</a>.
</span>
</footer>
<script src="scripts/docstrap.lib.js"></script>
<script src="scripts/toc.js"></script>
<script type="text/javascript" src="scripts/fulltext-search-ui.js"></script>
<script>
$( function () {
$( "[id*='$']" ).each( function () {
var $this = $( this );
$this.attr( "id", $this.attr( "id" ).replace( "$", "__" ) );
} );
$( ".tutorial-section pre, .readme-section pre, pre.prettyprint.source" ).each( function () {
var $this = $( this );
var example = $this.find( "code" );
exampleText = example.html();
var lang = /{@lang (.*?)}/.exec( exampleText );
if ( lang && lang[1] ) {
exampleText = exampleText.replace( lang[0], "" );
example.html( exampleText );
lang = lang[1];
} else {
var langClassMatch = example.parent()[0].className.match(/lang\-(\S+)/);
lang = langClassMatch ? langClassMatch[1] : "javascript";
}
if ( lang ) {
$this
.addClass( "sunlight-highlight-" + lang )
.addClass( "linenums" )
.html( example.html() );
}
} );
Sunlight.highlightAll( {
lineNumbers : true,
showMenu : true,
enableDoclinks : true
} );
$.catchAnchorLinks( {
navbarOffset: 10
} );
$( "#toc" ).toc( {
anchorName : function ( i, heading, prefix ) {
return $( heading ).attr( "id" ) || ( prefix + i );
},
selectors : "#toc-content h1,#toc-content h2,#toc-content h3,#toc-content h4",
showAndHide : false,
smoothScrolling: true
} );
$( "#main span[id^='toc']" ).addClass( "toc-shim" );
$( '.dropdown-toggle' ).dropdown();
$( "table" ).each( function () {
var $this = $( this );
$this.addClass('table');
} );
} );
</script>
<!--Navigation and Symbol Display-->
<!--Google Analytics-->
<script type="text/javascript">
$(document).ready(function() {
SearcherDisplay.init();
});
</script>
</body>
</html>