From e0757ecfe8666a13a38b1c396d4a9e5138b4a3bd Mon Sep 17 00:00:00 2001
From: eperelm2 <emily_perelman@brown.edu>
Date: Thu, 22 Jun 2023 11:26:24 -0400
Subject: double clicking works

---
 src/client/views/PropertiesView.tsx | 196 ++++++++++++++++++++++++++++++++----
 1 file changed, 176 insertions(+), 20 deletions(-)

(limited to 'src/client/views/PropertiesView.tsx')

diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index a0c45bc70..60e93cdfd 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -1050,11 +1050,34 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     }
 
     @computed get optionsSubMenu() {
+        let isDouble = false;
+
         return (
             <div className="propertiesView-settings" onPointerEnter={action(() => (this.inOptions = true))} onPointerLeave={action(() => (this.inOptions = false))}>
-                <div className="propertiesView-settings-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false,
-                this.openFields = false, this.openSharing = false, this.openFilters = false, this.openLayout = false))}
-                onClick={action(() => (this.openOptions = !this.openOptions))} style={{ backgroundColor: this.openOptions ? 'black' : '' }}>
+                <div className="propertiesView-settings-title" onClick ={action(() => {
+                    if (!isDouble){
+                        this.openOptions = !this.openOptions
+                    } } )}
+                 onDoubleClick={action(() => {
+                    isDouble = true;
+
+                    this.openContexts = false;
+                    this.openLinks = false;
+                    this.openOptions = true;
+                    this.openTransform = false;
+                    this.openFields = false;
+                    this.openSharing = false;
+                    this.openLayout = false;
+                    this.openFilters = false;
+                    
+
+                    setTimeout(() => {
+                        isDouble = false;
+                    }, 300)
+                }
+                    
+    )}
+                 style={{ backgroundColor: this.openOptions ? 'black' : '' }}>
                     Options
                     <div className="propertiesView-settings-title-icon">
                         <FontAwesomeIcon icon={this.openOptions ? 'caret-down' : 'caret-right'} size="lg" color="white" />
@@ -1070,11 +1093,32 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     }
 
     @computed get sharingSubMenu() {
+        let isDouble:boolean = false;
+
         return (
             <div className="propertiesView-sharing">
-                <div className="propertiesView-sharing-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false, 
-                this.openOptions = false, this.openFields = false, this.openFilters = false, this.openLayout))}
-                onClick={action(() => (this.openSharing = !this.openSharing))} style={{ backgroundColor: this.openSharing ? 'black' : '' }}>
+                <div className="propertiesView-sharing-title" onClick ={action(() => {
+                    if (!isDouble){
+                        this.openSharing = !this.openSharing
+                    } } )}
+                 onDoubleClick={action(() => {
+                    isDouble = true;
+
+                    this.openContexts = false;
+                    this.openLinks = false;
+                    this.openOptions = false;
+                    this.openTransform = false;
+                    this.openFields = false;
+                    this.openSharing = true;
+                    this.openLayout = false;
+                    this.openFilters = false;
+                    
+
+                    setTimeout(() => {
+                        isDouble = false;
+                    }, 300)
+                })}
+                style={{ backgroundColor: this.openSharing ? 'black' : '' }}>
                     Sharing {'&'} Permissions
                     <div className="propertiesView-sharing-title-icon">
                         <FontAwesomeIcon icon={this.openSharing ? 'caret-down' : 'caret-right'} size="lg" color="white" />
@@ -1127,11 +1171,34 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     };
 
     @computed get filtersSubMenu() {
+        let isDouble: boolean = false;
+
         return (
             <div className="propertiesView-filters">
-                <div className="propertiesView-filters-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false,
-                this.openOptions = false, this.openFields = false, this.openSharing = false, this.openLayout = false))}
-                onClick={action(() => (this.openFilters = !this.openFilters))} style={{ backgroundColor: this.openFilters ? 'black' : '' }}>
+                <div className="propertiesView-filters-title" onClick ={action(() => {
+                    if (!isDouble){
+                        this.openFilters = !this.openFilters
+                    } } )}
+                 onDoubleClick={action(() => {
+                    isDouble = true;
+
+                    this.openContexts = false;
+                    this.openLinks = false;
+                    this.openOptions = false;
+                    this.openTransform = false;
+                    this.openFields = false;
+                    this.openSharing = false;
+                    this.openLayout = false;
+                    this.openFilters = true;
+                    
+
+                    setTimeout(() => {
+                        isDouble = false;
+                    }, 300)
+                }
+                    
+    )}
+                 style={{ backgroundColor: this.openFilters ? 'black' : '' }}>
                     Filters
                     <div className="propertiesView-filters-title-icon">
                         <FontAwesomeIcon icon={this.openFilters ? 'caret-down' : 'caret-right'} size="lg" color="white" />
