From 6efe31636305bf5120d472f456b69d1b699b2ae8 Mon Sep 17 00:00:00 2001
From: fawn <fangrui_tong@brown.edu>
Date: Mon, 29 Jul 2019 22:48:31 -0400
Subject: styled toggle buttons on schema chrome

---
 .../views/collections/CollectionViewChromes.scss   | 51 ++++++++++++++++++++++
 1 file changed, 51 insertions(+)

(limited to 'src/client/views/collections/CollectionViewChromes.scss')

diff --git a/src/client/views/collections/CollectionViewChromes.scss b/src/client/views/collections/CollectionViewChromes.scss
index f9f3ce473..933ba7411 100644
--- a/src/client/views/collections/CollectionViewChromes.scss
+++ b/src/client/views/collections/CollectionViewChromes.scss
@@ -165,4 +165,55 @@
             cursor: text;
         }
     }
+}
+
+.collectionSchemaViewChrome-cont {
+    display: flex;
+    font-size: 10.5px;
+
+    .collectionSchemaViewChrome-toggle {
+        display: flex;
+        margin-left: 10px;
+    }
+
+    .collectionSchemaViewChrome-label {
+        text-transform: uppercase;
+        letter-spacing: 2px;
+        margin-right: 5px;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+    }
+
+    .collectionSchemaViewChrome-toggler {
+        width: 100px;
+        height: 41px;
+        background-color: black;
+        position: relative;
+    }
+
+    .collectionSchemaViewChrome-togglerButton {
+        width: 47px;
+        height: 35px;
+        background-color: lightgray;
+        // position: absolute;
+        transition: all 0.5s ease;
+        // top: 3px;
+        margin-top: 3px;
+        color: gray;
+        letter-spacing: 2px;
+        text-transform: uppercase;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        text-align: center;
+
+        &.on {
+            margin-left: 3px;
+        }
+
+        &.off {
+            margin-left: 50px;
+        }
+    }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From f9dbc263048bc269f8f128bacabe1fcbd868bd10 Mon Sep 17 00:00:00 2001
From: fawn <fangrui_tong@brown.edu>
Date: Mon, 29 Jul 2019 23:58:54 -0400
Subject: can pick colors on schema columns git add -Agit add -A!

---
 .../views/collections/CollectionSchemaHeaders.tsx  | 48 ++++++----------------
 .../views/collections/CollectionSchemaView.scss    | 30 ++++++++++++--
 .../views/collections/CollectionViewChromes.scss   |  2 +-
 3 files changed, 41 insertions(+), 39 deletions(-)

(limited to 'src/client/views/collections/CollectionViewChromes.scss')

diff --git a/src/client/views/collections/CollectionSchemaHeaders.tsx b/src/client/views/collections/CollectionSchemaHeaders.tsx
index 12323fa0d..84132ef2e 100644
--- a/src/client/views/collections/CollectionSchemaHeaders.tsx
+++ b/src/client/views/collections/CollectionSchemaHeaders.tsx
@@ -10,7 +10,7 @@ import { ColumnType } from "./CollectionSchemaView";
 import { emptyFunction } from "../../../Utils";
 import { contains } from "typescript-collections/dist/lib/arrays";
 import { faFile } from "@fortawesome/free-regular-svg-icons";
-import { SchemaHeaderField } from "../../../new_fields/SchemaHeaderField";
+import { SchemaHeaderField, RandomPastel, PastelSchemaPalette } from "../../../new_fields/SchemaHeaderField";
 
 library.add(faPlus, faFont, faHashtag, faAlignJustify, faCheckSquare, faToggleOn, faFile);
 
@@ -73,8 +73,6 @@ export class CollectionSchemaAddColumnHeader extends React.Component<AddColumnHe
     }
 }
 
-
-
 export interface ColumnMenuProps {
     columnField: SchemaHeaderField;
     // keyValue: string;
@@ -115,12 +113,6 @@ export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps>
         }
     }
 
-    setNewColor = (color: string): void => {
-        this.changeColumnType(ColumnType.Any);
-        console.log("change color", this.props.columnField.heading);
-        this.props.setColumnColor(this.props.columnField, color);
-    }
-
     @action
     toggleIsOpen = (): void => {
         this._isOpen = !this._isOpen;
@@ -128,10 +120,13 @@ export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps>
     }
 
     changeColumnType = (type: ColumnType): void => {
-        console.log("change type", this.props.columnField.heading);
         this.props.setColumnType(this.props.columnField, type);
     }
 
