diff options
Diffstat (limited to 'src/client/views')
-rw-r--r-- | src/client/views/PropertiesButtons.tsx | 15 | ||||
-rw-r--r-- | src/client/views/collections/CollectionView.tsx | 2 | ||||
-rw-r--r-- | src/client/views/collections/collectionFreeForm/PropertiesView.scss | 66 | ||||
-rw-r--r-- | src/client/views/collections/collectionFreeForm/PropertiesView.tsx | 42 | ||||
-rw-r--r-- | src/client/views/nodes/DocumentView.tsx | 13 | ||||
-rw-r--r-- | src/client/views/nodes/FontIconBox.tsx | 7 |
6 files changed, 84 insertions, 61 deletions
diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 5c584d270..a905dc1e7 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -3,7 +3,7 @@ import { faArrowAltCircleDown, faArrowAltCircleRight, faArrowAltCircleUp, faChec import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { action, computed, observable, runInAction } from "mobx"; import { observer } from "mobx-react"; -import { Doc, DocListCast } from "../../fields/Doc"; +import { Doc, DocListCast, AclEdit, AclAdmin } from "../../fields/Doc"; import { RichTextField } from '../../fields/RichTextField'; import { Cast, NumCast, BoolCast } from "../../fields/Types"; import { emptyFunction, setupMoveUpEvents, Utils } from "../../Utils"; @@ -30,6 +30,7 @@ import { undoBatch, UndoManager } from '../util/UndoManager'; import { DocumentType } from '../documents/DocumentTypes'; import { InkField } from '../../fields/InkField'; import { PresBox } from './nodes/PresBox'; +import { GetEffectiveAcl } from "../../fields/util"; const higflyout = require("@hig/flyout"); export const { anchorPoints } = higflyout; export const Flyout = higflyout.default; @@ -428,7 +429,19 @@ export class PropertiesButtons extends React.Component<{}, {}> { @undoBatch @action deleteDocument = () => { + const recent = Cast(Doc.UserDoc().myRecentlyClosed, Doc) as Doc; + const selected = SelectionManager.SelectedDocuments().slice(); + + selected.map(dv => { + const effectiveAcl = GetEffectiveAcl(dv.props.Document); + if (effectiveAcl === AclEdit || effectiveAcl === AclAdmin) { // deletes whatever you have the right to delete + recent && Doc.AddDocToList(recent, "data", dv.props.Document, undefined, true, true); + dv.props.removeDocument?.(dv.props.Document); + } + }); + this.selectedDoc && (this.selectedDoc.deleted = true); this.selectedDocumentView?.props.ContainingCollectionView?.removeDocument(this.selectedDocumentView?.props.Document); + SelectionManager.DeselectAll(); } @computed diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx index 4d1cb670c..837ae7e86 100644 --- a/src/client/views/collections/CollectionView.tsx +++ b/src/client/views/collections/CollectionView.tsx @@ -594,7 +594,7 @@ export class CollectionView extends Touchable<FieldViewProps & CollectionViewCus ""))} {(Doc.UserDoc()?.noviceMode || !this.props.isSelected() && !this.props.Document.forceActive) || this.props.Document.hideFilterView ? (null) : <div className="collectionView-filterDragger" title="library View Dragger" onPointerDown={this.onPointerDown} - style={{ right: this.facetWidth() - 1, top: this.props.Document._viewType === CollectionViewType.Docking ? "25%" : "55%" }} /> + style={{ right: this.facetWidth() - 1, top: this.props.Document._viewType === CollectionViewType.Docking ? "25%" : "60%" }} /> } {Doc.UserDoc()?.noviceMode || this.facetWidth() < 10 ? (null) : this.filterView} </div>); diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.scss b/src/client/views/collections/collectionFreeForm/PropertiesView.scss index 5e0c9fcbb..aee28366a 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.scss +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.scss @@ -23,8 +23,9 @@ height: 20px; padding-left: 38px; margin-top: -5px; - right: 19; - position: absolute; + align-items: flex-end; + margin-left: auto; + margin-right: 10px; &:hover { color: grey; @@ -66,9 +67,9 @@ .propertiesView-settings-title-icon { float: right; - right: 0; - position: absolute; - margin-left: 2px; + justify-items: right; + align-items: flex-end; + margin-left: auto; margin-right: 9px; &:hover { @@ -104,9 +105,9 @@ .propertiesView-sharing-title-icon { float: right; - right: 0; - position: absolute; - margin-left: 2px; + justify-items: right; + align-items: flex-end; + margin-left: auto; margin-right: 9px; &:hover { @@ -154,9 +155,9 @@ .propertiesView-appearance-title-icon { float: right; - right: 0; - position: absolute; - margin-left: 2px; + justify-items: right; + align-items: flex-end; + margin-left: auto; margin-right: 9px; &:hover { @@ -191,9 +192,9 @@ .propertiesView-transform-title-icon { float: right; - right: 0; - position: absolute; - margin-left: 2px; + justify-items: right; + align-items: flex-end; + margin-left: auto; margin-right: 9px; &:hover { @@ -285,9 +286,8 @@ .propertiesView-sharingTable-item-permission { display: flex; - right: 34; - float: right; - position: absolute; + align-items: flex-end; + margin-left: auto; .permissions-select { z-index: 1; @@ -326,25 +326,18 @@ cursor: pointer; } - .propertiesView-fields-title-name { - font-size: 12.5px; - font-weight: bold; - white-space: nowrap; - width: 35px; - display: flex; - } - .propertiesView-fields-title-icon { float: right; - right: 0; - position: absolute; - margin-left: 2px; + justify-items: right; + align-items: flex-end; + margin-left: auto; margin-right: 9px; &:hover { cursor: pointer; } } + } .propertiesView-fields-checkbox { @@ -407,9 +400,9 @@ .propertiesView-layout-title-icon { float: right; - right: 0; - position: absolute; - margin-left: 2px; + justify-items: right; + align-items: flex-end; + margin-left: auto; margin-right: 9px; &:hover { @@ -444,9 +437,9 @@ .propertiesView-presTrails-title-icon { float: right; - right: 0; - position: absolute; - margin-left: 2px; + justify-items: right; + align-items: flex-end; + margin-left: auto; margin-right: 9px; &:hover { @@ -730,4 +723,9 @@ &:hover { border: 0.75px solid rgb(122, 28, 28); } +} + + +.properties-flyout { + grid-column: 2/4; }
\ No newline at end of file diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 1a8ee3ea1..2d76e109c 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -632,16 +632,19 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { set colorStk(value) { value && (this._lastLine = value); this.selectedDoc && (this.selectedDoc.color = value ? value : undefined); } colorButton(value: string, type: string, setter: () => {}) { - return <Flyout anchorPoint={anchorPoints.LEFT_TOP} - content={type === "fill" ? this.fillPicker : this.linePicker}> - <div className="color-button" key="color" onPointerDown={undoBatch(action(e => setter()))}> - <div className="color-button-preview" style={{ - backgroundColor: value ?? "121212", width: 15, height: 15, - display: value === "" || value === "transparent" ? "none" : "" - }} /> - {value === "" || value === "transparent" ? <p style={{ fontSize: 25, color: "red", marginTop: -14, position: "fixed" }}>☒</p> : ""} - </div> - </Flyout>; + // return <div className="properties-flyout" onPointerEnter={e => this.changeScrolling(false)} + // onPointerLeave={e => this.changeScrolling(true)}> + // <Flyout anchorPoint={anchorPoints.LEFT_TOP} + // content={type === "fill" ? this.fillPicker : this.linePicker}> + return <div className="color-button" key="color" onPointerDown={undoBatch(action(e => setter()))}> + <div className="color-button-preview" style={{ + backgroundColor: value ?? "121212", width: 15, height: 15, + display: value === "" || value === "transparent" ? "none" : "" + }} /> + {value === "" || value === "transparent" ? <p style={{ fontSize: 25, color: "red", marginTop: -14 }}>☒</p> : ""} + </div>; + // </Flyout> + // </div>; } @@ -686,8 +689,8 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { <div className="stroke-button">{this.lineButton}</div> </div> </div> - {/* {this._fillBtn ? this.fillPicker : ""} - {this._lineBtn ? this.linePicker : ""} */} + {this._fillBtn ? this.fillPicker : ""} + {this._lineBtn ? this.linePicker : ""} </div>; } @@ -813,7 +816,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { if (this.selectedDoc && !this.isPres) { return <div className="propertiesView" style={{ width: this.props.width, - // overflowY: this.inActions ? "visible" : "scroll" + //overflowY: this.scrolling ? "scroll" : "visible" }} > <div className="propertiesView-title" style={{ width: this.props.width }}> Properties @@ -918,11 +921,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { <div className="propertiesView-fields-title" onPointerDown={() => runInAction(() => { this.openFields = !this.openFields; })} style={{ backgroundColor: this.openFields ? "black" : "" }}> - <div className="propertiesView-fields-title-name"> - Fields {"&"} Tags + Fields {"&"} Tags <div className="propertiesView-fields-title-icon"> - <FontAwesomeIcon icon={this.openFields ? "caret-down" : "caret-right"} size="lg" color="white" /> - </div> + <FontAwesomeIcon icon={this.openFields ? "caret-down" : "caret-right"} size="lg" color="white" /> </div> </div> {!novice && this.openFields ? <div className="propertiesView-fields-checkbox"> @@ -949,12 +950,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { } if (this.isPres) { const selectedItem: boolean = PresBox.Instance._selectedArray.length > 0; - return <div className="propertiesView" style={{ width: this.props.width }} > - <div className="propertiesView-title" style={{ width: this.props.width }}> + return <div className="propertiesView"> + <div className="propertiesView-title"> Presentation - <div className="propertiesView-title-icon" onPointerDown={this.props.onDown}> - <FontAwesomeIcon icon="times" color="black" size="sm" /> - </div> </div> <div className="propertiesView-name"> {this.editableTitle} diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 444583af3..47e1b2715 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -565,12 +565,23 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu } } - @undoBatch + @undoBatch @action deleteClicked = (): void => { if (Doc.UserDoc().activeWorkspace === this.props.Document) { alert("Can't delete the active workspace"); } else { + const recent = Cast(Doc.UserDoc().myRecentlyClosed, Doc) as Doc; + const selected = SelectionManager.SelectedDocuments().slice(); SelectionManager.DeselectAll(); + + selected.map(dv => { + const effectiveAcl = GetEffectiveAcl(dv.props.Document); + if (effectiveAcl === AclEdit || effectiveAcl === AclAdmin) { // deletes whatever you have the right to delete + recent && Doc.AddDocToList(recent, "data", dv.props.Document, undefined, true, true); + dv.props.removeDocument?.(dv.props.Document); + } + }); + this.props.Document.deleted = true; this.props.removeDocument?.(this.props.Document); } diff --git a/src/client/views/nodes/FontIconBox.tsx b/src/client/views/nodes/FontIconBox.tsx index c0eb78d98..95faabb48 100644 --- a/src/client/views/nodes/FontIconBox.tsx +++ b/src/client/views/nodes/FontIconBox.tsx @@ -64,14 +64,17 @@ export class FontIconBox extends DocComponent<FieldViewProps, FontIconDocument>( const backgroundColor = StrCast(this.layoutDoc._backgroundColor, StrCast(this.rootDoc.backgroundColor, this.props.backgroundColor?.(this.rootDoc))); const shape = StrCast(this.layoutDoc.iconShape, "round"); const button = <button className={`menuButton-${shape}`} ref={this._ref} onContextMenu={this.specificContextMenu} - style={{ boxShadow: this.layoutDoc.ischecked ? `4px 4px 12px black` : undefined, backgroundColor: this.layoutDoc.iconShape === "square" ? backgroundColor : "" }}> + style={{ + boxShadow: this.layoutDoc.ischecked ? `4px 4px 12px black` : undefined, + backgroundColor: this.layoutDoc.iconShape === "square" ? backgroundColor : "", + }}> <div className="menuButton-wrap"> {<FontAwesomeIcon className={`menuButton-icon-${shape}`} icon={StrCast(this.dataDoc.icon, "user") as any} color={color} size={this.layoutDoc.iconShape === "square" ? "sm" : "lg"} />} {!label ? (null) : <div className="fontIconBox-label" style={{ color, backgroundColor }}> {label} </div>} </div> </button>; - return !this.layoutDoc.toolTip ? button : + return (this.layoutDoc.developerFeature && Doc.UserDoc().noviceMode) ? (null) : !this.layoutDoc.toolTip ? button : <Tooltip title={<div className="dash-tooltip">{StrCast(this.layoutDoc.toolTip)}</div>}> {button} </Tooltip>; |