@@ -1147,6 +1214,8 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     }
 
     @computed get inkSubMenu() {
+        let isDouble = false;
+
         return (
             <>
                 {!this.isInk ? null : (
@@ -1162,8 +1231,27 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
                 )}
 
                 <div className="propertiesView-transform">
-                    <div className="propertiesView-transform-title" onClick={action(() => (this.openTransform = !this.openTransform))}  onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openOptions = false,
-                    this.openFields = false, this.openSharing = false, this.openFilters = false, this.openLayout = false, this.openTransform = true))}
+                    <div className="propertiesView-transform-title" onClick ={action(() => {
+                    if (!isDouble){
+                        this.openTransform = !this.openTransform
+                    } } )}
+                 onDoubleClick={action(() => {
+                    isDouble = true;
+
+                    this.openContexts = false;
+                    this.openLinks = false;
+                    this.openOptions = false;
+                    this.openTransform = true;
+                    this.openFields = false;
+                    this.openSharing = false;
+                    this.openLayout = false;
+                    this.openFilters = false;
+                    
+
+                    setTimeout(() => {
+                        isDouble = false;
+                    }, 300)
+                })}
                      style={{ backgroundColor: this.openTransform ? 'black' : '' }}>
                         Transform
                         <div className="propertiesView-transform-title-icon">
@@ -1177,11 +1265,34 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     }
 
     @computed get fieldsSubMenu() {
+        let isDouble: boolean = false;
+
         return (
             <div className="propertiesView-fields">
-                <div className="propertiesView-fields-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform = false, 
-                this.openOptions = false, this.openSharing = false, this.openFilters = false, this.openLayout = false))}
-                 onClick={action(() => (this.openFields = !this.openFields))} style={{ backgroundColor: this.openFields ? 'black' : '' }}>
+                <div className="propertiesView-fields-title" onClick ={action(() => {
+                    if (!isDouble){
+                        this.openFields = !this.openFields
+                    } } )}
+                 onDoubleClick={action(() => {
+                    isDouble = true;
+
+                    this.openContexts = false;
+                    this.openLinks = false;
+                    this.openOptions = false;
+                    this.openTransform = false;
+                    this.openFields = true;
+                    this.openSharing = false;
+                    this.openLayout = false;
+                    this.openFilters = false;
+                    
+
+                    setTimeout(() => {
+                        isDouble = false;
+                    }, 300)
+                }
+                    
+    )}
+                  style={{ backgroundColor: this.openFields ? 'black' : '' }}>
                     Fields {'&'} Tags
                     <div className="propertiesView-fields-title-icon">
                         <FontAwesomeIcon icon={this.openFields ? 'caret-down' : 'caret-right'} size="lg" color="white" />
@@ -1199,11 +1310,33 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     }
 
     @computed get contextsSubMenu() {
+        let isDouble = false;
         return (
             <div className="propertiesView-contexts">
-                <div className="propertiesView-contexts-title" onDoubleClick={action(() => (this.openLinks = false, this.openTransform = false, this.openOptions = false, this.openFields = false,
-                 this.openSharing = false, this.openFilters = false, this.openLayout = false ))}
-                      onClick ={action(() => (this.openContexts = !this.openContexts))} style={{ backgroundColor: this.openContexts ? 'black' : '' }}>
+                <div className="propertiesView-contexts-title" onClick ={action(() => {
+                    if (!isDouble){
+                        this.openContexts = !this.openContexts
+                    } } )}
+                 onDoubleClick={action(() => {
+                    isDouble = true;
+
+                    this.openContexts = true;
+                    this.openLinks = false;
+                    this.openOptions = false;
+                    this.openTransform = false;
+                    this.openFields = false;
+                    this.openSharing = false;
+                    this.openLayout = false;
+                    this.openFilters = false;
+                    
+
+                    setTimeout(() => {
+                        isDouble = false;
+                    }, 300)
+                }
+                    
+    )}
+                      style={{ backgroundColor: this.openContexts ? 'black' : '' }}>
                     Other Contexts
                     <div className="propertiesView-contexts-title-icon">
                         <FontAwesomeIcon icon={this.openContexts ? 'caret-down' : 'caret-right'} size="lg" color="white" />
@@ -1260,11 +1393,34 @@ export class PropertiesView extends React.Component<PropertiesViewProps> {
     }
 
     @computed get layoutSubMenu() {
+        let isDouble: boolean = false;
+
         return (
             <div className="propertiesView-layout">
-                <div className="propertiesView-layout-title" onDoubleClick={action(() => (this.openContexts = false, this.openLinks = false, this.openTransform  = false,
-                this.openOptions = false, this.openFields = false, this.openSharing = false, this.openFilters = false ))}
-                 onClick={action(() => (this.openLayout = !this.openLayout))} style={{ backgroundColor: this.openLayout ? 'black' : '' }}>
+                <div className="propertiesView-layout-title" onClick ={action(() => {
+                    if (!isDouble){
+                        this.openLayout = !this.openLayout
+                    } } )}
+                 onDoubleClick={action(() => {
+                    isDouble = true;
+
+                    this.openContexts = false;
+                    this.openLinks = false;
+                    this.openOptions = false;
+                    this.openTransform = false;
+                    this.openFields = false;
+                    this.openSharing = false;
+                    this.openLayout = true;
+                    this.openFilters = false;
+                    
+
+                    setTimeout(() => {
+                        isDouble = false;
+                    }, 300)
+                }
+                    
+    )}
+                  style={{ backgroundColor: this.openLayout ? 'black' : '' }}>
                     Layout
                     <div className="propertiesView-layout-title-icon">
                         <FontAwesomeIcon icon={this.openLayout ? 'caret-down' : 'caret-right'} size="lg" color="white" />
-- 
cgit v1.2.3-70-g09d2