+    changeColumnColor = (color: string): void => {
+        this.props.setColumnColor(this.props.columnField, color);
+    }
+
     @action
     setNode = (node: HTMLDivElement): void => {
         if (node) {
@@ -179,34 +174,17 @@ export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps>
     }
 
     renderColors = () => {
+        let selected = this.props.columnField.color;
         return (
             <div className="collectionSchema-headerMenu-group">
                 <label>Color:</label>
                 <div className="columnMenu-colors">
-                    <input type="radio" name="column-color" id="pink" value="#FFB4E8" onClick={() => this.setNewColor("#FFB4E8")} />
-                    <label htmlFor="pink">
-                        <div className="columnMenu-colorPicker" style={{ backgroundColor: "#FFB4E8" }}></div>
-                    </label>
-                    <input type="radio" name="column-color" id="purple" value="#b28dff" onClick={() => this.setNewColor("#b28dff")} />
-                    <label htmlFor="purple">
-                        <div className="columnMenu-colorPicker" style={{ backgroundColor: "#b28dff" }}></div>
-                    </label>
-                    <input type="radio" name="column-color" id="blue" value="#afcbff" onClick={() => this.setNewColor("#afcbff")} />
-                    <label htmlFor="blue">
-                        <div className="columnMenu-colorPicker" style={{ backgroundColor: "#afcbff" }}></div>
-                    </label>
-                    <input type="radio" name="column-color" id="yellow" value="#fff5ba" onClick={() => this.setNewColor("#fff5ba")} />
-                    <label htmlFor="yellow">
-                        <div className="columnMenu-colorPicker" style={{ backgroundColor: "#fff5ba" }}></div>
-                    </label>
-                    <input type="radio" name="column-color" id="red" value="#ffabab" onClick={() => this.setNewColor("#ffabab")} />
-                    <label htmlFor="red">
-                        <div className="columnMenu-colorPicker" style={{ backgroundColor: "#ffabab" }}></div>
-                    </label>
-                    <input type="radio" name="column=color" id="none" value="#f1efeb" onClick={() => this.setNewColor("#f1efeb")} />
-                    <label htmlFor="none">
-                        <div className="columnMenu-colorPicker" style={{ backgroundColor: "#f1efeb" }}></div>
-                    </label>
+                    <div className={"columnMenu-colorPicker" + (selected === "#FFB4E8" ? " active" : "")} style={{ backgroundColor: "#FFB4E8" }} onClick={() => this.changeColumnColor("#FFB4E8")}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === "#b28dff" ? " active" : "")} style={{ backgroundColor: "#b28dff" }} onClick={() => this.changeColumnColor("#b28dff")}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === "#afcbff" ? " active" : "")} style={{ backgroundColor: "#afcbff" }} onClick={() => this.changeColumnColor("#afcbff")}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === "#fff5ba" ? " active" : "")} style={{ backgroundColor: "#fff5ba" }} onClick={() => this.changeColumnColor("#fff5ba")}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === "#ffabab" ? " active" : "")} style={{ backgroundColor: "#ffabab" }} onClick={() => this.changeColumnColor("#ffabab")}></div>
+                    <div className={"columnMenu-colorPicker" + (selected === "#f1efeb" ? " active" : "")} style={{ backgroundColor: "#f1efeb" }} onClick={() => this.changeColumnColor("#f1efeb")}></div>
                 </div>
             </div>
         );
@@ -231,7 +209,7 @@ export class CollectionSchemaColumnMenu extends React.Component<ColumnMenuProps>
                     <>
                         {this.renderTypes()}
                         {this.renderSorting()}
-                        {/* {this.renderColors()} */}
+                        {this.renderColors()}
                         <div className="collectionSchema-headerMenu-group">
                             <button onClick={() => this.props.deleteColumn(this.props.columnField.heading)}>Delete Column</button>
                         </div>
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
index e826ff63a..ca2684ba2 100644
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ b/src/client/views/collections/CollectionSchemaView.scss
@@ -327,6 +327,18 @@ button.add-column {
 
         button {
             border-radius: 20px;
+            width: 22px;
+            height: 22px;
+            text-align: center;
+            display: flex;
+            justify-content: center;
+            flex-direction: column;
+            padding: 0;
+
+            &.active {
+                border: 2px solid white;
+                box-shadow: 0 0 0 2px lightgray;
+            }
         }
     }
 
