aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/Utils.ts10
-rw-r--r--src/client/views/CollectionLinearView.tsx6
-rw-r--r--src/client/views/GlobalKeyHandler.ts3
-rw-r--r--src/client/views/InkingControl.tsx2
-rw-r--r--src/client/views/nodes/ColorBox.tsx8
-rw-r--r--src/client/views/nodes/DocumentView.tsx2
-rw-r--r--src/client/views/nodes/FontIconBox.tsx25
-rw-r--r--src/new_fields/Doc.ts2
8 files changed, 44 insertions, 14 deletions
diff --git a/src/Utils.ts b/src/Utils.ts
index 9a2f01f80..6889936b8 100644
--- a/src/Utils.ts
+++ b/src/Utils.ts
@@ -62,14 +62,14 @@ export namespace Utils {
}
export function fromRGBAstr(rgba: string) {
- let rm = rgba.match(/rgb[a]?\(([0-9]+)/);
+ let rm = rgba.match(/rgb[a]?\(([ 0-9]+)/);
let r = rm ? Number(rm[1]) : 0;
- let gm = rgba.match(/rgb[a]?\([0-9]+,([0-9]+)/);
+ let gm = rgba.match(/rgb[a]?\([ 0-9]+,([ 0-9]+)/);
let g = gm ? Number(gm[1]) : 0;
- let bm = rgba.match(/rgb[a]?\([0-9]+,[0-9]+,([0-9]+)/);
+ let bm = rgba.match(/rgb[a]?\([ 0-9]+,[ 0-9]+,([ 0-9]+)/);
let b = bm ? Number(bm[1]) : 0;
- let am = rgba.match(/rgba?\([0-9]+,[0-9]+,[0-9]+,([0-9]+)/);
- let a = am ? Number(am[1]) : 0;
+ let am = rgba.match(/rgba?\([ 0-9]+,[ 0-9]+,[ 0-9]+,([ .0-9]+)/);
+ let a = am ? Number(am[1]) : 1;
return { r: r, g: g, b: b, a: a };
}
diff --git a/src/client/views/CollectionLinearView.tsx b/src/client/views/CollectionLinearView.tsx
index eb3c768d0..af3b194ea 100644
--- a/src/client/views/CollectionLinearView.tsx
+++ b/src/client/views/CollectionLinearView.tsx
@@ -25,6 +25,7 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
@observable public addMenuToggle = React.createRef<HTMLInputElement>();
private _dropDisposer?: DragManager.DragDropDisposer;
private _heightDisposer?: IReactionDisposer;
+ private _spacing = 20;
componentWillUnmount() {
this._dropDisposer && this._dropDisposer();
@@ -69,8 +70,7 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
if (!ele.current) return Transform.Identity();
let { scale, translateX, translateY } = Utils.GetScreenTransform(ele.current);
return new Transform(-translateX, -translateY, 1 / scale);
- };
- _spacing = 20;
+ }
render() {
let guid = Utils.GenerateGuid();
return <div className="collectionLinearView-outer">
@@ -118,7 +118,7 @@ export class CollectionLinearView extends CollectionSubView(LinearDocument) {
zoomToScale={emptyFunction}
getScale={returnOne}>
</DocumentView>
- </div>
+ </div>;
})}
{/* <li key="undoTest"><button className="add-button round-button" title="Click if undo isn't working" onClick={() => UndoManager.TraceOpenBatches()}><FontAwesomeIcon icon="exclamation" size="sm" /></button></li> */}
diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts
index f31a29bdc..9ca9fc163 100644
--- a/src/client/views/GlobalKeyHandler.ts
+++ b/src/client/views/GlobalKeyHandler.ts
@@ -10,6 +10,8 @@ import SharingManager from "../util/SharingManager";
import { CurrentUserUtils } from "../../server/authentication/models/current_user_utils";
import { Cast, PromiseValue } from "../../new_fields/Types";
import { ScriptField } from "../../new_fields/ScriptField";
+import { InkingControl } from "./InkingControl";
+import { InkTool } from "../../new_fields/InkField";
const modifiers = ["control", "meta", "shift", "alt"];
type KeyHandler = (keycode: string, e: KeyboardEvent) => KeyControlInfo | Promise<KeyControlInfo>;
@@ -64,6 +66,7 @@ export default class KeyManager {
switch (keyname) {
case "escape":
let main = MainView.Instance;
+ InkingControl.Instance.switchTool(InkTool.None);
if (main.isPointerDown) {
DragManager.AbortDrag();
} else {
diff --git a/src/client/views/InkingControl.tsx b/src/client/views/InkingControl.tsx
index b51264932..51fc7ca8f 100644
--- a/src/client/views/InkingControl.tsx
+++ b/src/client/views/InkingControl.tsx
@@ -25,7 +25,7 @@ export class InkingControl {
switchTool = action((tool: InkTool): void => {
this._selectedTool = tool;
- })
+ });
decimalToHexString(number: number) {
if (number < 0) {
number = 0xFFFFFFFF + number + 1;
diff --git a/src/client/views/nodes/ColorBox.tsx b/src/client/views/nodes/ColorBox.tsx
index 87c91c121..e4fef0922 100644
--- a/src/client/views/nodes/ColorBox.tsx
+++ b/src/client/views/nodes/ColorBox.tsx
@@ -10,6 +10,8 @@ import { makeInterface } from "../../../new_fields/Schema";
import { trace, reaction, observable, action, IReactionDisposer } from "mobx";
import { SelectionManager } from "../../util/SelectionManager";
import { StrCast } from "../../../new_fields/Types";
+import { CurrentUserUtils } from "../../../server/authentication/models/current_user_utils";
+import { Doc } from "../../../new_fields/Doc";
type ColorDocument = makeInterface<[typeof documentSchema]>;
const ColorDocument = makeInterface(documentSchema);
@@ -18,10 +20,15 @@ const ColorDocument = makeInterface(documentSchema);
export class ColorBox extends DocStaticComponent<FieldViewProps, ColorDocument>(ColorDocument) {
public static LayoutString(fieldKey?: string) { return FieldView.LayoutString(ColorBox, fieldKey); }
_selectedDisposer: IReactionDisposer | undefined;
+ _penDisposer: IReactionDisposer | undefined;
componentDidMount() {
this._selectedDisposer = reaction(() => SelectionManager.SelectedDocuments(),
action(() => this._startupColor = SelectionManager.SelectedDocuments().length ? StrCast(SelectionManager.SelectedDocuments()[0].Document.backgroundColor, "black") : "black"),
{ fireImmediately: true });
+ this._penDisposer = reaction(() => CurrentUserUtils.UserDocument.activePen instanceof Doc && CurrentUserUtils.UserDocument.activePen.pen,
+ action(() => this._startupColor = CurrentUserUtils.UserDocument.activePen instanceof Doc && CurrentUserUtils.UserDocument.activePen.pen instanceof Doc ?
+ StrCast(CurrentUserUtils.UserDocument.activePen.pen.backgroundColor, "black") : "black"),
+ { fireImmediately: true });
// compare to this reaction that used to be in Selection Manager
// reaction(() => manager.SelectedDocuments, sel => {
@@ -37,6 +44,7 @@ export class ColorBox extends DocStaticComponent<FieldViewProps, ColorDocument>(
// }, { fireImmediately: true });
}
componentWillUnmount() {
+ this._penDisposer && this._penDisposer();
this._selectedDisposer && this._selectedDisposer();
}
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 6f99c541f..8a320d39b 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -676,7 +676,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
const highlightColors = ["transparent", "maroon", "maroon", "yellow", "magenta", "cyan", "orange"];
const highlightStyles = ["solid", "dashed", "solid", "solid", "solid", "solid", "solid", "solid"];
- let highlighting = fullDegree && this.props.Document.type !== DocumentType.FONTICON && this.props.Document.viewType !== CollectionViewType.Linear
+ let highlighting = fullDegree && this.props.Document.type !== DocumentType.FONTICON && this.props.Document.viewType !== CollectionViewType.Linear;
return (
<div className={`documentView-node${this.topMost ? "-topmost" : ""}`}
ref={this._mainCont}
diff --git a/src/client/views/nodes/FontIconBox.tsx b/src/client/views/nodes/FontIconBox.tsx
index efe47d8a8..1c2ed33eb 100644
--- a/src/client/views/nodes/FontIconBox.tsx
+++ b/src/client/views/nodes/FontIconBox.tsx
@@ -6,6 +6,8 @@ import { DocComponent } from '../DocComponent';
import './FontIconBox.scss';
import { FieldView, FieldViewProps } from './FieldView';
import { StrCast } from '../../../new_fields/Types';
+import { Utils } from "../../../Utils";
+import { runInAction, observable, reaction, IReactionDisposer } from 'mobx';
const FontIconSchema = createSchema({
icon: "string"
});
@@ -15,10 +17,27 @@ const FontIconDocument = makeInterface(FontIconSchema);
@observer
export class FontIconBox extends DocComponent<FieldViewProps, FontIconDocument>(FontIconDocument) {
public static LayoutString() { return FieldView.LayoutString(FontIconBox); }
-
+ @observable _foregroundColor = "white";
+ _ref: React.RefObject<HTMLButtonElement> = React.createRef();
+ _backgroundReaction: IReactionDisposer | undefined;
+ componentDidMount() {
+ this._backgroundReaction = reaction(() => this.props.Document.backgroundColor,
+ () => {
+ if (this._ref && this._ref.current) {
+ let col = Utils.fromRGBAstr(getComputedStyle(this._ref.current).backgroundColor!);
+ let colsum = (col.r + col.g + col.b);
+ if (colsum / col.a > 600 || col.a < 0.25) runInAction(() => this._foregroundColor = "black");
+ else if (colsum / col.a <= 600 || col.a >= .25) runInAction(() => this._foregroundColor = "white");
+ }
+ }, { fireImmediately: true });
+ }
+ componentWillUnmount() {
+ this._backgroundReaction && this._backgroundReaction();
+ }
render() {
- return <button className="fontIconBox-outerDiv" style={{ background: StrCast(this.props.Document.backgroundColor) }}>
- <FontAwesomeIcon className="fontIconBox-icon" icon={this.Document.icon as any} size="sm" opacity={this.props.Document.unchecked ? "0.5" : "1"} />
+ return <button className="fontIconBox-outerDiv" ref={this._ref}
+ style={{ background: StrCast(this.props.Document.backgroundColor), boxShadow: this.props.Document.unchecked ? undefined : `4px 4px 12px black` }}>
+ <FontAwesomeIcon className="fontIconBox-icon" icon={this.Document.icon as any} color={this._foregroundColor} size="sm" />
</button>;
}
} \ No newline at end of file
diff --git a/src/new_fields/Doc.ts b/src/new_fields/Doc.ts
index 276596fb8..9e0944c69 100644
--- a/src/new_fields/Doc.ts
+++ b/src/new_fields/Doc.ts
@@ -738,6 +738,6 @@ Scripting.addGlobal(function getCopy(doc: any, copyProto: any) { return Doc.Make
Scripting.addGlobal(function copyField(field: any) { return ObjectField.MakeCopy(field); });
Scripting.addGlobal(function aliasDocs(field: any) { return new List<Doc>(field.map((d: any) => Doc.MakeAlias(d))); });
Scripting.addGlobal(function docList(field: any) { return DocListCast(field); });
-Scripting.addGlobal(function sameDocs(doc1: any, doc2: any) { return Doc.AreProtosEqual(doc1, doc2) });
+Scripting.addGlobal(function sameDocs(doc1: any, doc2: any) { return Doc.AreProtosEqual(doc1, doc2); });
Scripting.addGlobal(function undo() { return UndoManager.Undo(); });
Scripting.addGlobal(function redo() { return UndoManager.Redo(); }); \ No newline at end of file