Added 'Render Image' operation

src/core/config/Categories.js

@@ -285,6 +285,7 @@ const Categories = [
             "Detect File Type",
             "Scan for Embedded Files",
             "Generate UUID",
+            "Render Image",
             "Numberwang",
         ]
     },

src/core/config/OperationConfig.js

@@ -3353,6 +3353,19 @@ const OperationConfig = {
         outputType: "string",
         args: [],
     },
+    "Render Image": {
+        description: "Displays the input as an image. Supports the following formats:<br><br><ul><li>jpg/jpeg</li><li>png</li><li>gif</li><li>webp</li><li>tiff</li><li>bmp</li></ul>",
+        run: Image.runRenderImage,
+        inputType: "string",
+        outputType: "html",
+        args: [
+            {
+                name: "Input format",
+                type: "option",
+                value: Image.INPUT_FORMAT
+            }
+        ]
+    },
 };
 
 export default OperationConfig;

src/core/operations/FileType.js

@@ -20,7 +20,7 @@ const FileType = {
      * @returns {string}
      */
     runDetect: function(input, args) {
-        const type = FileType._magicType(input);
+        const type = FileType.magicType(input);
 
         if (!type) {
             return "Unknown file type. Have you tried checking the entropy of this data to determine whether it might be encrypted or compressed?";
@@ -59,7 +59,7 @@ const FileType = {
             numCommonFound = 0;
 
         for (let i = 0; i < input.length; i++) {
-            type = FileType._magicType(input.slice(i));
+            type = FileType.magicType(input.slice(i));
             if (type) {
                 if (ignoreCommon && commonExts.indexOf(type.ext) > -1) {
                     numCommonFound++;
@@ -96,14 +96,13 @@ const FileType = {
      * Given a buffer, detects magic byte sequences at specific positions and returns the
      * extension and mime type.
      *
-     * @private
      * @param {byteArray} buf
      * @returns {Object} type
      * @returns {string} type.ext - File extension
      * @returns {string} type.mime - Mime type
      * @returns {string} [type.desc] - Description
      */
-    _magicType: function (buf) {
+    magicType: function (buf) {
         if (!(buf && buf.length > 1)) {
             return null;
         }

src/core/operations/Image.js

@@ -1,5 +1,6 @@
 import * as ExifParser from "exif-parser";
 import Utils from "../Utils.js";
+import FileType from "./FileType.js";
 
 
 /**
@@ -42,6 +43,57 @@ const Image = {
         }
     },
 
+
+    /**
+     * @constant
+     * @default
+     */
+    INPUT_FORMAT: ["Raw", "Base64", "Hex"],
+
+    /**
+     * Render Image operation.
+     *
+     * @author n1474335 [n1474335@gmail.com]
+     * @param {string} input
+     * @param {Object[]} args
+     * @returns {html}
+     */
+    runRenderImage(input, args) {
+        const inputFormat = args[0];
+        let dataURI = "data:";
+
+        if (!input.length) return "";
+
+        // Convert input to raw bytes
+        switch (inputFormat) {
+            case "Hex":
+                input = Utils.fromHex(input);
+                break;
+            case "Base64":
+                // Don't trust the Base64 entered by the user.
+                // Unwrap it first, then re-encode later.
+                input = Utils.fromBase64(input, null, "byteArray");
+                break;
+            case "Raw":
+            default:
+                input = Utils.strToByteArray(input);
+                break;
+        }
+
+        // Determine file type
+        const type = FileType.magicType(input);
+        if (type && type.mime.indexOf("image") === 0) {
+            dataURI += type.mime + ";";
+        } else {
+            throw "Invalid file type";
+        }
+
+        // Add image data to URI
+        dataURI += "base64," + Utils.toBase64(input);
+
+        return "<img src='" + dataURI + "'>";
+    },
+
 };
 
 export default Image;

src/web/stylesheets/layout/_structure.css

@@ -6,6 +6,10 @@
  * @license Apache-2.0
  */
 
+body {
+    overflow: hidden;
+}
+
 #content-wrapper {
     position: absolute;
     top: 0;