@@ -335,15 +347,27 @@ button.add-column {
         justify-content: space-between;
         flex-wrap: wrap;
 
-        input[type="radio"] {
-            display: none;
-        }
+        // input[type="radio"] {
+        //     display: none;
+        // }
+
+        // input[type="radio"]:checked + label {
+        //     .columnMenu-colorPicker {
+        //         border: 2px solid white;
+        //         box-shadow: 0 0 0 2px  lightgray;
+        //     }
+        // }
 
         .columnMenu-colorPicker {
             cursor: pointer;
             width: 20px;
             height: 20px;
             border-radius: 10px;
+
+            &.active {
+                border: 2px solid white;
+                box-shadow: 0 0 0 2px lightgray;
+            }
         }
     }
 }
diff --git a/src/client/views/collections/CollectionViewChromes.scss b/src/client/views/collections/CollectionViewChromes.scss
index 933ba7411..0d476e234 100644
--- a/src/client/views/collections/CollectionViewChromes.scss
+++ b/src/client/views/collections/CollectionViewChromes.scss
@@ -195,7 +195,7 @@
     .collectionSchemaViewChrome-togglerButton {
         width: 47px;
         height: 35px;
-        background-color: lightgray;
+        background-color: $light-color-secondary;
         // position: absolute;
         transition: all 0.5s ease;
         // top: 3px;
-- 
cgit v1.2.3-70-g09d2


From 7c3b56a2e4552308014aa011493b33e3b054be94 Mon Sep 17 00:00:00 2001
From: yipstanley <stanley_yip@brown.edu>
Date: Tue, 30 Jul 2019 16:33:27 -0400
Subject: fixed some scripting stuff on view specs

---
 src/client/views/collections/CollectionSubView.tsx      | 3 +++
 src/client/views/collections/CollectionViewChromes.scss | 3 ++-
 src/client/views/collections/CollectionViewChromes.tsx  | 9 +++++++--
 src/client/views/collections/KeyRestrictionRow.tsx      | 6 +++++-
 4 files changed, 17 insertions(+), 4 deletions(-)

(limited to 'src/client/views/collections/CollectionViewChromes.scss')

diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index a15ed8f94..7386eaba6 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -66,6 +66,9 @@ export function CollectionSubView<T>(schemaCtor: (doc: Doc) => T) {
                     if (res.success) {
                         return res.result;
                     }
+                    else {
+                        console.log(res.error);
+                    }
                 });
             }
             return docs;
