From 1644ec6fe0c42dab05f837761c559fbc9b4a6450 Mon Sep 17 00:00:00 2001 From: monikahedman Date: Thu, 15 Aug 2019 13:01:09 -0400 Subject: text box almost happening --- src/client/views/GlobalKeyHandler.ts | 4 +++- src/client/views/PreviewCursor.tsx | 26 ++++++++++++++++++++-- .../collectionFreeForm/CollectionFreeFormView.tsx | 1 + .../collections/collectionFreeForm/MarqueeView.tsx | 2 +- 4 files changed, 29 insertions(+), 4 deletions(-) (limited to 'src') diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts index f55953bd4..df907b950 100644 --- a/src/client/views/GlobalKeyHandler.ts +++ b/src/client/views/GlobalKeyHandler.ts @@ -181,7 +181,9 @@ export default class KeyManager { break; case "a": case "v": - this.printClipboard(); + // this.printClipboard(); + stopPropagation = false; + preventDefault = false; break; case "x": case "c": diff --git a/src/client/views/PreviewCursor.tsx b/src/client/views/PreviewCursor.tsx index e7a5475ed..9967e142d 100644 --- a/src/client/views/PreviewCursor.tsx +++ b/src/client/views/PreviewCursor.tsx @@ -3,11 +3,15 @@ import { observer } from 'mobx-react'; import "normalize.css"; import * as React from 'react'; import "./PreviewCursor.scss"; +import { Docs } from '../documents/Documents'; +import { Transform } from 'prosemirror-transform'; +import { Doc } from '../../new_fields/Doc'; @observer export class PreviewCursor extends React.Component<{}> { private _prompt = React.createRef(); static _onKeyPress?: (e: KeyboardEvent) => void; + static _addLiveTextDoc: (doc: Doc) => void; @observable static _clickPoint = [0, 0]; @observable public static Visible = false; //when focus is lost, this will remove the preview cursor @@ -20,13 +24,29 @@ export class PreviewCursor extends React.Component<{}> { document.addEventListener("keydown", this.onKeyPress); document.addEventListener("paste", this.paste); } + paste = (e: ClipboardEvent) => { console.log(e.clipboardData); if (e.clipboardData) { + //what needs to be done with this? console.log(e.clipboardData.getData("text/html")); - console.log(e.clipboardData.getData("text/csv")); + // console.log(e.clipboardData.getData("text/csv")); console.log(e.clipboardData.getData("text/plain")); + console.log(e.clipboardData.getData("image/png")); + console.log(e.clipboardData.getData("image/jpg")); + console.log(e.clipboardData.getData("image/jpeg")); + + if (e.clipboardData.getData("text/plain") !== "") { + let text = e.clipboardData.getData("text/plain"); + let newBox = Docs.Create.TextDocument({ width: 200, height: 100, x: PreviewCursor._clickPoint[0], y: PreviewCursor._clickPoint[1], title: "-typed text-" }); + newBox.proto!.autoHeight = true; + PreviewCursor._addLiveTextDoc(newBox); + } } + + // let newBox = Docs.Create.TextDocument({ width: 200, height: 100, x: x, y: y, title: "-typed text-" }); + // newBox.proto!.autoHeight = true; + // this.props.addLiveTextDocument(newBox); } @action @@ -49,9 +69,11 @@ export class PreviewCursor extends React.Component<{}> { } } @action - public static Show(x: number, y: number, onKeyPress: (e: KeyboardEvent) => void) { + public static Show(x: number, y: number, onKeyPress: (e: KeyboardEvent) => void, addLiveText: (doc: Doc) => void) { + console.log("clickpoint setting") this._clickPoint = [x, y]; this._onKeyPress = onKeyPress; + this._addLiveTextDoc = addLiveText; setTimeout(action(() => this.Visible = true), (1)); } render() { diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 0501bf929..34cb2f5e0 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -37,6 +37,7 @@ import "./CollectionFreeFormView.scss"; import { MarqueeView } from "./MarqueeView"; import React = require("react"); import { DocumentType, Docs } from "../../../documents/Documents"; +import { PreviewCursor } from "../../PreviewCursor"; library.add(faEye as any, faTable, faPaintBrush, faExpandArrowsAlt, faCompressArrowsAlt, faCompass, faUpload, faBraille, faChalkboard); diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index aad26efa0..08d2a8adf 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -203,7 +203,7 @@ export class MarqueeView extends React.Component onClick = (e: React.MouseEvent): void => { if (Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD && Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD) { - PreviewCursor.Show(e.clientX, e.clientY, this.onKeyPress); + PreviewCursor.Show(e.clientX, e.clientY, this.onKeyPress, this.props.addLiveTextDocument); // let the DocumentView stopPropagation of this event when it selects this document } else { // why do we get a click event when the cursor have moved a big distance? // let's cut it off here so no one else has to deal with it. -- cgit v1.2.3-70-g09d2 From 9d76e8c2f318b4c6a4f941e6d2c8e795bc93f372 Mon Sep 17 00:00:00 2001 From: monikahedman Date: Thu, 15 Aug 2019 16:15:05 -0400 Subject: updated webbox --- src/client/views/nodes/WebBox.tsx | 20 ++++++++------------ 1 file changed, 8 insertions(+), 12 deletions(-) (limited to 'src') diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx index ff5297783..91170e99a 100644 --- a/src/client/views/nodes/WebBox.tsx +++ b/src/client/views/nodes/WebBox.tsx @@ -17,6 +17,7 @@ import { RefField } from "../../../new_fields/RefField"; import { ObjectField } from "../../../new_fields/ObjectField"; import { updateSourceFile } from "typescript"; import { KeyValueBox } from "./KeyValueBox"; +import { setReactionScheduler } from "mobx/lib/internal"; @observer export class WebBox extends React.Component { @@ -38,6 +39,8 @@ export class WebBox extends React.Component { this.props.Document.height = NumCast(this.props.Document.width) / youtubeaspect; } } + + this.setURL(); } @action @@ -50,15 +53,13 @@ export class WebBox extends React.Component { const script = KeyValueBox.CompileKVPScript(`new WebField("${this.url}")`); if (!script) return; KeyValueBox.ApplyKVPScript(this.props.Document, "data", script); - let mod = document.getElementById("webpage-input"); - if (mod) mod.style.display = "none"; } - @computed - get getURL() { + @action + setURL() { let urlField: FieldResult = Cast(this.props.Document.data, WebField) - if (urlField) return urlField.url.toString(); - return ""; + if (urlField) this.url = urlField.url.toString(); + else this.url = ""; } onValueKeyDown = async (e: React.KeyboardEvent) => { @@ -86,10 +87,9 @@ export class WebBox extends React.Component {