NETSCRIPT: Add undocumented function printRaw() (#277)

This is analagous to tprintRaw (enabled by ns.iKnowWhatImDoing()), but
for logs instead of the terminal. This provides a supported* method of
creating complicated UIs for scripts.

*No actual support, expressed or implied, is provided for use of this
function.

src/Netscript/NetscriptHelpers.ts

@@ -703,7 +703,7 @@ function createPublicRunningScript(runningScript: RunningScript): IRunningScript
   return {
     args: runningScript.args.slice(),
     filename: runningScript.filename,
-    logs: runningScript.logs.slice(),
+    logs: runningScript.logs.map((x) => "" + x),
     offlineExpGained: runningScript.offlineExpGained,
     offlineMoneyMade: runningScript.offlineMoneyMade,
     offlineRunningTime: runningScript.offlineRunningTime,

src/Netscript/RamCostGenerator.ts

@@ -541,6 +541,7 @@ export const RamCosts: RamCostTree<NSFull> = {
   rainbow: 0,
   heart: { break: 0 },
   iKnowWhatImDoing: 0,
+  printRaw: 0,
 
   formulas: {
     mockServer: 0,

src/Netscript/WorkerScript.ts

@@ -6,6 +6,7 @@
  * Instead, whenever the game is opened, WorkerScripts are re-created from
  * RunningScript objects
  */
+import type React from "react";
 import { Environment } from "./Environment";
 import { RamCostConstants } from "./RamCostGenerator";
 
@@ -180,7 +181,7 @@ export class WorkerScript {
     }
   }
 
-  print(txt: string): void {
+  print(txt: React.ReactNode): void {
     this.scriptRef.log(txt);
   }
 }

src/NetscriptFunctions.ts

@@ -517,7 +517,7 @@ export const ns: InternalAPI<NSFull> = {
         return [] as string[];
       }
 
-      return runningScriptObj.logs.slice();
+      return runningScriptObj.logs.map((x) => "" + x);
     },
   tail:
     (ctx) =>

src/NetscriptFunctions/Extra.ts

@@ -1,3 +1,4 @@
+import type React from "react";
 import { Player } from "../Player";
 import { Exploit } from "../Exploits/Exploit";
 import * as bcrypt from "bcryptjs";
@@ -16,6 +17,7 @@ export interface INetscriptExtra {
   alterReality(): void;
   rainbow(guess: string): void;
   iKnowWhatImDoing(): void;
+  printRaw(value: React.ReactNode): void;
 }
 
 export function NetscriptExtra(): InternalAPI<INetscriptExtra> {
@@ -82,5 +84,9 @@ export function NetscriptExtra(): InternalAPI<INetscriptExtra> {
       // @ts-ignore window has no tprintRaw property defined
       window.tprintRaw = Terminal.printRaw.bind(Terminal);
     },
+    printRaw: (ctx) => (value) => {
+      // Using this voids the warranty on your tail log
+      ctx.workerScript.print(value as React.ReactNode);
+    },
   };
 }

src/Script/RunningScript.ts

@@ -2,6 +2,7 @@
  * Class representing a Script instance that is actively running.
  * A Script can have multiple active instances
  */
+import type React from "react";
 import { Script } from "./Script";
 import { ScriptUrl } from "./ScriptUrl";
 import { Settings } from "../Settings/Settings";
@@ -23,7 +24,7 @@ export class RunningScript {
   filename = "";
 
   // This script's logs. An array of log entries
-  logs: string[] = [];
+  logs: React.ReactNode[] = [];
 
   // Flag indicating whether the logs have been updated since
   // the last time the UI was updated
@@ -73,13 +74,13 @@ export class RunningScript {
     this.dependencies = script.dependencies;
   }
 
-  log(txt: string): void {
+  log(txt: React.ReactNode): void {
     if (this.logs.length > Settings.MaxLogCapacity) {
       this.logs.shift();
     }
 
     let logEntry = txt;
-    if (Settings.TimestampsFormat) {
+    if (Settings.TimestampsFormat && typeof txt === "string") {
       logEntry = "[" + formatTime(Settings.TimestampsFormat) + "] " + logEntry;
     }
 
@@ -88,8 +89,12 @@ export class RunningScript {
   }
 
   displayLog(): void {
-    for (let i = 0; i < this.logs.length; ++i) {
-      Terminal.print(this.logs[i]);
+    for (const log of this.logs) {
+      if (typeof log === "string") {
+        Terminal.print(log);
+      } else {
+        Terminal.printRaw(log);
+      }
     }
   }
 

src/ui/React/LogBoxManager.tsx

@@ -385,9 +385,8 @@ function LogWindow(props: IProps): React.ReactElement {
             >
               <div style={{ display: "flex", flexDirection: "column" }}>
                 {script.logs.map(
-                  (line: string, i: number): JSX.Element => (
-                    <ANSIITypography key={i} text={line} color={lineColor(line)} />
-                  ),
+                  (line: React.ReactNode, i: number): React.ReactNode =>
+                    typeof line !== "string" ? line : <ANSIITypography key={i} text={line} color={lineColor(line)} />,
                 )}
               </div>
             </Paper>