From 643df77e6366b7164307ffe195ed9de83b68e5ae Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Fri, 24 Sep 2021 01:21:38 -0400
Subject: wrapped Color() calls in DashColor() to catch exceptions for color
 strings no found

---
 src/Utils.ts                                                  | 11 ++++++++++-
 src/client/views/StyleProvider.tsx                            |  5 ++---
 src/client/views/collections/TabDocView.tsx                   |  3 +--
 .../collections/collectionFreeForm/CollectionFreeFormView.tsx |  1 -
 src/client/views/nodes/CollectionFreeFormDocumentView.tsx     |  5 ++---
 src/client/views/nodes/trails/PresBox.tsx                     |  3 +--
 src/fields/Doc.ts                                             |  9 ++++-----
 src/fields/RichTextUtils.ts                                   |  4 ++--
 8 files changed, 22 insertions(+), 19 deletions(-)

(limited to 'src')

diff --git a/src/Utils.ts b/src/Utils.ts
index db33875ea..7ec4f69f3 100644
--- a/src/Utils.ts
+++ b/src/Utils.ts
@@ -573,10 +573,19 @@ export function simulateMouseClick(element: Element | null | undefined, x: numbe
     }
 }
 
+export function DashColor(color: string) {
+    try {
+        return Color(color.toLowerCase());
+    } catch (e) {
+        console.log("COLOR error:", e);
+        return Color("red");
+    }
+}
+
 export function lightOrDark(color: any) {
     const nonAlphaColor = color.startsWith("#") ? (color as string).substring(0, 7) :
         color.startsWith("rgba") ? color.replace(/,.[^,]*\)/, ")").replace("rgba", "rgb") : color;
-    const col = Color(nonAlphaColor.toLowerCase()).rgb();
+    const col = DashColor(nonAlphaColor).rgb();
     const colsum = (col.red() + col.green() + col.blue());
     if (colsum / col.alpha() > 400 || col.alpha() < 0.25) return Colors.DARK_GRAY;
     else return Colors.WHITE;
diff --git a/src/client/views/StyleProvider.tsx b/src/client/views/StyleProvider.tsx
index 507c3d2b2..cd6e11bda 100644
--- a/src/client/views/StyleProvider.tsx
+++ b/src/client/views/StyleProvider.tsx
@@ -7,7 +7,7 @@ import { Doc, Opt, StrListCast } from "../../fields/Doc";
 import { List } from '../../fields/List';
 import { listSpec } from '../../fields/Schema';
 import { BoolCast, Cast, NumCast, StrCast } from "../../fields/Types";
-import { lightOrDark } from '../../Utils';
+import { lightOrDark, DashColor } from '../../Utils';
 import { DocumentType } from '../documents/DocumentTypes';
 import { CurrentUserUtils } from '../util/CurrentUserUtils';
 import { ColorScheme } from '../util/SettingsManager';
@@ -21,7 +21,6 @@ import { FieldViewProps } from './nodes/FieldView';
 import { SliderBox } from './nodes/SliderBox';
 import "./StyleProvider.scss";
 import React = require("react");
