Set up Grunt tasks to build web and Node versions of CyberChef using webpack

src/js/views/html/ControlsWaiter.js

@@ -1,4 +1,5 @@
-/* globals moment */
+var Utils = require("../../core/Utils.js");
+
 
 /**
  * Waiter to handle events related to the CyberChef controls (i.e. Bake, Step, Save, Load etc.)
@@ -11,7 +12,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var ControlsWaiter = function(app, manager) {
+var ControlsWaiter = module.exports = function(app, manager) {
     this.app = app;
     this.manager = manager;
 };
@@ -78,7 +79,9 @@ ControlsWaiter.prototype.setAutoBake = function(value) {
  */
 ControlsWaiter.prototype.bakeClick = function() {
     this.app.bake();
-    $("#output-text").selectRange(0);
+    var outputText = document.getElementById("output-text");
+    outputText.focus();
+    outputText.setSelectionRange(0, 0);
 };
 
 
@@ -87,7 +90,9 @@ ControlsWaiter.prototype.bakeClick = function() {
  */
 ControlsWaiter.prototype.stepClick = function() {
     this.app.bake(true);
-    $("#output-text").selectRange(0);
+    var outputText = document.getElementById("output-text");
+    outputText.focus();
+    outputText.setSelectionRange(0, 0);
 };
 
 

src/js/views/html/HTMLApp.js

@@ -1,4 +1,10 @@
-/* globals Split */
+var Utils = require("../../core/Utils.js"),
+    Chef = require("../../core/Chef.js"),
+    Manager = require("./Manager.js"),
+    HTMLCategory = require("./HTMLCategory.js"),
+    HTMLOperation = require("./HTMLOperation.js"),
+    Split = require("split.js");
+
 
 /**
  * HTML view for CyberChef responsible for building the web page and dealing with all user
@@ -14,7 +20,7 @@
  * @param {String[]} defaultFavourites - A list of default favourite operations.
  * @param {Object} options - Default setting for app options.
  */
-var HTMLApp = function(categories, operations, defaultFavourites, defaultOptions) {
+var HTMLApp = module.exports = function(categories, operations, defaultFavourites, defaultOptions) {
     this.categories  = categories;
     this.operations  = operations;
     this.dfavourites = defaultFavourites;

src/js/views/html/HTMLCategory.js

@@ -9,7 +9,7 @@
  * @param {string} name - The name of the category.
  * @param {boolean} selected - Whether this category is pre-selected or not.
  */
-var HTMLCategory = function(name, selected) {
+var HTMLCategory = module.exports = function(name, selected) {
     this.name = name;
     this.selected = selected;
     this.opList = [];

src/js/views/html/HTMLIngredient.js

@@ -10,7 +10,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var HTMLIngredient = function(config, app, manager) {
+var HTMLIngredient = module.exports = function(config, app, manager) {
     this.app = app;
     this.manager = manager;
 

src/js/views/html/HTMLOperation.js

@@ -1,3 +1,6 @@
+var HTMLIngredient = require("./HTMLIngredient.js");
+
+
 /**
  * Object to handle the creation of operations.
  *
@@ -11,7 +14,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var HTMLOperation = function(name, config, app, manager) {
+var HTMLOperation = module.exports = function(name, config, app, manager) {
     this.app         = app;
     this.manager     = manager;
 

src/js/views/html/HighlighterWaiter.js

@@ -1,3 +1,6 @@
+var Utils = require("../../core/Utils.js");
+
+
 /**
  * Waiter to handle events related to highlighting in CyberChef.
  *
@@ -8,7 +11,7 @@
  * @constructor
  * @param {HTMLApp} app - The main view object for CyberChef.
  */
-var HighlighterWaiter = function(app) {
+var HighlighterWaiter = module.exports = function(app) {
     this.app = app;
 
     this.mouseButtonDown = false;

src/js/views/html/InputWaiter.js

@@ -1,3 +1,6 @@
+var Utils = require("../../core/Utils.js");
+
+
 /**
  * Waiter to handle events related to the input.
  *
@@ -9,7 +12,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var InputWaiter = function(app, manager) {
+var InputWaiter = module.exports = function(app, manager) {
     this.app = app;
     this.manager = manager;
 

src/js/views/html/Manager.js

@@ -1,3 +1,14 @@
+var WindowWaiter      = require("./WindowWaiter.js"),
+    ControlsWaiter    = require("./ControlsWaiter.js"),
+    RecipeWaiter      = require("./RecipeWaiter.js"),
+    OperationsWaiter  = require("./OperationsWaiter.js"),
+    InputWaiter       = require("./InputWaiter.js"),
+    OutputWaiter      = require("./OutputWaiter.js"),
+    OptionsWaiter     = require("./OptionsWaiter.js"),
+    HighlighterWaiter = require("./HighlighterWaiter.js"),
+    SeasonalWaiter    = require("./SeasonalWaiter.js");
+
+
 /**
  * This object controls the Waiters responsible for handling events from all areas of the app.
  *
@@ -8,7 +19,7 @@
  * @constructor
  * @param {HTMLApp} app - The main view object for CyberChef.
  */
-var Manager = function(app) {
+var Manager = module.exports = function(app) {
     this.app = app;
 
     // Define custom events

src/js/views/html/OperationsWaiter.js

@@ -1,4 +1,6 @@
-/* globals Sortable */
+var HTMLOperation = require("./HTMLOperation.js"),
+    Sortable = require("sortablejs");
+
 
 /**
  * Waiter to handle events related to the operations.
@@ -11,7 +13,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var OperationsWaiter = function(app, manager) {
+var OperationsWaiter = module.exports = function(app, manager) {
     this.app = app;
     this.manager = manager;
 

src/js/views/html/OptionsWaiter.js

@@ -8,7 +8,7 @@
  * @constructor
  * @param {HTMLApp} app - The main view object for CyberChef.
  */
-var OptionsWaiter = function(app) {
+var OptionsWaiter = module.exports = function(app) {
     this.app = app;
 };
 

src/js/views/html/OutputWaiter.js

@@ -1,3 +1,6 @@
+var Utils = require("../../core/Utils.js");
+
+
 /**
  * Waiter to handle events related to the output.
  *
@@ -9,7 +12,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var OutputWaiter = function(app, manager) {
+var OutputWaiter = module.exports = function(app, manager) {
     this.app = app;
     this.manager = manager;
 };

src/js/views/html/RecipeWaiter.js

@@ -1,4 +1,6 @@
-/* globals Sortable */
+var HTMLOperation = require("./HTMLOperation.js"),
+    Sortable = require("sortablejs");
+
 
 /**
  * Waiter to handle events related to the recipe.
@@ -11,7 +13,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var RecipeWaiter = function(app, manager) {
+var RecipeWaiter = module.exports = function(app, manager) {
     this.app = app;
     this.manager = manager;
     this.removeIntent = false;
@@ -31,7 +33,8 @@ RecipeWaiter.prototype.initialiseOperationDragNDrop = function() {
         sort: true,
         animation: 0,
         delay: 0,
-        filter: ".arg-input,.arg", // Relies on commenting out a line in Sortable.js which calls evt.preventDefault()
+        filter: ".arg-input,.arg",
+        preventOnFilter: false,
         setData: function(dataTransfer, dragEl) {
             dataTransfer.setData("Text", dragEl.querySelector(".arg-title").textContent);
         },

src/js/views/html/SeasonalWaiter.js

@@ -9,7 +9,7 @@
  * @param {HTMLApp} app - The main view object for CyberChef.
  * @param {Manager} manager - The CyberChef event manager.
  */
-var SeasonalWaiter = function(app, manager) {
+var SeasonalWaiter = module.exports = function(app, manager) {
     this.app = app;
     this.manager = manager;
 };

src/js/views/html/WindowWaiter.js

@@ -8,7 +8,7 @@
  * @constructor
  * @param {HTMLApp} app - The main view object for CyberChef.
  */
-var WindowWaiter = function(app) {
+var WindowWaiter = module.exports = function(app) {
     this.app = app;
 };
 

src/js/views/html/main.js

@@ -1,11 +1,18 @@
-/* globals moment */
-
 /**
  * @author n1474335 [n1474335@gmail.com]
  * @copyright Crown Copyright 2016
  * @license Apache-2.0
  */
 
+require("bootstrap");
+require("bootstrap-colorpicker");
+require("bootstrap-switch");
+var CanvasComponents = require("../../lib/canvascomponents.js");
+
+var HTMLApp = require("./HTMLApp.js"),
+    Categories = require("../../config/Categories.js"),
+    OperationConfig = require("../../config/OperationConfig.js");
+
 /**
  * Main function used to build the CyberChef web app.
  */

src/js/views/node/index.js

@@ -1,31 +1,18 @@
-var Chef = require("../../core/Chef.js");
-
-
 /**
+ * Node view for CyberChef.
+ *
  * @author n1474335 [n1474335@gmail.com]
  * @copyright Crown Copyright 2017
  * @license Apache-2.0
  */
 
-var chef = new Chef();
+var Chef = require("../../core/Chef.js");
 
-console.log(chef.bake("test", [{"op":"To Hex", "args":["Space"]}], {}, 0, false));
+module.exports = {
 
-console.log(chef.bake("425a6839314159265359b218ed630000031380400104002a438c00200021a9ea601a10003202185d5ed68ca6442f1e177245385090b218ed63",
-    [
-        {
-            "op" : "From Hex",
-            "args" : ["Space"]
-        },
-        {
-            "op" : "Bzip2 Decompress",
-            "args" : []
-        }
-    ],
-    {}, 0, false
-));
+    bake: function(input, recipeConfig) {
+        this.chef = new Chef();
+        return this.chef.bake(input, recipeConfig, {}, 0, false);
+    }
 
-console.log(chef.bake("192.168.0.0/30",
-    [{"op":"Parse IP range", "args":[true, true, false]}],
-    {}, 0, false
-));
+};