aboutsummaryrefslogtreecommitdiff
path: root/src/client/views
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views')
-rw-r--r--src/client/views/ContextMenu.tsx89
-rw-r--r--src/client/views/DashboardView.tsx17
-rw-r--r--src/client/views/GestureOverlay.scss11
-rw-r--r--src/client/views/GestureOverlay.tsx20
-rw-r--r--src/client/views/Main.scss7
-rw-r--r--src/client/views/MainView.scss26
-rw-r--r--src/client/views/MainView.tsx32
-rw-r--r--src/client/views/_nodeModuleOverrides.scss15
-rw-r--r--src/client/views/collections/CollectionDockingView.scss10
-rw-r--r--src/client/views/collections/CollectionDockingView.tsx2
-rw-r--r--src/client/views/collections/CollectionView.tsx1
-rw-r--r--src/client/views/collections/TreeView.tsx7
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx37
-rw-r--r--src/client/views/nodes/DocumentView.tsx24
14 files changed, 155 insertions, 143 deletions
diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx
index cffcd0f17..c9908b4b0 100644
--- a/src/client/views/ContextMenu.tsx
+++ b/src/client/views/ContextMenu.tsx
@@ -1,10 +1,10 @@
-import React = require("react");
+import React = require('react');
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { action, computed, IReactionDisposer, observable } from "mobx";
-import { observer } from "mobx-react";
-import "./ContextMenu.scss";
-import { ContextMenuItem, ContextMenuProps, OriginalMenuProps } from "./ContextMenuItem";
-import { Utils } from "../../Utils";
+import { action, computed, IReactionDisposer, observable } from 'mobx';
+import { observer } from 'mobx-react';
+import './ContextMenu.scss';
+import { ContextMenuItem, ContextMenuProps, OriginalMenuProps } from './ContextMenuItem';
+import { Utils } from '../../Utils';
@observer
export class ContextMenu extends React.Component {
@@ -14,7 +14,7 @@ export class ContextMenu extends React.Component {
@observable private _pageX: number = 0;
@observable private _pageY: number = 0;
@observable private _display: boolean = false;
- @observable private _searchString: string = "";
+ @observable private _searchString: string = '';
@observable private _showSearch: boolean = false;
// afaik displaymenu can be called before all the items are added to the menu, so can't determine in displayMenu what the height of the menu will be
@observable private _yRelativeToTop: boolean = true;
@@ -43,9 +43,10 @@ export class ContextMenu extends React.Component {
onPointerDown = (e: PointerEvent) => {
this._mouseX = e.clientX;
this._mouseY = e.clientY;
- }
+ };
@action
onPointerUp = (e: PointerEvent) => {
+ if (e.button !== 2 && !e.ctrlKey) return;
const curX = e.clientX;
const curY = e.clientY;
if (this._ignoreUp) {
@@ -63,27 +64,27 @@ export class ContextMenu extends React.Component {
this._display = true;
}
}
- }
+ };
componentWillUnmount() {
- document.removeEventListener("pointerdown", this.onPointerDown);
- document.removeEventListener("pointerup", this.onPointerUp);
+ document.removeEventListener('pointerdown', this.onPointerDown, true);
+ document.removeEventListener('pointerup', this.onPointerUp);
this._reactionDisposer?.();
}
@action
componentDidMount = () => {
- document.addEventListener("pointerdown", this.onPointerDown);
- document.addEventListener("pointerup", this.onPointerUp);
- }
+ document.addEventListener('pointerdown', this.onPointerDown, true);
+ document.addEventListener('pointerup', this.onPointerUp);
+ };
@action
clearItems() {
this._items = [];
- this._defaultPrefix = "";
+ this._defaultPrefix = '';
this._defaultItem = undefined;
}
- _defaultPrefix: string = "";
+ _defaultPrefix: string = '';
_defaultItem: ((name: string) => void) | undefined;
findByDescription = (target: string, toLowerCase = false) => {
@@ -92,7 +93,7 @@ export class ContextMenu extends React.Component {
toLowerCase && (reference = reference.toLowerCase());
return reference === target;
});
- }
+ };
@action
addItem(item: ContextMenuProps) {
@@ -103,9 +104,9 @@ export class ContextMenu extends React.Component {
@action
moveAfter(item: ContextMenuProps, after: ContextMenuProps) {
if (after && this.findByDescription(after.description)) {
- const curInd = this._items.findIndex((i) => i.description === item.description);
+ const curInd = this._items.findIndex(i => i.description === item.description);
this._items.splice(curInd, 1);
- const afterInd = this._items.findIndex((i) => i.description === after.description);
+ const afterInd = this._items.findIndex(i => i.description === after.description);
this._items.splice(afterInd + 1, 0, item);
}
}
@@ -142,7 +143,7 @@ export class ContextMenu extends React.Component {
_onDisplay?: () => void = undefined;
@action
- displayMenu = (x: number, y: number, initSearch = "", showSearch = false, onDisplay?: () => void) => {
+ displayMenu = (x: number, y: number, initSearch = '', showSearch = false, onDisplay?: () => void) => {
//maxX and maxY will change if the UI/font size changes, but will work for any amount
//of items added to the menu
@@ -153,7 +154,7 @@ export class ContextMenu extends React.Component {
this._shouldDisplay = true;
this._onDisplay = onDisplay;
this._display = !onDisplay;
- }
+ };
@action
closeMenu = () => {
@@ -162,10 +163,10 @@ export class ContextMenu extends React.Component {
this._display = false;
this._shouldDisplay = false;
return wasOpen;
- }
+ };
@computed get filteredItems(): (OriginalMenuProps | string[])[] {
- const searchString = this._searchString.toLowerCase().split(" ");
+ const searchString = this._searchString.toLowerCase().split(' ');
const matches = (descriptions: string[]): boolean => {
return searchString.every(s => descriptions.some(desc => desc.toLowerCase().includes(s)));
};
@@ -176,7 +177,7 @@ export class ContextMenu extends React.Component {
for (const item of items) {
const description = item.description;
const path = groupFunc(description);
- if ("subitems" in item) {
+ if ('subitems' in item) {
const children = flattenItems(item.subitems, name => [...groupFunc(description), name]);
if (children.length || matches(path)) {
eles.push(path);
@@ -205,13 +206,14 @@ export class ContextMenu extends React.Component {
if (!this._searchString) {
return this._items.map((item, ind) => <ContextMenuItem {...item} noexpand={this.itemsNeedSearch ? true : (item as any).noexpand} key={ind + item.description} closeMenu={this.closeMenu} />);
}
- return this.filteredItems.map((value, index) =>
- Array.isArray(value) ?
+ return this.filteredItems.map((value, index) =>
+ Array.isArray(value) ? (
<div className="contextMenu-group">
- <div className="contextMenu-description">{value.join(" -> ")}</div>
+ <div className="contextMenu-description">{value.join(' -> ')}</div>
</div>
- :
- <ContextMenuItem {...value} key={index+value.description} closeMenu={this.closeMenu} selected={index === this.selectedIndex} />
+ ) : (
+ <ContextMenuItem {...value} key={index + value.description} closeMenu={this.closeMenu} selected={index === this.selectedIndex} />
+ )
);
}
@@ -220,32 +222,34 @@ export class ContextMenu extends React.Component {
}
render() {
- return !this._display ? (null) :
- <div className="contextMenu-cont" style={{left: this.pageX, ...(this._yRelativeToTop ? { top: this.pageY } : { bottom: this.pageY })}}>
- {!this.itemsNeedSearch ? (null) :
- <span className={"search-icon"}>
+ return !this._display ? null : (
+ <div className="contextMenu-cont" style={{ left: this.pageX, ...(this._yRelativeToTop ? { top: this.pageY } : { bottom: this.pageY }) }}>
+ {!this.itemsNeedSearch ? null : (
+ <span className={'search-icon'}>
<span className="icon-background">
<FontAwesomeIcon icon="search" size="lg" />
</span>
<input className="contextMenu-item contextMenu-description search" type="text" placeholder="Filter Menu..." value={this._searchString} onKeyDown={this.onKeyDown} onChange={this.onChange} autoFocus />
- </span>}
+ </span>
+ )}
{this.menuItems}
- </div>;
+ </div>
+ );
}
@action
onKeyDown = (e: React.KeyboardEvent) => {
- if (e.key === "ArrowDown") {
+ if (e.key === 'ArrowDown') {
if (this.selectedIndex < this.flatItems.length - 1) {
this.selectedIndex++;
}
e.preventDefault();
- } else if (e.key === "ArrowUp") {
+ } else if (e.key === 'ArrowUp') {
if (this.selectedIndex > 0) {
this.selectedIndex--;
}
e.preventDefault();
- } else if (e.key === "Enter" || e.key === "Tab") {
+ } else if (e.key === 'Enter' || e.key === 'Tab') {
const item = this.flatItems[this.selectedIndex];
if (item) {
item.event({ x: this.pageX, y: this.pageY });
@@ -256,20 +260,19 @@ export class ContextMenu extends React.Component {
e.preventDefault();
e.stopPropagation();
}
- }
+ };
@action
onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
this._searchString = e.target.value;
if (!this._searchString) {
this.selectedIndex = -1;
- }
- else {
+ } else {
if (this.selectedIndex === -1) {
this.selectedIndex = 0;
} else {
this.selectedIndex = Math.min(this.flatItems.length - 1, this.selectedIndex);
}
}
- }
-} \ No newline at end of file
+ };
+}
diff --git a/src/client/views/DashboardView.tsx b/src/client/views/DashboardView.tsx
index c59c37488..526a32f5a 100644
--- a/src/client/views/DashboardView.tsx
+++ b/src/client/views/DashboardView.tsx
@@ -10,6 +10,7 @@ import { DocServer } from '../DocServer';
import { Docs, DocumentOptions } from '../documents/Documents';
import { CollectionViewType } from '../documents/DocumentTypes';
import { HistoryUtil } from '../util/History';
+import { ScriptingGlobals } from '../util/ScriptingGlobals';
import { SharingManager } from '../util/SharingManager';
import { undoBatch } from '../util/UndoManager';
import { CollectionDockingView } from './collections/CollectionDockingView';
@@ -288,3 +289,19 @@ export class DashboardView extends React.Component {
export function AddToList(MySharedDocs: Doc, arg1: string, dash: any) {
throw new Error('Function not implemented.');
}
+
+ScriptingGlobals.add(function createNewDashboard() {
+ return DashboardView.createNewDashboard();
+}, 'creates a new dashboard when called');
+ScriptingGlobals.add(function shareDashboard(dashboard: Doc) {
+ SharingManager.Instance.open(undefined, dashboard);
+}, 'opens sharing dialog for Dashboard');
+ScriptingGlobals.add(function removeDashboard(dashboard: Doc) {
+ DashboardView.removeDashboard(dashboard);
+}, 'Remove Dashboard from Dashboards');
+ScriptingGlobals.add(function addToDashboards(dashboard: Doc) {
+ DashboardView.openDashboard(Doc.MakeAlias(dashboard));
+}, 'adds Dashboard to set of Dashboards');
+ScriptingGlobals.add(function snapshotDashboard() {
+ DashboardView.snapshotDashboard();
+}, 'creates a snapshot copy of a dashboard');
diff --git a/src/client/views/GestureOverlay.scss b/src/client/views/GestureOverlay.scss
index 16a4c74d1..f5cbbffb1 100644
--- a/src/client/views/GestureOverlay.scss
+++ b/src/client/views/GestureOverlay.scss
@@ -1,11 +1,8 @@
.gestureOverlay-cont {
width: 100vw;
height: 100vh;
- position: relative;
- top: 0;
- left: 0;
+ position: absolute;
touch-action: none;
- z-index: -1;
.pointerBubbles {
width: 100%;
@@ -18,7 +15,7 @@
width: 15px;
height: 15px;
border-radius: 100%;
- border: .5px solid grey;
+ border: 0.5px solid grey;
}
}
}
@@ -44,7 +41,7 @@
width: 100%;
height: 25px;
padding: 2.5px;
- border-bottom: .5px solid black;
+ border-bottom: 0.5px solid black;
}
}
@@ -62,4 +59,4 @@
position: absolute;
background-color: transparent;
border: 1px solid black;
-} \ No newline at end of file
+}
diff --git a/src/client/views/GestureOverlay.tsx b/src/client/views/GestureOverlay.tsx
index 5a68e9091..5ec4de953 100644
--- a/src/client/views/GestureOverlay.tsx
+++ b/src/client/views/GestureOverlay.tsx
@@ -582,13 +582,15 @@ export class GestureOverlay extends Touchable {
})
);
}
- if (InteractionUtils.IsType(e, InteractionUtils.PENTYPE) || [InkTool.Highlighter, InkTool.Pen, InkTool.Write].includes(Doc.ActiveTool)) {
- if (InteractionUtils.IsType(e, InteractionUtils.PENTYPE)) {
- Doc.ActiveTool = InkTool.Write;
+ if (!(e.target as any)?.className?.startsWith('lm_')) {
+ if (InteractionUtils.IsType(e, InteractionUtils.PENTYPE) || [InkTool.Highlighter, InkTool.Pen, InkTool.Write].includes(Doc.ActiveTool)) {
+ if (InteractionUtils.IsType(e, InteractionUtils.PENTYPE)) {
+ Doc.ActiveTool = InkTool.Write;
+ }
+ this._points.push({ X: e.clientX, Y: e.clientY });
+ setupMoveUpEvents(this, e, this.onPointerMove, this.onPointerUp, emptyFunction);
+ // if (Doc.ActiveTool === InkTool.Highlighter) SetActiveInkColor("rgba(245, 230, 95, 0.75)");
}
- this._points.push({ X: e.clientX, Y: e.clientY });
- setupMoveUpEvents(this, e, this.onPointerMove, this.onPointerUp, emptyFunction);
- // if (Doc.ActiveTool === InkTool.Highlighter) SetActiveInkColor("rgba(245, 230, 95, 0.75)");
}
};
@@ -965,7 +967,7 @@ export class GestureOverlay extends Touchable {
this._strokes.map((l, i) => {
const b = { left: -20000, right: 20000, top: -20000, bottom: 20000, width: 40000, height: 40000 }; //this.getBounds(l, true);
return (
- <svg key={i} width={b.width} height={b.height} style={{ transform: `translate(${b.left}px, ${b.top}px)`, pointerEvents: 'none', position: 'absolute', zIndex: 30000, overflow: 'visible' }}>
+ <svg key={i} width={b.width} height={b.height} style={{ top: 0, left: 0, transform: `translate(${b.left}px, ${b.top}px)`, pointerEvents: 'none', position: 'absolute', zIndex: 30000, overflow: 'visible' }}>
{InteractionUtils.CreatePolyline(
l,
b.left,
@@ -992,9 +994,9 @@ export class GestureOverlay extends Touchable {
);
}),
this._points.length <= 1 ? null : (
- <svg key="svg" width={B.width} height={B.height} style={{ transform: `translate(${B.left}px, ${B.top}px)`, pointerEvents: 'none', position: 'absolute', zIndex: 30000, overflow: 'visible' }}>
+ <svg key="svg" width={B.width} height={B.height} style={{ top: 0, left: 0, transform: `translate(${B.left}px, ${B.top}px)`, pointerEvents: 'none', position: 'absolute', zIndex: 30000, overflow: 'visible' }}>
{InteractionUtils.CreatePolyline(
- this._points.map(p => ({ X: p.X, Y: p.Y - (rect?.y || 0) })),
+ this._points.map(p => ({ X: p.X - (rect?.x || 0), Y: p.Y - (rect?.y || 0) })),
B.left,
B.top,
ActiveInkColor(),
diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss
index c8e64b5c4..c7a7614ac 100644
--- a/src/client/views/Main.scss
+++ b/src/client/views/Main.scss
@@ -1,5 +1,5 @@
-@import "global/globalCssVariables";
-@import "nodeModuleOverrides";
+@import 'global/globalCssVariables';
+@import 'nodeModuleOverrides';
:root {
--flyoutHandleWidth: 28px;
@@ -24,7 +24,6 @@ body {
// -ms-user-select: none;
// }
-
.jsx-parser {
width: 100%;
height: 100%;
@@ -70,4 +69,4 @@ button:hover {
.svg-inline--fa {
vertical-align: unset;
-} \ No newline at end of file
+}
diff --git a/src/client/views/MainView.scss b/src/client/views/MainView.scss
index a695577d0..ad87fb874 100644
--- a/src/client/views/MainView.scss
+++ b/src/client/views/MainView.scss
@@ -1,6 +1,5 @@
-@import "global/globalCssVariables";
-@import "nodeModuleOverrides";
-
+@import 'global/globalCssVariables';
+@import 'nodeModuleOverrides';
.dash-tooltip {
font-size: 11px;
@@ -63,6 +62,17 @@
}
}
+.mainView-container,
+.mainView-container-Dark {
+ .lm_header .lm_tab {
+ padding: 0px;
+ opacity: 0.7;
+ box-shadow: none;
+ height: 25px;
+ border-bottom: black solid;
+ }
+}
+
.mainView-container {
color: $dark-gray;
@@ -183,7 +193,6 @@
background-color: $light-gray;
}
}
-
}
.mainView-libraryHandle {
@@ -252,7 +261,6 @@
}
.buttonContainer {
-
position: absolute;
bottom: 0;
@@ -270,8 +278,6 @@
}
}
-
-
.mainView-logout {
position: absolute;
right: 0;
@@ -309,11 +315,10 @@
}
.mainView-libraryFlyout-out {
- transition: width .25s;
+ transition: width 0.25s;
box-shadow: rgb(156, 147, 150) 0.2vw 0.2vw 0.2vw;
}
-
.mainView-libraryHandle {
width: var(--flyoutHandleWidth);
height: 55px;
@@ -334,7 +339,6 @@
margin-right: 3px;
padding-top: 19px;
}
-
}
.mainView-dashboard {
@@ -371,4 +375,4 @@
display: block;
width: 500px;
height: 1000px;
-} \ No newline at end of file
+}
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index edc16d9a6..b61cd3409 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -465,7 +465,7 @@ export class MainView extends React.Component {
window.addEventListener('drop', e => e.preventDefault(), false); // prevent default behavior of navigating to a new web page
window.addEventListener('dragover', e => e.preventDefault(), false);
// document.addEventListener("pointermove", action(e => SearchBox.Instance._undoBackground = UndoManager.batchCounter ? "#000000a8" : undefined));
- document.addEventListener('pointerdown', this.globalPointerDown);
+ document.addEventListener('pointerdown', this.globalPointerDown, true);
document.addEventListener(
'click',
(e: MouseEvent) => {
@@ -590,19 +590,21 @@ export class MainView extends React.Component {
@computed get dockingContent() {
return (
- <div
- key="docking"
- className={`mainView-dockingContent${this._leftMenuFlyoutWidth ? '-flyout' : ''}`}
- onDrop={e => {
- e.stopPropagation();
- e.preventDefault();
- }}
- style={{
- minWidth: `calc(100% - ${this._leftMenuFlyoutWidth + this.leftMenuWidth() + this.propertiesWidth()}px)`,
- transform: LightboxView.LightboxDoc ? 'scale(0.0001)' : undefined,
- }}>
- {!this.mainContainer ? null : this.mainDocView}
- </div>
+ <GestureOverlay>
+ <div
+ key="docking"
+ className={`mainView-dockingContent${this._leftMenuFlyoutWidth ? '-flyout' : ''}`}
+ onDrop={e => {
+ e.stopPropagation();
+ e.preventDefault();
+ }}
+ style={{
+ minWidth: `calc(100% - ${this._leftMenuFlyoutWidth + this.leftMenuWidth() + this.propertiesWidth()}px)`,
+ transform: LightboxView.LightboxDoc ? 'scale(0.0001)' : undefined,
+ }}>
+ {!this.mainContainer ? null : this.mainDocView}
+ </div>
+ </GestureOverlay>
);
}
@@ -974,7 +976,7 @@ export class MainView extends React.Component {
<div style={{ position: 'relative', display: LightboxView.LightboxDoc ? 'none' : undefined, zIndex: 1999 }}>
<CollectionMenu panelWidth={this.topMenuWidth} panelHeight={this.topMenuHeight} />
</div>
- <GestureOverlay> {this.mainDashboardArea} </GestureOverlay>
+ {this.mainDashboardArea}
</>
);
case 'home':
diff --git a/src/client/views/_nodeModuleOverrides.scss b/src/client/views/_nodeModuleOverrides.scss
index fd0ac9d5c..17eff022f 100644
--- a/src/client/views/_nodeModuleOverrides.scss
+++ b/src/client/views/_nodeModuleOverrides.scss
@@ -1,4 +1,4 @@
-@import "./global/globalCssVariables";
+@import './global/globalCssVariables';
// this file is for overriding all the css from installed node modules
// goldenlayout stuff
@@ -56,16 +56,5 @@ div .lm_header {
font-family: $sans-serif !important;
}
-.lm_header .lm_controls {
- align-items: center;
- position: absolute;
- background-color: $dark-gray;
- border-radius: 5px;
- display: flex;
- justify-content: space-evenly;
- height: 23px;
- width: 65px;
-}
-
// @TODO the ril__navgiation buttons in the img gallery are a lil messed up but I can't figure out
-// why. Low priority for now but it's bugging me. --Julie \ No newline at end of file
+// why. Low priority for now but it's bugging me. --Julie
diff --git a/src/client/views/collections/CollectionDockingView.scss b/src/client/views/collections/CollectionDockingView.scss
index 6d5a39bc2..091ba8e74 100644
--- a/src/client/views/collections/CollectionDockingView.scss
+++ b/src/client/views/collections/CollectionDockingView.scss
@@ -37,11 +37,11 @@
}
.lm_header .lm_tab {
- padding: 0px;
- opacity: 0.7;
- box-shadow: none;
- height: 25px;
- border-bottom: black solid;
+ // padding: 0px; // moved to MainView.scss, othwerise they get overridden by default stylings
+ // opacity: 0.7;
+ // box-shadow: none;
+ // height: 25px;
+ // border-bottom: black solid;
.collectionDockingView-gear {
display: none;
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index d47dfbea0..42f9bb981 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -377,7 +377,7 @@ export class CollectionDockingView extends CollectionSubView() {
}
}
}
- if (!e.nativeEvent.cancelBubble && !InteractionUtils.IsType(e, InteractionUtils.TOUCHTYPE) && !InteractionUtils.IsType(e, InteractionUtils.PENTYPE) && ![InkTool.Highlighter, InkTool.Pen, InkTool.Write].includes(Doc.ActiveTool)) {
+ if (!InteractionUtils.IsType(e, InteractionUtils.TOUCHTYPE) && !InteractionUtils.IsType(e, InteractionUtils.PENTYPE) && ![InkTool.Highlighter, InkTool.Pen, InkTool.Write].includes(Doc.ActiveTool)) {
e.stopPropagation();
}
};
diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx
index f38efe578..2ab5f6247 100644
--- a/src/client/views/collections/CollectionView.tsx
+++ b/src/client/views/collections/CollectionView.tsx
@@ -160,7 +160,6 @@ export class CollectionView extends ViewBoxAnnotatableComponent<ViewBoxAnnotatab
onContextMenu = (e: React.MouseEvent): void => {
const cm = ContextMenu.Instance;
- if (e.nativeEvent.cancelBubble) return; // nested calls to React to render can cause the same event to trigger in the outer view even if the inner view has handled it. This avoid CollectionDockingView menu options from being added when the event has been handled by a sub-document.
if (cm && !e.isPropagationStopped() && this.rootDoc[Id] !== Doc.MainDocId) {
// need to test this because GoldenLayout causes a parallel hierarchy in the React DOM for its children and the main document view7
this.setupViewTypes(
diff --git a/src/client/views/collections/TreeView.tsx b/src/client/views/collections/TreeView.tsx
index eb5faf4e1..5a2103e98 100644
--- a/src/client/views/collections/TreeView.tsx
+++ b/src/client/views/collections/TreeView.tsx
@@ -31,6 +31,7 @@ import { CollectionTreeView, TreeViewType } from './CollectionTreeView';
import { CollectionView } from './CollectionView';
import './TreeView.scss';
import React = require('react');
+import { ScriptingGlobals } from '../../util/ScriptingGlobals';
export interface TreeViewProps {
treeView: CollectionTreeView;
@@ -1223,3 +1224,9 @@ export class TreeView extends React.Component<TreeViewProps> {
});
}
}
+
+ScriptingGlobals.add(function TreeView_addNewFolder() {
+ TreeView._editTitleOnLoad = { id: Utils.GenerateGuid(), parent: undefined };
+ const opts = { title: 'Untitled folder', _stayInCollection: true, isFolder: true };
+ return Doc.AddDocToList(Doc.MyFilesystem, 'data', Docs.Create.TreeDocument([], opts, TreeView._editTitleOnLoad.id));
+});
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 07ea26346..4174661d8 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -509,7 +509,6 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection
this._downY = this._lastY = e.pageY;
if (e.button === 0 && !e.altKey && !e.ctrlKey && this.props.isContentActive(true)) {
if (
- !e.nativeEvent.cancelBubble &&
!this.props.Document._isGroup && // group freeforms don't pan when dragged -- instead let the event go through to allow the group itself to drag
!InteractionUtils.IsType(e, InteractionUtils.TOUCHTYPE) &&
!InteractionUtils.IsType(e, InteractionUtils.PENTYPE)
@@ -543,24 +542,22 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection
@action
handle1PointerDown = (e: React.TouchEvent, me: InteractionUtils.MultiTouchEvent<React.TouchEvent>) => {
- if (!e.nativeEvent.cancelBubble) {
- // const myTouches = InteractionUtils.GetMyTargetTouches(me, this.prevPoints, true);
- const pt = me.changedTouches[0];
- if (pt) {
- this._hitCluster = this.pickCluster(this.getTransform().transformPoint(pt.clientX, pt.clientY));
- if (!e.shiftKey && !e.altKey && !e.ctrlKey && this.props.isContentActive(true)) {
- this.removeMoveListeners();
- this.addMoveListeners();
- this.removeEndListeners();
- this.addEndListeners();
- if (Doc.ActiveTool === InkTool.None) {
- this._lastX = pt.pageX;
- this._lastY = pt.pageY;
- e.preventDefault();
- e.stopPropagation();
- } else {
- e.preventDefault();
- }
+ // const myTouches = InteractionUtils.GetMyTargetTouches(me, this.prevPoints, true);
+ const pt = me.changedTouches[0];
+ if (pt) {
+ this._hitCluster = this.pickCluster(this.getTransform().transformPoint(pt.clientX, pt.clientY));
+ if (!e.shiftKey && !e.altKey && !e.ctrlKey && this.props.isContentActive(true)) {
+ this.removeMoveListeners();
+ this.addMoveListeners();
+ this.removeEndListeners();
+ this.addEndListeners();
+ if (Doc.ActiveTool === InkTool.None) {
+ this._lastX = pt.pageX;
+ this._lastY = pt.pageY;
+ e.preventDefault();
+ e.stopPropagation();
+ } else {
+ e.preventDefault();
}
}
}
@@ -976,7 +973,7 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection
@action
handle2PointersDown = (e: React.TouchEvent, me: InteractionUtils.MultiTouchEvent<React.TouchEvent>) => {
- if (!e.nativeEvent.cancelBubble && this.props.isContentActive(true)) {
+ if (this.props.isContentActive(true)) {
// const pt1: React.Touch | null = e.targetTouches.item(0);
// const pt2: React.Touch | null = e.targetTouches.item(1);
// // if (!pt1 || !pt2) return;
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index f89c65052..dea718a0d 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -362,7 +362,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
};
handle2PointersDown = (e: React.TouchEvent, me: InteractionUtils.MultiTouchEvent<React.TouchEvent>) => {
- if (!e.nativeEvent.cancelBubble && !this.props.isSelected()) {
+ if (!this.props.isSelected()) {
e.stopPropagation();
e.preventDefault();
@@ -380,14 +380,14 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
if (touch) {
this._downX = touch.clientX;
this._downY = touch.clientY;
- if (!e.nativeEvent.cancelBubble) {
- if ((this.props.isDocumentActive?.() || this.layoutDoc.onDragStart || this.onClickHandler) && !e.ctrlKey && !this.layoutDoc._lockedPosition && !DocListCast(Doc.MyOverlayDocs?.data).includes(this.layoutDoc)) e.stopPropagation();
- this.removeMoveListeners();
- this.addMoveListeners();
- this.removeEndListeners();
- this.addEndListeners();
+ if ((this.props.isDocumentActive?.() || this.layoutDoc.onDragStart || this.onClickHandler) && !e.ctrlKey && !this.layoutDoc._lockedPosition && !DocListCast(Doc.MyOverlayDocs?.data).includes(this.layoutDoc)) {
e.stopPropagation();
}
+ this.removeMoveListeners();
+ this.addMoveListeners();
+ this.removeEndListeners();
+ this.addEndListeners();
+ e.stopPropagation();
}
};
@@ -510,7 +510,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
}
onKeyDown = (e: React.KeyboardEvent) => {
- if (e.altKey && !e.nativeEvent.cancelBubble) {
+ if (e.altKey) {
e.stopPropagation();
e.preventDefault();
if (e.key === '†' || e.key === 't') {
@@ -543,7 +543,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
});
};
onClick = action((e: React.MouseEvent | React.PointerEvent) => {
- if (!e.nativeEvent.cancelBubble && !this.Document.ignoreClick && this.props.renderDepth >= 0 && Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD && Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD) {
+ if (!this.Document.ignoreClick && this.props.renderDepth >= 0 && Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD && Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD) {
let stopPropagate = true;
let preventDefault = true;
const isScriptBox = () => StrCast(Doc.LayoutField(this.layoutDoc))?.includes(ScriptingBox.name);
@@ -643,11 +643,8 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
}
this._downX = e.clientX;
this._downY = e.clientY;
- if (
- (!e.nativeEvent.cancelBubble || this.onClickHandler || this.layoutDoc.onDragStart) &&
+ if (Doc.ActiveTool === InkTool.None && !(this.props.Document.rootDocument && !(e.ctrlKey || e.button > 0))) {
// if this is part of a template, let the event go up to the tempalte root unless right/ctrl clicking
- !(this.props.Document.rootDocument && !(e.ctrlKey || e.button > 0))
- ) {
if (
(this.props.isDocumentActive?.() || this.layoutDoc.onDragStart) &&
!this.props.onBrowseClick?.() &&
@@ -792,7 +789,6 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
@action
onContextMenu = (e?: React.MouseEvent, pageX?: number, pageY?: number) => {
- if (e?.nativeEvent.cancelBubble) return;
if (e && this.rootDoc._hideContextMenu && Doc.noviceMode) {
e.preventDefault();
e.stopPropagation();
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-12-01 02:13:48 +0000