-import Color = require('color');
 
 export enum StyleLayers {
     Background = "background"
@@ -148,7 +147,7 @@ export function DefaultStyleProvider(doc: Opt<Doc>, props: Opt<DocumentViewProps
                 //if (doc._viewType !== CollectionViewType.Freeform && doc._viewType !== CollectionViewType.Time) return "rgb(62,62,62)";
                 default: docColor = docColor || (darkScheme() ? Colors.DARK_GRAY : Colors.WHITE); break;
             }
-            if (docColor && (!doc || props?.layerProvider?.(doc) === false)) docColor = Color(docColor.toLowerCase()).fade(0.5).toString();
+            if (docColor && (!doc || props?.layerProvider?.(doc) === false)) docColor = DashColor(docColor).fade(0.5).toString();
             return docColor;
         }
         case StyleProp.BoxShadow: {
diff --git a/src/client/views/collections/TabDocView.tsx b/src/client/views/collections/TabDocView.tsx
index f63e5f844..eb95bb913 100644
--- a/src/client/views/collections/TabDocView.tsx
+++ b/src/client/views/collections/TabDocView.tsx
@@ -22,6 +22,7 @@ import { SelectionManager } from '../../util/SelectionManager';
 import { SnappingManager } from '../../util/SnappingManager';
 import { Transform } from '../../util/Transform';
 import { undoBatch, UndoManager } from "../../util/UndoManager";
+import { Colors, Shadows } from '../global/globalEnums';
 import { LightboxView } from '../LightboxView';
 import { DocFocusOptions, DocumentView, DocumentViewProps } from "../nodes/DocumentView";
 import { PinProps, PresBox, PresMovement } from '../nodes/trails';
@@ -32,8 +33,6 @@ import { CollectionFreeFormView } from './collectionFreeForm/CollectionFreeFormV
 import { CollectionView, CollectionViewType } from './CollectionView';
 import "./TabDocView.scss";
 import React = require("react");
-import Color = require('color');
-import { Colors, Shadows } from '../global/globalEnums';
 const _global = (window /* browser */ || global /* node */) as any;
 
 interface TabDocViewProps {
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 0b12f6c21..5b9f6139f 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -50,7 +50,6 @@ import { CollectionFreeFormRemoteCursors } from "./CollectionFreeFormRemoteCurso
 import "./CollectionFreeFormView.scss";
 import { MarqueeView } from "./MarqueeView";
 import React = require("react");
-import Color = require("color");
 import { ColorScheme } from "../../../util/SettingsManager";
 
 export const panZoomSchema = createSchema({
diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
index c76a051f7..fe34d6687 100644
--- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -7,7 +7,7 @@ import { listSpec } from "../../../fields/Schema";
 import { ComputedField } from "../../../fields/ScriptField";
 import { Cast, NumCast, StrCast } from "../../../fields/Types";
 import { TraceMobx } from "../../../fields/util";
-import { numberRange } from "../../../Utils";
+import { DashColor, numberRange } from "../../../Utils";
 import { DocumentManager } from "../../util/DocumentManager";
 import { SelectionManager } from "../../util/SelectionManager";
 import { Transform } from "../../util/Transform";
@@ -18,7 +18,6 @@ import { StyleProp } from "../StyleProvider";
 import "./CollectionFreeFormDocumentView.scss";
 import { DocumentView, DocumentViewProps } from "./DocumentView";
 import React = require("react");
-import Color = require("color");
 
 export interface CollectionFreeFormDocumentViewProps extends DocumentViewProps {
     dataProvider?: (doc: Doc, replica: string) => { x: number, y: number, zIndex?: number, opacity?: number, highlight?: boolean, z: number, transition?: string } | undefined;
@@ -165,7 +164,7 @@ export class CollectionFreeFormDocumentView extends DocComponent<CollectionFreeF
             PanelHeight: this.panelHeight,
         };
         const background = this.props.styleProvider?.(this.rootDoc, this.props, StyleProp.BackgroundColor);
-        const mixBlendMode = StrCast(this.layoutDoc.mixBlendMode) as any || (typeof background === "string" && Color(background.toLowerCase()).alpha() !== 1 ? "multiply" : undefined);
+        const mixBlendMode = StrCast(this.layoutDoc.mixBlendMode) as any || (typeof background === "string" && DashColor(background).alpha() !== 1 ? "multiply" : undefined);
         return <div className={"collectionFreeFormDocumentView-container"}
             style={{
                 outline: this.Highlight ? "orange solid 2px" : "",
diff --git a/src/client/views/nodes/trails/PresBox.tsx b/src/client/views/nodes/trails/PresBox.tsx
index add84ff83..8e61a224c 100644
--- a/src/client/views/nodes/trails/PresBox.tsx
+++ b/src/client/views/nodes/trails/PresBox.tsx
@@ -30,8 +30,7 @@ import { LightboxView } from "../../LightboxView";
 import { CollectionFreeFormDocumentView } from "../CollectionFreeFormDocumentView";
 import { FieldView, FieldViewProps } from '../FieldView';
 import "./PresBox.scss";
-import Color = require("color");
-import { PresEffect, PresStatus, PresMovement } from "./PresEnums";
+import { PresEffect, PresMovement, PresStatus } from "./PresEnums";
 
 export class PinProps {
     audioRange?: boolean;
diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts
index 57bd0f46f..d8690831f 100644
--- a/src/fields/Doc.ts
+++ b/src/fields/Doc.ts
@@ -1,15 +1,17 @@
+import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { saveAs } from "file-saver";
 import { action, computed, observable, ObservableMap, runInAction } from "mobx";
 import { computedFn } from "mobx-utils";
 import { alias, map, serializable } from "serializr";
 import { DocServer } from "../client/DocServer";
 import { DocumentType } from "../client/documents/DocumentTypes";
+import { CurrentUserUtils } from "../client/util/CurrentUserUtils";
 import { LinkManager } from "../client/util/LinkManager";
 import { Scripting, scriptingGlobal } from "../client/util/Scripting";
 import { SelectionManager } from "../client/util/SelectionManager";
 import { afterDocDeserialize, autoObject, Deserializable, SerializationHelper } from "../client/util/SerializationHelper";
 import { UndoManager } from "../client/util/UndoManager";
-import { intersectRect, Utils } from "../Utils";
+import { DashColor, intersectRect, Utils } from "../Utils";
 import { DateField } from "./DateField";
 import { Copy, HandleUpdate, Id, OnUpdate, Parent, Self, SelfProxy, ToScriptString, ToString, Update } from "./FieldSymbols";
 import { List } from "./List";
@@ -23,9 +25,6 @@ import { Cast, FieldValue, NumCast, StrCast, ToConstructor } from "./Types";
 import { AudioField, ImageField, PdfField, VideoField, WebField } from "./URLField";
 import { deleteProperty, GetEffectiveAcl, getField, getter, inheritParentAcls, makeEditable, makeReadOnly, normalizeEmail, setter, SharingPermissions, updateFunction } from "./util";
 import JSZip = require("jszip");
-import { CurrentUserUtils } from "../client/util/CurrentUserUtils";
-import { IconProp } from "@fortawesome/fontawesome-svg-core";
-import Color = require("color");
 
 export namespace Field {
     export function toKeyValueString(doc: Doc, key: string): string {
@@ -1089,7 +1088,7 @@ export namespace Doc {
 
     export function matchFieldValue(doc: Doc, key: string, value: any): boolean {
         if (Utils.HasTransparencyFilter(value)) {
-            const isTransparent = (color: string) => color !== "" && (Color(color).alpha() !== 1);
+            const isTransparent = (color: string) => color !== "" && (DashColor(color).alpha() !== 1);
             return isTransparent(StrCast(doc[key]));
         }
         if (typeof value === "string") {
diff --git a/src/fields/RichTextUtils.ts b/src/fields/RichTextUtils.ts
index 0b5f14d74..a19be5df9 100644
--- a/src/fields/RichTextUtils.ts
+++ b/src/fields/RichTextUtils.ts
@@ -2,7 +2,7 @@ import { AssertionError } from "assert";
 import { docs_v1 } from "googleapis";
 import { Fragment, Mark, Node } from "prosemirror-model";
 import { sinkListItem } from "prosemirror-schema-list";
-import { Utils } from "../Utils";
+import { Utils, DashColor } from "../Utils";
 import { Docs, DocUtils } from "../client/documents/Documents";
 import { schema } from "../client/views/nodes/formattedText/schema_rts";
 import { GooglePhotos } from "../client/apis/google_docs/GooglePhotosClientUtils";
@@ -482,7 +482,7 @@ export namespace RichTextUtils {
         }
 
         const fromHex = (color: string): docs_v1.Schema$OptionalColor => {
-            const c = Color(color);
+            const c = DashColor(color);
             return fromRgb.convert(c.red(), c.green(), c.blue());
         };
 
-- 
cgit v1.2.3-70-g09d2