From ea855ecda2c3df9e5d0881d43e2fdbceb9dccafc Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Wed, 5 Aug 2020 22:25:24 -0500 Subject: finishing touches on settings --- src/client/util/SettingsManager.scss | 30 +++++++++++++- src/client/util/SettingsManager.tsx | 78 +++++++++++++++++++++++++++--------- 2 files changed, 87 insertions(+), 21 deletions(-) (limited to 'src') diff --git a/src/client/util/SettingsManager.scss b/src/client/util/SettingsManager.scss index 41bce8a1b..2d0fb4e95 100644 --- a/src/client/util/SettingsManager.scss +++ b/src/client/util/SettingsManager.scss @@ -30,10 +30,36 @@ } .settings-username { - font-size: 14px; + font-size: 12px; padding-right: 15px; color: black; - margin-top: 10px; + margin-top: 4px; + /* right: 135; */ + position: absolute; + left: 235; +} + +.grey-submit { + width: 71.1875px; + align-self: center; + background: #75787c; + outline: none; + border-radius: 5px; + border: 0px; + color: #fcfbf7; + text-transform: uppercase; + letter-spacing: 2px; + font-size: 75%; + padding: 10px; + transition: transform 0.2s; + margin: 2px; + margin-left: 85px; + height: 32px; + + &:hover { + cursor: not-allowed; + } + } .settings-section { diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx index 68ed32c0f..155c7f60c 100644 --- a/src/client/util/SettingsManager.tsx +++ b/src/client/util/SettingsManager.tsx @@ -39,6 +39,9 @@ export default class SettingsManager extends React.Component<{}> { private new_password_ref = React.createRef(); private new_confirm_ref = React.createRef(); + @observable private curr_password: string = ""; + @observable private new_password: string = ""; + @observable private new_confirm: string = ""; @computed get backgroundColor() { return Doc.UserDoc().defaultColor; } @@ -142,25 +145,44 @@ export default class SettingsManager extends React.Component<{}> { return true; } - private get settingsInterface() { + @computed get allowSubmit() { + return this.curr_password.length > 3 && + this.new_password.length > 3 && + this.new_confirm.length > 3 && this.new_confirm === this.new_password && + this.new_password !== this.curr_password ? true : false; + } + @action + changeVal = (e: any, pass: string) => { + if (pass === "curr") { + this.curr_password = e.target.value; + } else if (pass === "new") { + this.new_password = e.target.value; + } else if (pass === "conf") { + this.new_confirm = e.target.value; + } + } - const passwordContent =
+ @computed get passwordContent() { + return
- - - + this.changeVal(e, "curr")} ref={this.curr_password_ref} /> + this.changeVal(e, "new")} ref={this.new_password_ref} /> + this.changeVal(e, "conf")} ref={this.new_confirm_ref} />
{this.errorText ?
{this.errorText}
: undefined} {this.successText ?
{this.successText}
: undefined} - + {this.allowSubmit ? :
submit
} forgot password?
; + } - const modesContent =
+ @computed get modesContent() { + return
-
+
;
; + return preferencesContent; + } + + + @computed private get settingsInterface() { + return (
Settings
-
{Doc.CurrentUserEmail}
+
+
Signed in as:
+
{Doc.CurrentUserEmail}
+
@@ -245,19 +285,19 @@ export default class SettingsManager extends React.Component<{}> {
Password
-
{passwordContent}
+
{this.passwordContent}
Modes
-
{modesContent}
+
{this.modesContent}
Accounts
-
{accountsContent}
+
{this.accountsContent}
Preferences
-
{preferencesContent}
+
{this.preferencesContent}
); -- cgit v1.2.3-70-g09d2 From e1ad098f0756f7a11d4a43bdc47499c8cb4b0842 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Thu, 6 Aug 2020 01:30:41 -0500 Subject: scrolling bugs for properties --- .../collectionFreeForm/PropertiesView.scss | 60 +++++++++++----------- .../collectionFreeForm/PropertiesView.tsx | 28 +++++----- 2 files changed, 43 insertions(+), 45 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.scss b/src/client/views/collections/collectionFreeForm/PropertiesView.scss index 5b41db90e..ce0eee744 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 { @@ -141,9 +142,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 { @@ -178,9 +179,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 { @@ -266,9 +267,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; @@ -307,25 +307,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 { @@ -388,9 +381,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 { @@ -674,4 +667,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 89f48fc65..3b449d941 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -598,16 +598,18 @@ export class PropertiesView extends React.Component { set colorStk(value) { value && (this._lastLine = value); this.selectedDoc && (this.selectedDoc.color = value ? value : undefined); } colorButton(value: string, type: string, setter: () => {}) { - return -
setter()))}> -
- {value === "" || value === "transparent" ?

☒

: ""} -
- ; + return
+ +
setter()))}> +
+ {value === "" || value === "transparent" ?

☒

: ""} +
+ +
; } @@ -844,11 +846,9 @@ export class PropertiesView extends React.Component {
runInAction(() => { this.openFields = !this.openFields; })} style={{ backgroundColor: this.openFields ? "black" : "" }}> -
- Fields {"&"} Tags + Fields {"&"} Tags
- -
+
{!novice && this.openFields ?
-- cgit v1.2.3-70-g09d2 From ecadf91fa662a45b7e0c2302f9423a2032589909 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Thu, 6 Aug 2020 11:21:33 -0500 Subject: ink fix --- src/client/util/SettingsManager.tsx | 2 +- .../collectionFreeForm/PropertiesView.tsx | 37 ++++++++++++++-------- 2 files changed, 24 insertions(+), 15 deletions(-) (limited to 'src') diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx index 155c7f60c..8124b7676 100644 --- a/src/client/util/SettingsManager.tsx +++ b/src/client/util/SettingsManager.tsx @@ -257,7 +257,7 @@ export default class SettingsManager extends React.Component<{}> { ; })} -
; +
; return preferencesContent; diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 3b449d941..8aeb80ace 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -83,6 +83,8 @@ export class PropertiesView extends React.Component { @computed get isInk() { return this.selectedDoc?.type === DocumentType.INK; } + @observable scrolling: boolean = true; + @action rtfWidth = () => { if (this.selectedDoc) { @@ -598,21 +600,28 @@ export class PropertiesView extends React.Component { set colorStk(value) { value && (this._lastLine = value); this.selectedDoc && (this.selectedDoc.color = value ? value : undefined); } colorButton(value: string, type: string, setter: () => {}) { - return
- -
setter()))}> -
- {value === "" || value === "transparent" ?

☒

: ""} -
- + // return
this.changeScrolling(false)} + // onPointerLeave={e => this.changeScrolling(true)}> + // + return
setter()))}> +
+ {value === "" || value === "transparent" ?

☒

: ""}
; + // + //
; } + @action + changeScrolling = (scroll: boolean) => { + console.log(scroll); + this.scrolling = scroll; + } + @undoBatch @action switchStk = (color: ColorState) => { @@ -654,8 +663,8 @@ export class PropertiesView extends React.Component {
{this.lineButton}
- {/* {this._fillBtn ? this.fillPicker : ""} - {this._lineBtn ? this.linePicker : ""} */} + {this._fillBtn ? this.fillPicker : ""} + {this._lineBtn ? this.linePicker : ""}
; } @@ -771,7 +780,7 @@ export class PropertiesView extends React.Component { if (this.selectedDoc && !this.isPres) { return
Properties -- cgit v1.2.3-70-g09d2 From 4b48414585910fc83e1599913f8a23672f895995 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Thu, 6 Aug 2020 11:29:42 -0500 Subject: last ink fix --- .../views/collections/collectionFreeForm/PropertiesView.tsx | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 8aeb80ace..6dcfdf161 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -83,8 +83,6 @@ export class PropertiesView extends React.Component { @computed get isInk() { return this.selectedDoc?.type === DocumentType.INK; } - @observable scrolling: boolean = true; - @action rtfWidth = () => { if (this.selectedDoc) { @@ -616,12 +614,6 @@ export class PropertiesView extends React.Component { } - @action - changeScrolling = (scroll: boolean) => { - console.log(scroll); - this.scrolling = scroll; - } - @undoBatch @action switchStk = (color: ColorState) => { @@ -780,7 +772,7 @@ export class PropertiesView extends React.Component { if (this.selectedDoc && !this.isPres) { return
Properties -- cgit v1.2.3-70-g09d2 From 59a03f711c48aa51a53759dcece88cd6d6204010 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Thu, 6 Aug 2020 16:29:46 -0500 Subject: trying novice tools --- src/client/documents/Documents.ts | 1 + src/client/util/CurrentUserUtils.ts | 144 ++++++++++++++++++++++++--------- src/client/util/SettingsManager.tsx | 9 ++- src/client/views/nodes/FontIconBox.tsx | 8 +- 4 files changed, 117 insertions(+), 45 deletions(-) (limited to 'src') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 7719b3eef..3b5f10050 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -201,6 +201,7 @@ export interface DocumentOptions { linearViewIsExpanded?: boolean; // is linear view expanded border?: string; //for searchbox hovercolor?: string; + developerFeature?: boolean; } class EmptyBox { diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 1f140e145..822979e32 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -387,7 +387,8 @@ export class CurrentUserUtils { static creatorBtnDescriptors(doc: Doc): { title: string, toolTip: string, icon: string, drag?: string, ignoreClick?: boolean, - click?: string, ischecked?: string, activeInkPen?: Doc, backgroundColor?: string, dragFactory?: Doc + click?: string, ischecked?: string, activeInkPen?: Doc, backgroundColor?: string, dragFactory?: Doc, hidden?: any, + developerFeature?: boolean }[] { if (doc.emptyPresentation === undefined) { doc.emptyPresentation = Docs.Create.PresDocument(new List(), @@ -426,30 +427,90 @@ export class CurrentUserUtils { if (doc.activeMobileMenu === undefined) { this.setupActiveMobileMenu(doc); } - return [ - { toolTip: "Drag a collection", title: "Col", icon: "folder", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyCollection as Doc }, - { toolTip: "Drag a web page", title: "Web", icon: "globe-asia", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyWebpage as Doc }, - { toolTip: "Drag a cat image", title: "Image", icon: "cat", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyImage as Doc }, - { toolTip: "Drag a comparison box", title: "Compare", icon: "columns", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyComparison as Doc }, - { toolTip: "Drag a screengrabber", title: "Grab", icon: "photo-video", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScreenshot as Doc }, - // { title: "Drag a webcam", title: "Cam", icon: "video", ignoreClick: true, drag: 'Docs.Create.WebCamDocument("", { _width: 400, _height: 400, title: "a test cam" })' }, - { toolTip: "Drag a audio recorder", title: "Audio", icon: "microphone", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyAudio as Doc }, - { toolTip: "Drag a button", title: "Button", icon: "bolt", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyButton as Doc }, - - { toolTip: "Drag a presentation view", title: "Prezi", icon: "tv", click: 'openOnRight(Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true))', drag: `Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true)`, dragFactory: doc.emptyPresentation as Doc }, - { toolTip: "Drag a search box", title: "Query", icon: "search", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptySearch as Doc }, - { toolTip: "Drag a scripting box", title: "Script", icon: "terminal", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScript as Doc }, - // { title: "Drag an import folder", title: "Load", icon: "cloud-upload-alt", ignoreClick: true, drag: 'Docs.Create.DirectoryImportDocument({ title: "Directory Import", _width: 400, _height: 400 })' }, - { toolTip: "Drag a mobile view", title: "Phone", icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc }, - // { title: "Drag an instance of the device collection", title: "Buxton", icon: "globe-asia", ignoreClick: true, drag: 'Docs.Create.Buxton()' }, - // { title: "use pen", icon: "pen-nib", click: 'activatePen(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "blue", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, - // { title: "use highlighter", icon: "highlighter", click: 'activateBrush(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this,20,this.backgroundColor)', backgroundColor: "yellow", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, - // { title: "use stamp", icon: "stamp", click: 'activateStamp(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "orange", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, - // { title: "use eraser", icon: "eraser", click: 'activateEraser(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this);', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "pink", activeInkPen: doc }, - // { title: "use drag", icon: "mouse-pointer", click: 'deactivateInk();this.activeInkPen = this;', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "white", activeInkPen: doc }, - { toolTip: "Drag a document previewer", title: "Prev", icon: "expand", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyDocHolder as Doc }, - { toolTip: "Toggle a Calculator REPL", title: "repl", icon: "calculator", click: 'addOverlayWindow("ScriptingRepl", { x: 300, y: 100, width: 200, height: 200, title: "Scripting REPL" })' }, - ]; + + // { title: "Drag an instance of the device collection", title: "Buxton", icon: "globe-asia", ignoreClick: true, drag: 'Docs.Create.Buxton()' }, + // { title: "use pen", icon: "pen-nib", click: 'activatePen(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "blue", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, + // { title: "use highlighter", icon: "highlighter", click: 'activateBrush(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this,20,this.backgroundColor)', backgroundColor: "yellow", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, + // { title: "use stamp", icon: "stamp", click: 'activateStamp(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "orange", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, + // { title: "use eraser", icon: "eraser", click: 'activateEraser(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this);', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "pink", activeInkPen: doc }, + // { title: "use drag", icon: "mouse-pointer", click: 'deactivateInk();this.activeInkPen = this;', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "white", activeInkPen: doc }, + // { title: "Drag an import folder", title: "Load", icon: "cloud-upload-alt", ignoreClick: true, drag: 'Docs.Create.DirectoryImportDocument({ title: "Directory Import", _width: 400, _height: 400 })' }, + // { title: "Drag a webcam", title: "Cam", icon: "video", ignoreClick: true, drag: 'Docs.Create.WebCamDocument("", { _width: 400, _height: 400, title: "a test cam" })' }, + + const collection = { + toolTip: "Drag a collection", title: "Col", + icon: "folder", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyCollection as Doc + }; + const web = { + toolTip: "Drag a web page", title: "Web", + icon: "globe-asia", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyWebpage as Doc + }; + const cat = { + toolTip: "Drag a cat image", title: "Image", + icon: "cat", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyImage as Doc + }; + const compare = { + toolTip: "Drag a comparison box", title: "Compare", + icon: "columns", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyComparison as Doc + } + const screen = { + toolTip: "Drag a screengrabber", title: "Grab", + icon: "photo-video", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScreenshot as Doc, + developerFeature: true, + }; + const audio = { + toolTip: "Drag a audio recorder", title: "Audio", + icon: "microphone", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyAudio as Doc + }; + const button = { + toolTip: "Drag a button", title: "Button", + icon: "bolt", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyButton as Doc + }; + const pres = { + toolTip: "Drag a presentation view", title: "Pres", icon: "tv", + click: 'openOnRight(Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true))', + drag: `Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true)`, + dragFactory: doc.emptyPresentation as Doc + }; + const search = { + toolTip: "Drag a search box", title: "Query", icon: "search", + click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', + dragFactory: doc.emptySearch as Doc, developerFeature: true, + }; + const script = { + toolTip: "Drag a scripting box", title: "Script", + icon: "terminal", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScript as Doc, + developerFeature: true, + }; + const mobile = { + toolTip: "Drag a mobile view", title: "Phone", + icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', + drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc, + developerFeature: true, + }; + const preview = { + toolTip: "Drag a document previewer", title: "Prev", + icon: "expand", click: 'openOnRight(getCopy(this.dragFactory, true))', + drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyDocHolder as Doc, + developerFeature: true, + }; + const repl = { + toolTip: "Toggle a Calculator REPL", title: "repl", + icon: "calculator", + click: 'addOverlayWindow("ScriptingRepl", { x: 300, y: 100, width: 200, height: 200, title: "Scripting REPL" })', + developerFeature: true, + }; + + // novice : [collection, web, compare, audio, button, pres] + return [collection, web, compare, screen, audio, button, pres, search, script, preview, repl]; } @@ -465,21 +526,24 @@ export class CurrentUserUtils { } } const buttons = CurrentUserUtils.creatorBtnDescriptors(doc).filter(d => !alreadyCreatedButtons?.includes(d.title)); - const creatorBtns = buttons.map(({ title, toolTip, icon, ignoreClick, drag, click, ischecked, activeInkPen, backgroundColor, dragFactory }) => Docs.Create.FontIconDocument({ - _nativeWidth: 50, _nativeHeight: 50, _width: 50, _height: 50, - icon, - title, - toolTip, - ignoreClick, - dropAction: "copy", - onDragStart: drag ? ScriptField.MakeFunction(drag) : undefined, - onClick: click ? ScriptField.MakeScript(click) : undefined, - ischecked: ischecked ? ComputedField.MakeFunction(ischecked) : undefined, - activeInkPen, - backgroundColor, - removeDropProperties: new List(["dropAction"]), - dragFactory, - })); + const creatorBtns = buttons.map(({ title, toolTip, icon, ignoreClick, drag, + click, ischecked, activeInkPen, backgroundColor, dragFactory, + developerFeature }) => Docs.Create.FontIconDocument({ + _nativeWidth: 50, _nativeHeight: 50, _width: 50, _height: 50, + icon, + title, + toolTip, + ignoreClick, + dropAction: "copy", + onDragStart: drag ? ScriptField.MakeFunction(drag) : undefined, + onClick: click ? ScriptField.MakeScript(click) : undefined, + ischecked: ischecked ? ComputedField.MakeFunction(ischecked) : undefined, + activeInkPen, + backgroundColor, + removeDropProperties: new List(["dropAction"]), + dragFactory, + developerFeature, + })); if (dragCreatorSet === undefined) { doc.myItemCreators = new PrefetchProxy(Docs.Create.MasonryDocument(creatorBtns, { diff --git a/src/client/util/SettingsManager.tsx b/src/client/util/SettingsManager.tsx index 8124b7676..1a419b7c6 100644 --- a/src/client/util/SettingsManager.tsx +++ b/src/client/util/SettingsManager.tsx @@ -203,9 +203,12 @@ export default class SettingsManager extends React.Component<{}> { @computed get accountsContent() { return
- - - + + {/* */} +
; } diff --git a/src/client/views/nodes/FontIconBox.tsx b/src/client/views/nodes/FontIconBox.tsx index c0eb78d98..71832b0dc 100644 --- a/src/client/views/nodes/FontIconBox.tsx +++ b/src/client/views/nodes/FontIconBox.tsx @@ -64,14 +64,18 @@ export class FontIconBox extends DocComponent( const backgroundColor = StrCast(this.layoutDoc._backgroundColor, StrCast(this.rootDoc.backgroundColor, this.props.backgroundColor?.(this.rootDoc))); const shape = StrCast(this.layoutDoc.iconShape, "round"); const button = ; - return !this.layoutDoc.toolTip ? button : + return !this.layoutDoc.toolTip || (this.layoutDoc.developerFeature && Doc.UserDoc().noviceMode) ? button : {StrCast(this.layoutDoc.toolTip)}
}> {button} ; -- cgit v1.2.3-70-g09d2 From 915bb3796541116897dfc016a0ed3253c2f856cc Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Thu, 6 Aug 2020 19:22:37 -0500 Subject: temporary fix for novice tools --- src/client/views/PropertiesButtons.tsx | 11 +++++++++++ src/client/views/nodes/DocumentView.tsx | 11 +++++++++++ src/client/views/nodes/FontIconBox.tsx | 5 +++-- 3 files changed, 25 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 29afd447f..837919a60 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -427,6 +427,17 @@ export class PropertiesButtons extends React.Component<{}, {}> { @action deleteDocument = () => { this.selectedDocumentView?.props.ContainingCollectionView?.removeDocument(this.selectedDocumentView?.props.Document); + 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); + } + }); } @computed diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index b9e685b44..711ca8935 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -571,6 +571,17 @@ export class DocumentView extends DocComponent(Docu } else { SelectionManager.DeselectAll(); this.props.removeDocument?.(this.props.Document); + 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); + } + }); } } diff --git a/src/client/views/nodes/FontIconBox.tsx b/src/client/views/nodes/FontIconBox.tsx index 71832b0dc..c465bb3bd 100644 --- a/src/client/views/nodes/FontIconBox.tsx +++ b/src/client/views/nodes/FontIconBox.tsx @@ -59,6 +59,8 @@ export class FontIconBox extends DocComponent( } render() { + + console.log(Doc.UserDoc()); const label = StrCast(this.rootDoc.label, StrCast(this.rootDoc.title)); const color = StrCast(this.layoutDoc.color, this._foregroundColor); const backgroundColor = StrCast(this.layoutDoc._backgroundColor, StrCast(this.rootDoc.backgroundColor, this.props.backgroundColor?.(this.rootDoc))); @@ -67,7 +69,6 @@ export class FontIconBox extends DocComponent( style={{ boxShadow: this.layoutDoc.ischecked ? `4px 4px 12px black` : undefined, backgroundColor: this.layoutDoc.iconShape === "square" ? backgroundColor : "", - display: (this.layoutDoc.developerFeature && Doc.UserDoc().noviceMode) ? "none" : "" }}>
{( {!label ? (null) :
{label}
}
; - return !this.layoutDoc.toolTip || (this.layoutDoc.developerFeature && Doc.UserDoc().noviceMode) ? button : + return (this.layoutDoc.developerFeature && Doc.UserDoc().noviceMode) ? (null) : !this.layoutDoc.toolTip ? button : {StrCast(this.layoutDoc.toolTip)}
}> {button} ; -- cgit v1.2.3-70-g09d2 From 1e84a64ffb1f1933eb7e506fa133835fdb1a0972 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Thu, 6 Aug 2020 23:39:53 -0500 Subject: finished all properties UI changes --- src/client/views/collections/CollectionView.tsx | 2 +- .../views/collections/collectionFreeForm/PropertiesView.scss | 6 +++--- src/client/views/collections/collectionFreeForm/PropertiesView.tsx | 7 ++----- 3 files changed, 6 insertions(+), 9 deletions(-) (limited to 'src') 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 + style={{ right: this.facetWidth() - 1, top: this.props.Document._viewType === CollectionViewType.Docking ? "25%" : "60%" }} /> } {Doc.UserDoc()?.noviceMode || this.facetWidth() < 10 ? (null) : this.filterView}
); diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.scss b/src/client/views/collections/collectionFreeForm/PropertiesView.scss index c952dc358..aee28366a 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.scss +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.scss @@ -437,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 { diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 4610c0143..2d76e109c 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -950,12 +950,9 @@ export class PropertiesView extends React.Component { } if (this.isPres) { const selectedItem: boolean = PresBox.Instance._selectedArray.length > 0; - return
-
+ return
+
Presentation -
- -
{this.editableTitle} -- cgit v1.2.3-70-g09d2 From 42a8ba8f3021d4ccc56cfdf4fea1c0bad9d8e818 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Fri, 7 Aug 2020 00:31:14 -0500 Subject: delete changes --- src/client/views/PropertiesButtons.tsx | 8 +++++--- src/client/views/nodes/DocumentView.tsx | 8 ++++---- src/client/views/nodes/FontIconBox.tsx | 2 -- 3 files changed, 9 insertions(+), 9 deletions(-) (limited to 'src') diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 776b50838..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,10 +429,8 @@ export class PropertiesButtons extends React.Component<{}, {}> { @undoBatch @action deleteDocument = () => { - this.selectedDocumentView?.props.ContainingCollectionView?.removeDocument(this.selectedDocumentView?.props.Document); 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); @@ -440,6 +439,9 @@ export class PropertiesButtons extends React.Component<{}, {}> { 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/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 707b7d2a1..3592dc393 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -565,14 +565,11 @@ export class DocumentView extends DocComponent(Docu } } - @undoBatch + @undoBatch @action deleteClicked = (): void => { if (Doc.UserDoc().activeWorkspace === this.props.Document) { alert("Can't delete the active workspace"); } else { - SelectionManager.DeselectAll(); - this.props.Document.deleted = true; - this.props.removeDocument?.(this.props.Document); const recent = Cast(Doc.UserDoc().myRecentlyClosed, Doc) as Doc; const selected = SelectionManager.SelectedDocuments().slice(); SelectionManager.DeselectAll(); @@ -584,6 +581,9 @@ export class DocumentView extends DocComponent(Docu 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 c465bb3bd..95faabb48 100644 --- a/src/client/views/nodes/FontIconBox.tsx +++ b/src/client/views/nodes/FontIconBox.tsx @@ -59,8 +59,6 @@ export class FontIconBox extends DocComponent( } render() { - - console.log(Doc.UserDoc()); const label = StrCast(this.rootDoc.label, StrCast(this.rootDoc.title)); const color = StrCast(this.layoutDoc.color, this._foregroundColor); const backgroundColor = StrCast(this.layoutDoc._backgroundColor, StrCast(this.rootDoc.backgroundColor, this.props.backgroundColor?.(this.rootDoc))); -- cgit v1.2.3-70-g09d2 From 625882842ca6af7563983c52a22543469a0fa319 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Fri, 7 Aug 2020 00:58:58 -0500 Subject: smaller buttons and bug fix --- src/client/views/PropertiesButtons.scss | 18 +++++++++--------- src/client/views/PropertiesButtons.tsx | 2 +- .../collections/collectionFreeForm/PropertiesView.tsx | 2 +- src/client/views/nodes/FontIconBox.scss | 2 +- src/client/views/nodes/PresBox.tsx | 3 ++- 5 files changed, 14 insertions(+), 13 deletions(-) (limited to 'src') diff --git a/src/client/views/PropertiesButtons.scss b/src/client/views/PropertiesButtons.scss index 6199d34d0..8d9d56c9e 100644 --- a/src/client/views/PropertiesButtons.scss +++ b/src/client/views/PropertiesButtons.scss @@ -20,8 +20,8 @@ $linkGap : 3px; .propertiesButtons-linkButton-empty, .propertiesButtons-linkButton-nonempty { - height: 30px; - width: 32px; + height: 25px; + width: 29px; border-radius: 6px; pointer-events: auto; background-color: #121721; @@ -35,7 +35,7 @@ $linkGap : 3px; justify-content: center; align-items: center; margin-right: 10px; - margin-left: 3.5px; + margin-left: 4px; &:hover { background: $main-accent; @@ -68,7 +68,7 @@ $linkGap : 3px; padding-right: 5px; width: 25px; border-radius: 5px; - margin-right: 22px; + margin-right: 20px; margin-bottom: 8px; } @@ -76,9 +76,9 @@ $linkGap : 3px; background: #121721; color: white; font-size: 6px; - width: 40px; + width: 37px; padding: 3px; - height: 13px; + height: 12px; border-radius: 7px; text-transform: uppercase; text-align: center; @@ -86,8 +86,8 @@ $linkGap : 3px; } .propertiesButtons-linker { - height: 30px; - width: 32px; + height: 25px; + width: 29px; text-align: center; border-radius: 6px; pointer-events: auto; @@ -96,7 +96,7 @@ $linkGap : 3px; transition: 0.2s ease all; margin-right: 5px; padding-top: 5px; - margin-left: 3.5px; + margin-left: 4px; &:hover { background: $main-accent; diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index a905dc1e7..4255e5caa 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -259,7 +259,7 @@ export class PropertiesButtons extends React.Component<{}, {}> { } }}> -
V
+
V
{"View"}
diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx index 2d76e109c..5e9159dc2 100644 --- a/src/client/views/collections/collectionFreeForm/PropertiesView.tsx +++ b/src/client/views/collections/collectionFreeForm/PropertiesView.tsx @@ -52,7 +52,7 @@ export class PropertiesView extends React.Component { @computed get selectedDocumentView() { if (SelectionManager.SelectedDocuments().length) { return SelectionManager.SelectedDocuments()[0]; - } else if (PresBox.Instance._selectedArray.length) { + } else if (PresBox.Instance && PresBox.Instance._selectedArray.length) { return DocumentManager.Instance.getDocumentView(PresBox.Instance.rootDoc); } else { return undefined; } } diff --git a/src/client/views/nodes/FontIconBox.scss b/src/client/views/nodes/FontIconBox.scss index 9709e1dbd..6a540269e 100644 --- a/src/client/views/nodes/FontIconBox.scss +++ b/src/client/views/nodes/FontIconBox.scss @@ -60,7 +60,7 @@ .menuButton-icon-square { width: auto; - height: 32px; + height: 29px; padding: 4px; } diff --git a/src/client/views/nodes/PresBox.tsx b/src/client/views/nodes/PresBox.tsx index 502fd51f3..b7af4683e 100644 --- a/src/client/views/nodes/PresBox.tsx +++ b/src/client/views/nodes/PresBox.tsx @@ -34,7 +34,8 @@ const PresBoxDocument = makeInterface(documentSchema); @observer export class PresBox extends ViewBoxBaseComponent(PresBoxDocument) { public static LayoutString(fieldKey: string) { return FieldView.LayoutString(PresBox, fieldKey); } - static Instance: PresBox; + + public static Instance: PresBox; @observable _isChildActive = false; @observable _moveOnFromAudio: boolean = true; -- cgit v1.2.3-70-g09d2 From ea3a2d51e130b1ea5954d9bb13658d25d8eac975 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Fri, 7 Aug 2020 01:23:00 -0500 Subject: trying novice buttons --- src/client/documents/Documents.ts | 1 - src/client/util/CurrentUserUtils.ts | 71 +++++++++++++++++++++++++++------- src/client/views/nodes/FontIconBox.tsx | 2 +- 3 files changed, 57 insertions(+), 17 deletions(-) (limited to 'src') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 50b7368d3..a06b4a581 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -205,7 +205,6 @@ export interface DocumentOptions { audioEnd?: number; // the time frame where the audio should stop playing border?: string; //for searchbox hovercolor?: string; - developerFeature?: boolean; } class EmptyBox { diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index c5d3fffc7..b1c98e549 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -385,10 +385,9 @@ export class CurrentUserUtils { return doc["template-icons"] as Doc; } - static creatorBtnDescriptors(doc: Doc): { + static creatorBtnDescriptors(doc: Doc, novice: boolean): { title: string, toolTip: string, icon: string, drag?: string, ignoreClick?: boolean, click?: string, ischecked?: string, activeInkPen?: Doc, backgroundColor?: string, dragFactory?: Doc, hidden?: any, - developerFeature?: boolean }[] { if (doc.emptyPresentation === undefined) { doc.emptyPresentation = Docs.Create.PresDocument(new List(), @@ -461,7 +460,6 @@ export class CurrentUserUtils { toolTip: "Drag a screengrabber", title: "Grab", icon: "photo-video", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScreenshot as Doc, - developerFeature: true, }; const audio = { toolTip: "Drag a audio recorder", title: "Audio", @@ -482,35 +480,35 @@ export class CurrentUserUtils { const search = { toolTip: "Drag a search box", title: "Query", icon: "search", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', - dragFactory: doc.emptySearch as Doc, developerFeature: true, + dragFactory: doc.emptySearch as Doc, }; const script = { toolTip: "Drag a scripting box", title: "Script", icon: "terminal", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScript as Doc, - developerFeature: true, }; const mobile = { toolTip: "Drag a mobile view", title: "Phone", icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc, - developerFeature: true, }; const preview = { toolTip: "Drag a document previewer", title: "Prev", icon: "expand", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyDocHolder as Doc, - developerFeature: true, }; const repl = { toolTip: "Toggle a Calculator REPL", title: "repl", icon: "calculator", click: 'addOverlayWindow("ScriptingRepl", { x: 300, y: 100, width: 200, height: 200, title: "Scripting REPL" })', - developerFeature: true, }; // novice : [collection, web, compare, audio, button, pres] - return [collection, web, compare, screen, audio, button, pres, search, script, preview, repl]; + if (novice) { + return [collection, web, compare, audio, button, pres]; + } else { + return [collection, web, compare, screen, audio, button, pres, search, script, preview, repl]; + } } @@ -525,10 +523,9 @@ export class CurrentUserUtils { alreadyCreatedButtons = dragDocs.map(d => StrCast(d.title)); } } - const buttons = CurrentUserUtils.creatorBtnDescriptors(doc).filter(d => !alreadyCreatedButtons?.includes(d.title)); + const buttons = CurrentUserUtils.creatorBtnDescriptors(doc, true).filter(d => !alreadyCreatedButtons?.includes(d.title)); const creatorBtns = buttons.map(({ title, toolTip, icon, ignoreClick, drag, - click, ischecked, activeInkPen, backgroundColor, dragFactory, - developerFeature }) => Docs.Create.FontIconDocument({ + click, ischecked, activeInkPen, backgroundColor, dragFactory }) => Docs.Create.FontIconDocument({ _nativeWidth: 50, _nativeHeight: 50, _width: 50, _height: 50, icon, title, @@ -542,12 +539,55 @@ export class CurrentUserUtils { backgroundColor, removeDropProperties: new List(["dropAction"]), dragFactory, - developerFeature, })); if (dragCreatorSet === undefined) { doc.myItemCreators = new PrefetchProxy(Docs.Create.MasonryDocument(creatorBtns, { - title: "Basic Item Creators", _showTitle: "title", _xMargin: 0, + title: "Basic Item Creators", + hidden: ComputedField.MakeFunction("!self.target.noviceMode") as any, + _showTitle: "title", _xMargin: 0, + _autoHeight: true, _width: 500, _columnWidth: 35, ignoreClick: true, lockedPosition: true, _chromeStatus: "disabled", + dropConverter: ScriptField.MakeScript("convertToButtons(dragData)", { dragData: DragManager.DocumentDragData.name }), + })); + } else { + creatorBtns.forEach(nb => Doc.AddDocToList(doc.myItemCreators as Doc, "data", nb)); + } + return doc.myItemCreators as Doc; + } + + static async setupDevCreatorButtons(doc: Doc) { + let alreadyCreatedButtons: string[] = []; + const dragCreatorSet = await Cast(doc.myItemCreators, Doc, null); + if (dragCreatorSet) { + const dragCreators = await Cast(dragCreatorSet.data, listSpec(Doc)); + if (dragCreators) { + const dragDocs = await Promise.all(dragCreators); + alreadyCreatedButtons = dragDocs.map(d => StrCast(d.title)); + } + } + const buttons = CurrentUserUtils.creatorBtnDescriptors(doc, false).filter(d => !alreadyCreatedButtons?.includes(d.title)); + const creatorBtns = buttons.map(({ title, toolTip, icon, ignoreClick, drag, + click, ischecked, activeInkPen, backgroundColor, dragFactory }) => Docs.Create.FontIconDocument({ + _nativeWidth: 50, _nativeHeight: 50, _width: 50, _height: 50, + icon, + title, + toolTip, + ignoreClick, + dropAction: "copy", + onDragStart: drag ? ScriptField.MakeFunction(drag) : undefined, + onClick: click ? ScriptField.MakeScript(click) : undefined, + ischecked: ischecked ? ComputedField.MakeFunction(ischecked) : undefined, + activeInkPen, + backgroundColor, + removeDropProperties: new List(["dropAction"]), + dragFactory, + })); + + if (dragCreatorSet === undefined) { + doc.myItemCreators = new PrefetchProxy(Docs.Create.MasonryDocument(creatorBtns, { + title: "Basic Item Creators", + hidden: ComputedField.MakeFunction("self.target.noviceMode") as any, + _showTitle: "title", _xMargin: 0, _autoHeight: true, _width: 500, _columnWidth: 35, ignoreClick: true, lockedPosition: true, _chromeStatus: "disabled", dropConverter: ScriptField.MakeScript("convertToButtons(dragData)", { dragData: DragManager.DocumentDragData.name }), })); @@ -724,12 +764,13 @@ export class CurrentUserUtils { static async setupToolsBtnPanel(doc: Doc) { // setup a masonry view of all he creators const creatorBtns = await CurrentUserUtils.setupCreatorButtons(doc); + const devBtns = await CurrentUserUtils.setupDevCreatorButtons(doc); const templateBtns = CurrentUserUtils.setupUserTemplateButtons(doc); doc["tabs-button-tools"] = undefined; if (doc.myCreators === undefined) { - doc.myCreators = new PrefetchProxy(Docs.Create.StackingDocument([creatorBtns, templateBtns], { + doc.myCreators = new PrefetchProxy(Docs.Create.StackingDocument([creatorBtns, devBtns, templateBtns], { title: "all Creators", _yMargin: 0, _autoHeight: true, _xMargin: 0, _width: 500, ignoreClick: true, lockedPosition: true, _chromeStatus: "disabled", })); diff --git a/src/client/views/nodes/FontIconBox.tsx b/src/client/views/nodes/FontIconBox.tsx index 95faabb48..a6b1678b5 100644 --- a/src/client/views/nodes/FontIconBox.tsx +++ b/src/client/views/nodes/FontIconBox.tsx @@ -74,7 +74,7 @@ export class FontIconBox extends DocComponent( {!label ? (null) :
{label}
}
; - return (this.layoutDoc.developerFeature && Doc.UserDoc().noviceMode) ? (null) : !this.layoutDoc.toolTip ? button : + return !this.layoutDoc.toolTip ? button : {StrCast(this.layoutDoc.toolTip)}
}> {button} ; -- cgit v1.2.3-70-g09d2 From 5c3e84b8dc22ee630e4612f594635b56b5a7ee9a Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Fri, 7 Aug 2020 10:52:01 -0500 Subject: reverting back --- src/client/util/CurrentUserUtils.ts | 55 +++---------------------------------- 1 file changed, 4 insertions(+), 51 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index b1c98e549..fdca2b0da 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -385,7 +385,7 @@ export class CurrentUserUtils { return doc["template-icons"] as Doc; } - static creatorBtnDescriptors(doc: Doc, novice: boolean): { + static creatorBtnDescriptors(doc: Doc): { title: string, toolTip: string, icon: string, drag?: string, ignoreClick?: boolean, click?: string, ischecked?: string, activeInkPen?: Doc, backgroundColor?: string, dragFactory?: Doc, hidden?: any, }[] { @@ -504,11 +504,7 @@ export class CurrentUserUtils { }; // novice : [collection, web, compare, audio, button, pres] - if (novice) { - return [collection, web, compare, audio, button, pres]; - } else { - return [collection, web, compare, screen, audio, button, pres, search, script, preview, repl]; - } + return [collection, web, compare, screen, audio, button, pres, search, script, preview, repl]; } @@ -523,7 +519,7 @@ export class CurrentUserUtils { alreadyCreatedButtons = dragDocs.map(d => StrCast(d.title)); } } - const buttons = CurrentUserUtils.creatorBtnDescriptors(doc, true).filter(d => !alreadyCreatedButtons?.includes(d.title)); + const buttons = CurrentUserUtils.creatorBtnDescriptors(doc).filter(d => !alreadyCreatedButtons?.includes(d.title)); const creatorBtns = buttons.map(({ title, toolTip, icon, ignoreClick, drag, click, ischecked, activeInkPen, backgroundColor, dragFactory }) => Docs.Create.FontIconDocument({ _nativeWidth: 50, _nativeHeight: 50, _width: 50, _height: 50, @@ -555,48 +551,6 @@ export class CurrentUserUtils { return doc.myItemCreators as Doc; } - static async setupDevCreatorButtons(doc: Doc) { - let alreadyCreatedButtons: string[] = []; - const dragCreatorSet = await Cast(doc.myItemCreators, Doc, null); - if (dragCreatorSet) { - const dragCreators = await Cast(dragCreatorSet.data, listSpec(Doc)); - if (dragCreators) { - const dragDocs = await Promise.all(dragCreators); - alreadyCreatedButtons = dragDocs.map(d => StrCast(d.title)); - } - } - const buttons = CurrentUserUtils.creatorBtnDescriptors(doc, false).filter(d => !alreadyCreatedButtons?.includes(d.title)); - const creatorBtns = buttons.map(({ title, toolTip, icon, ignoreClick, drag, - click, ischecked, activeInkPen, backgroundColor, dragFactory }) => Docs.Create.FontIconDocument({ - _nativeWidth: 50, _nativeHeight: 50, _width: 50, _height: 50, - icon, - title, - toolTip, - ignoreClick, - dropAction: "copy", - onDragStart: drag ? ScriptField.MakeFunction(drag) : undefined, - onClick: click ? ScriptField.MakeScript(click) : undefined, - ischecked: ischecked ? ComputedField.MakeFunction(ischecked) : undefined, - activeInkPen, - backgroundColor, - removeDropProperties: new List(["dropAction"]), - dragFactory, - })); - - if (dragCreatorSet === undefined) { - doc.myItemCreators = new PrefetchProxy(Docs.Create.MasonryDocument(creatorBtns, { - title: "Basic Item Creators", - hidden: ComputedField.MakeFunction("self.target.noviceMode") as any, - _showTitle: "title", _xMargin: 0, - _autoHeight: true, _width: 500, _columnWidth: 35, ignoreClick: true, lockedPosition: true, _chromeStatus: "disabled", - dropConverter: ScriptField.MakeScript("convertToButtons(dragData)", { dragData: DragManager.DocumentDragData.name }), - })); - } else { - creatorBtns.forEach(nb => Doc.AddDocToList(doc.myItemCreators as Doc, "data", nb)); - } - return doc.myItemCreators as Doc; - } - static menuBtnDescriptions(): { title: string, icon: string, click: string, }[] { @@ -764,13 +718,12 @@ export class CurrentUserUtils { static async setupToolsBtnPanel(doc: Doc) { // setup a masonry view of all he creators const creatorBtns = await CurrentUserUtils.setupCreatorButtons(doc); - const devBtns = await CurrentUserUtils.setupDevCreatorButtons(doc); const templateBtns = CurrentUserUtils.setupUserTemplateButtons(doc); doc["tabs-button-tools"] = undefined; if (doc.myCreators === undefined) { - doc.myCreators = new PrefetchProxy(Docs.Create.StackingDocument([creatorBtns, devBtns, templateBtns], { + doc.myCreators = new PrefetchProxy(Docs.Create.StackingDocument([creatorBtns, templateBtns], { title: "all Creators", _yMargin: 0, _autoHeight: true, _xMargin: 0, _width: 500, ignoreClick: true, lockedPosition: true, _chromeStatus: "disabled", })); -- cgit v1.2.3-70-g09d2 From 362eb4d830c23a40c0813e7aae21e6bf6c5292b3 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Fri, 7 Aug 2020 11:09:51 -0500 Subject: merge fix --- src/client/util/CurrentUserUtils.ts | 107 +++++++++--------------------------- 1 file changed, 25 insertions(+), 82 deletions(-) (limited to 'src') diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index ccd0b4ef3..c205acb99 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -426,85 +426,30 @@ export class CurrentUserUtils { if (doc.activeMobileMenu === undefined) { this.setupActiveMobileMenu(doc); } - - // { title: "Drag an instance of the device collection", title: "Buxton", icon: "globe-asia", ignoreClick: true, drag: 'Docs.Create.Buxton()' }, - // { title: "use pen", icon: "pen-nib", click: 'activatePen(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "blue", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, - // { title: "use highlighter", icon: "highlighter", click: 'activateBrush(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this,20,this.backgroundColor)', backgroundColor: "yellow", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, - // { title: "use stamp", icon: "stamp", click: 'activateStamp(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "orange", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, - // { title: "use eraser", icon: "eraser", click: 'activateEraser(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this);', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "pink", activeInkPen: doc }, - // { title: "use drag", icon: "mouse-pointer", click: 'deactivateInk();this.activeInkPen = this;', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "white", activeInkPen: doc }, - // { title: "Drag an import folder", title: "Load", icon: "cloud-upload-alt", ignoreClick: true, drag: 'Docs.Create.DirectoryImportDocument({ title: "Directory Import", _width: 400, _height: 400 })' }, - // { title: "Drag a webcam", title: "Cam", icon: "video", ignoreClick: true, drag: 'Docs.Create.WebCamDocument("", { _width: 400, _height: 400, title: "a test cam" })' }, - - const collection = { - toolTip: "Drag a collection", title: "Col", - icon: "folder", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyCollection as Doc - }; - const web = { - toolTip: "Drag a web page", title: "Web", - icon: "globe-asia", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyWebpage as Doc - }; - const cat = { - toolTip: "Drag a cat image", title: "Image", - icon: "cat", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyImage as Doc - }; - const compare = { - toolTip: "Drag a comparison box", title: "Compare", - icon: "columns", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyComparison as Doc - } - const screen = { - toolTip: "Drag a screengrabber", title: "Grab", - icon: "photo-video", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScreenshot as Doc, - }; - const audio = { - toolTip: "Drag a audio recorder", title: "Audio", - icon: "microphone", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyAudio as Doc - }; - const button = { - toolTip: "Drag a button", title: "Button", - icon: "bolt", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyButton as Doc - }; - const pres = { - toolTip: "Drag a presentation view", title: "Pres", icon: "tv", - click: 'openOnRight(Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true))', - drag: `Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true)`, - dragFactory: doc.emptyPresentation as Doc - }; - const search = { - toolTip: "Drag a search box", title: "Query", icon: "search", - click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', - dragFactory: doc.emptySearch as Doc, - }; - const script = { - toolTip: "Drag a scripting box", title: "Script", - icon: "terminal", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScript as Doc, - }; - const mobile = { - toolTip: "Drag a mobile view", title: "Phone", - icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', - drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc, - }; - const preview = { - toolTip: "Drag a document previewer", title: "Prev", - icon: "expand", click: 'openOnRight(getCopy(this.dragFactory, true))', - drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyDocHolder as Doc, - }; - const repl = { - toolTip: "Toggle a Calculator REPL", title: "repl", - icon: "calculator", - click: 'addOverlayWindow("ScriptingRepl", { x: 300, y: 100, width: 200, height: 200, title: "Scripting REPL" })', - }; - - // novice : [collection, web, compare, audio, button, pres] - return [collection, web, compare, screen, audio, button, pres, search, script, preview, repl]; + return [ + { toolTip: "Drag a collection", title: "Col", icon: "folder", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyCollection as Doc, noviceMode: true }, + { toolTip: "Drag a web page", title: "Web", icon: "globe-asia", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyWebpage as Doc, noviceMode: true }, + { toolTip: "Drag a cat image", title: "Image", icon: "cat", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyImage as Doc }, + { toolTip: "Drag a comparison box", title: "Compare", icon: "columns", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyComparison as Doc, noviceMode: true }, + { toolTip: "Drag a screengrabber", title: "Grab", icon: "photo-video", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScreenshot as Doc }, + // { title: "Drag a webcam", title: "Cam", icon: "video", ignoreClick: true, drag: 'Docs.Create.WebCamDocument("", { _width: 400, _height: 400, title: "a test cam" })' }, + { toolTip: "Drag a audio recorder", title: "Audio", icon: "microphone", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyAudio as Doc, noviceMode: true }, + { toolTip: "Drag a button", title: "Button", icon: "bolt", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyButton as Doc, noviceMode: true }, + + { toolTip: "Drag a presentation view", title: "Prezi", icon: "tv", click: 'openOnRight(Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true))', drag: `Doc.UserDoc().activePresentation = getCopy(this.dragFactory, true)`, dragFactory: doc.emptyPresentation as Doc, noviceMode: true }, + { toolTip: "Drag a search box", title: "Query", icon: "search", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptySearch as Doc }, + { toolTip: "Drag a scripting box", title: "Script", icon: "terminal", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyScript as Doc }, + // { title: "Drag an import folder", title: "Load", icon: "cloud-upload-alt", ignoreClick: true, drag: 'Docs.Create.DirectoryImportDocument({ title: "Directory Import", _width: 400, _height: 400 })' }, + { toolTip: "Drag a mobile view", title: "Phone", icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc }, + // { title: "Drag an instance of the device collection", title: "Buxton", icon: "globe-asia", ignoreClick: true, drag: 'Docs.Create.Buxton()' }, + // { title: "use pen", icon: "pen-nib", click: 'activatePen(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "blue", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, + // { title: "use highlighter", icon: "highlighter", click: 'activateBrush(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this,20,this.backgroundColor)', backgroundColor: "yellow", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, + // { title: "use stamp", icon: "stamp", click: 'activateStamp(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this)', backgroundColor: "orange", ischecked: `sameDocs(this.activeInkPen, this)`, activeInkPen: doc }, + // { title: "use eraser", icon: "eraser", click: 'activateEraser(this.activeInkPen = sameDocs(this.activeInkPen, this) ? undefined : this);', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "pink", activeInkPen: doc }, + // { title: "use drag", icon: "mouse-pointer", click: 'deactivateInk();this.activeInkPen = this;', ischecked: `sameDocs(this.activeInkPen, this)`, backgroundColor: "white", activeInkPen: doc }, + { toolTip: "Drag a document previewer", title: "Prev", icon: "expand", click: 'openOnRight(getCopy(this.dragFactory, true))', drag: 'getCopy(this.dragFactory, true)', dragFactory: doc.emptyDocHolder as Doc }, + { toolTip: "Toggle a Calculator REPL", title: "repl", icon: "calculator", click: 'addOverlayWindow("ScriptingRepl", { x: 300, y: 100, width: 200, height: 200, title: "Scripting REPL" })' }, + ]; } @@ -540,9 +485,7 @@ export class CurrentUserUtils { if (dragCreatorSet === undefined) { doc.myItemCreators = new PrefetchProxy(Docs.Create.MasonryDocument(creatorBtns, { - title: "Basic Item Creators", - hidden: ComputedField.MakeFunction("!self.target.noviceMode") as any, - _showTitle: "title", _xMargin: 0, + title: "Basic Item Creators", _showTitle: "title", _xMargin: 0, _autoHeight: true, _width: 500, _columnWidth: 35, ignoreClick: true, lockedPosition: true, _chromeStatus: "disabled", dropConverter: ScriptField.MakeScript("convertToButtons(dragData)", { dragData: DragManager.DocumentDragData.name }), })); -- cgit v1.2.3-70-g09d2 From 6316971c51d327563ebb61d461325c7e9edbec24 Mon Sep 17 00:00:00 2001 From: anika-ahluwalia Date: Fri, 7 Aug 2020 11:26:33 -0500 Subject: button color change for sally --- src/client/views/PropertiesButtons.tsx | 39 ++++++++++++++++++++-------------- 1 file changed, 23 insertions(+), 16 deletions(-) (limited to 'src') diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx index 4255e5caa..5e25ead87 100644 --- a/src/client/views/PropertiesButtons.tsx +++ b/src/client/views/PropertiesButtons.tsx @@ -225,10 +225,11 @@ export class PropertiesButtons extends React.Component<{}, {}> {
-
{Doc.isDocPinned(targetDoc) ? "Unpin" : "Pin"}
; @@ -382,10 +383,12 @@ export class PropertiesButtons extends React.Component<{}, {}> { color={BoolCast(this.selectedDoc?.lockedPosition) ? "black" : "white"} icon={BoolCast(this.selectedDoc?.lockedPosition) ? "unlock" : "lock"} size="lg" />}
-
Position
+
Position
; } @@ -595,10 +598,12 @@ export class PropertiesButtons extends React.Component<{}, {}> { color={this.selectedDoc?.useClusters ? "black" : "white"} icon="braille" size="lg" />} -
clusters
+
clusters
; } @@ -626,10 +631,12 @@ export class PropertiesButtons extends React.Component<{}, {}> { color={this.selectedDoc?._fitToBox ? "black" : "white"} icon="expand" size="lg" />} -
{this.selectedDoc?._fitToBox ? "unfit" : "fit"}
+
{this.selectedDoc?._fitToBox ? "unfit" : "fit"}
; } -- cgit v1.2.3-70-g09d2