diff options
| -rw-r--r-- | src/client/documents/DocumentTypes.ts | 2 | ||||
| -rw-r--r-- | src/client/documents/Documents.ts | 3 | ||||
| -rw-r--r-- | src/client/views/PropertiesView.scss | 27 | ||||
| -rw-r--r-- | src/client/views/PropertiesView.tsx | 55 |
4 files changed, 80 insertions, 7 deletions
diff --git a/src/client/documents/DocumentTypes.ts b/src/client/documents/DocumentTypes.ts index cdc8c275c..bd71281fa 100644 --- a/src/client/documents/DocumentTypes.ts +++ b/src/client/documents/DocumentTypes.ts @@ -2,7 +2,7 @@ export enum DocumentType { NONE = 'none', // core data types - RTF = 'rtf', + RTF = 'rich text', IMG = 'image', WEB = 'web', COL = 'collection', diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 515a870b5..f877f2598 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -430,7 +430,8 @@ export namespace Docs { nativeHeightUnfrozen: true, layout_forceReflow: true, defaultDoubleClick: 'ignore', - }, + systemIcon: 'AiFillFileText' + }, }, ], [ diff --git a/src/client/views/PropertiesView.scss b/src/client/views/PropertiesView.scss index 5e6bd85e6..b3d16d82a 100644 --- a/src/client/views/PropertiesView.scss +++ b/src/client/views/PropertiesView.scss @@ -41,7 +41,7 @@ } .propertiesView-name { - border-bottom: 1px solid black; + // border-bottom: 1px solid black; padding: 8.5px; font-size: 12.5px; @@ -50,6 +50,11 @@ } } + .propertiesView-type{ + padding: 8.5px; + font-size: 12.5px; + } + .propertiesView-settings { //border-bottom: 1px solid black; //padding: 8.5px; @@ -848,6 +853,26 @@ } } +.propertiesView-wordType{ + color:silver; + font-weight:200; +} + +.currentType{ + text-decoration: underline; + display: flex; + align-items:center; + // border: solid 1px #323232; + // padding-left: 5px; + // padding-top: 4px; + // border-radius: 4px; + // height: fit-content; +} + +.currentType-icon{ + margin-right:5px; +} + .properties-flyout { grid-column: 2/4; } diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index 3c473498e..c5dd0eaf5 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -2,7 +2,7 @@ import React = require('react'); import { IconLookup } from '@fortawesome/fontawesome-svg-core'; import { faAnchor, faArrowRight, faWindowMaximize } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { Checkbox, Tooltip } from '@material-ui/core'; +import { Checkbox, Icon, Tooltip } from '@material-ui/core'; import { intersection } from 'lodash'; import { action, computed, Lambda, observable } from 'mobx'; import { observer } from 'mobx-react'; @@ -34,6 +34,13 @@ import { PropertiesDocBacklinksSelector } from './PropertiesDocBacklinksSelector import { PropertiesDocContextSelector } from './PropertiesDocContextSelector'; import './PropertiesView.scss'; import { DefaultStyleProvider } from './StyleProvider'; +import { RichTextField } from '../../fields/RichTextField'; +import { AiFillFileText } from "react-icons/ai" +import {BsCollectionFill, BsFillFileEarmarkImageFill} from "react-icons/bs" +import { CgBrowser} from "react-icons/cg" +import { ImageField, VideoField, WebField } from '../../fields/URLField'; +import { FaFileVideo } from 'react-icons/fa'; +import { IconButton } from 'browndash-components'; const higflyout = require('@hig/flyout'); export const { anchorPoints } = higflyout; export const Flyout = higflyout.default; @@ -255,10 +262,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { } @computed get links() { - console.log("this is selected doc" + this.selectedDoc) - // console.log("this is selected doc" + this.selectedDoc) const selAnchor = this.selectedDocumentView?.anchorViewDoc ?? LinkManager.currentLinkAnchor ?? this.selectedDoc; - console.log("this is selAnchor" + selAnchor) return !selAnchor ? null : <PropertiesDocBacklinksSelector Document={selAnchor} hideTitle={true} addDocTab={this.props.addDocTab} />; } @@ -462,6 +466,7 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { }; @computed get editableTitle() { + const titles = new Set<string>(); SelectionManager.Views().forEach(dv => titles.add(StrCast(dv.rootDoc.title))); const title = Array.from(titles.keys()).length > 1 ? '--multiple selected--' : StrCast(this.selectedDoc?.title); @@ -476,6 +481,45 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { ); } + @computed get currentType() { + // const layoutField = this.selectedDoc?.[Doc.LayoutFieldKey(this.selectedDoc)]; + const documentType = StrCast(this.selectedDoc?.type) + //console.log("this is tyoe " + typezzz) + var currentType: string = ""; + var currentTypeComponent = <BsFillFileEarmarkImageFill/>; + + currentType = documentType + // currentTypeComponent = //c + //}// else if (layoutField instanceof ImageField){ + // currentType = 'Image' + // currentTypeComponent = <BsFillFileEarmarkImageFill/> + // } else if(layoutField instanceof WebField){ + // currentType = 'Website' + // currentTypeComponent = <CgBrowser/> + // } else if (layoutField instanceof VideoField){ + // currentType = 'Video' + // currentTypeComponent = <FaFileVideo/> + // } + + // else{ + // currentType = 'Collection' + // currentTypeComponent = <BsCollectionFill/> + // } + + return ( + <div> + <div className = "propertiesView-wordType">Type</div> + + <div className= "currentType"> + {/* <Icon iconName = "AiFillFileText"></Icon> */} + {/* <IconButton icon={StrCast(this.selectedDoc?.systemIcon)}></IconButton> */} + {currentType} + </div> + </div> + + ) + } + @undoBatch @action setTitle = (value: string) => { @@ -1420,6 +1464,9 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { </div> <div className="propertiesView-name">{this.editableTitle}</div> + <div className = "propertiesView-type"> {this.currentType} </div> + + {this.contextsSubMenu} {this.linksSubMenu} |