diff --git a/src/client/views/collections/CollectionViewChromes.scss b/src/client/views/collections/CollectionViewChromes.scss
index 989315194..c062c3261 100644
--- a/src/client/views/collections/CollectionViewChromes.scss
+++ b/src/client/views/collections/CollectionViewChromes.scss
@@ -37,9 +37,10 @@
             }
 
             .collectionViewBaseChrome-collapse {
-                transition: all .5s;
+                transition: all .5s opacity 0.2s;
                 position: absolute;
                 width: 40px;
+                transform-origin: top left;
             }
 
             .collectionViewBaseChrome-viewSpecs {
diff --git a/src/client/views/collections/CollectionViewChromes.tsx b/src/client/views/collections/CollectionViewChromes.tsx
index 2bffe3cc0..0827cfef9 100644
--- a/src/client/views/collections/CollectionViewChromes.tsx
+++ b/src/client/views/collections/CollectionViewChromes.tsx
@@ -142,7 +142,7 @@ export class CollectionViewBaseChrome extends React.Component<CollectionViewChro
             `return ${dateRestrictionScript} ${keyRestrictionScript.length ? "&&" : ""} ${keyRestrictionScript}` :
             `return ${keyRestrictionScript} ${dateRestrictionScript.length ? "&&" : ""} ${dateRestrictionScript}` :
             "return true";
-        let compiled = CompileScript(fullScript, { params: { doc: Doc.name } });
+        let compiled = CompileScript(fullScript, { params: { doc: Doc.name }, typecheck: false });
         if (compiled.compiled) {
             this.props.CollectionView.props.Document.viewSpecScript = new ScriptField(compiled);
         }
@@ -189,7 +189,12 @@ export class CollectionViewBaseChrome extends React.Component<CollectionViewChro
                 <div className="collectionViewChrome">
                     <div className="collectionViewBaseChrome">
                         <button className="collectionViewBaseChrome-collapse"
-                            style={{ marginTop: this._collapsed ? 60 : 0, transform: `rotate(${this._collapsed ? 180 : 0}deg)` }}
+                            style={{
+                                marginTop: this._collapsed ? 60 : 0,
+                                transform: `rotate(${this._collapsed ? 180 : 0}deg) scale(${this._collapsed ? 0.5 : 1}) translate(${this._collapsed ? "-100%, -100%" : "0, 0"})`,
+                                opacity: (this._collapsed && !this.props.CollectionView.props.isSelected()) ? 0 : 0.9,
+                                left: (this._collapsed ? 0 : "unset"),
+                            }}
                             title="Collapse collection chrome" onClick={this.toggleCollapse}>
                             <FontAwesomeIcon icon="caret-up" size="2x" />
                         </button>
diff --git a/src/client/views/collections/KeyRestrictionRow.tsx b/src/client/views/collections/KeyRestrictionRow.tsx
index 9baa250a6..1b59547d8 100644
--- a/src/client/views/collections/KeyRestrictionRow.tsx
+++ b/src/client/views/collections/KeyRestrictionRow.tsx
@@ -2,6 +2,7 @@ import * as React from "react";
 import { observable, runInAction } from "mobx";
 import { observer } from "mobx-react";
 import { PastelSchemaPalette } from "../../../new_fields/SchemaHeaderField";
+import { Doc } from "../../../new_fields/Doc";
 
 interface IKeyRestrictionProps {
     contains: boolean;
@@ -23,7 +24,10 @@ export default class KeyRestrictionRow extends React.Component<IKeyRestrictionPr
                 parsedValue = parsed;
                 type = "number";
             }
-            let scriptText = `${this._contains ? "" : "!"}((doc.${this._key} as ${type})${type === "string" ? ".includes" : "<="}(${parsedValue}))`;
+            let scriptText = `${this._contains ? "" : "!"}(((doc.${this._key} && (doc.${this._key} as ${type})${type === "string" ? ".includes" : "<="}(${parsedValue}))) ||
+                ((doc.data_ext && doc.data_ext.${this._key}) && (doc.data_ext.${this._key} as ${type})${type === "string" ? ".includes" : "<="}(${parsedValue}))))`;
+            // let doc = new Doc();
+            // ((doc.data_ext && doc.data_ext!.text) && (doc.data_ext!.text as string).includes("hello"));
             this.props.script(scriptText);
         }
         else {
-- 
cgit v1.2.3-70-g09d2


From 676534c7ad5fd5fa155f4b76856ff33a08d8ab49 Mon Sep 17 00:00:00 2001
From: yipstanley <stanley_yip@brown.edu>
Date: Tue, 30 Jul 2019 16:33:37 -0400
Subject: object field scripting

---
 src/client/views/collections/CollectionViewChromes.scss | 2 +-
 src/new_fields/ObjectField.ts                           | 3 +++
 2 files changed, 4 insertions(+), 1 deletion(-)

(limited to 'src/client/views/collections/CollectionViewChromes.scss')

diff --git a/src/client/views/collections/CollectionViewChromes.scss b/src/client/views/collections/CollectionViewChromes.scss
index c062c3261..1738ac227 100644
--- a/src/client/views/collections/CollectionViewChromes.scss
+++ b/src/client/views/collections/CollectionViewChromes.scss
@@ -37,7 +37,7 @@
             }
 
             .collectionViewBaseChrome-collapse {
-                transition: all .5s opacity 0.2s;
+                transition: all .5s, opacity 0.3s;
                 position: absolute;
                 width: 40px;
                 transform-origin: top left;
diff --git a/src/new_fields/ObjectField.ts b/src/new_fields/ObjectField.ts
index 5f4a6f8fb..65ada91c0 100644
--- a/src/new_fields/ObjectField.ts
+++ b/src/new_fields/ObjectField.ts
@@ -1,6 +1,7 @@
 import { Doc } from "./Doc";
 import { RefField } from "./RefField";
 import { OnUpdate, Parent, Copy, ToScriptString } from "./FieldSymbols";
+import { Scripting } from "../client/util/Scripting";
 
 export abstract class ObjectField {
     protected [OnUpdate](diff?: any) { }
@@ -15,3 +16,5 @@ export namespace ObjectField {
         return field[Copy]();
     }
 }
+
+Scripting.addGlobal(ObjectField);
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2