aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/search/CheckBox.scss10
-rw-r--r--src/client/views/search/CheckBox.tsx15
-rw-r--r--src/client/views/search/CollectionFilters.scss19
-rw-r--r--src/client/views/search/CollectionFilters.tsx52
-rw-r--r--src/client/views/search/FieldFilters.tsx19
-rw-r--r--src/client/views/search/SearchBox.scss1
-rw-r--r--src/client/views/search/SearchBox.tsx59
7 files changed, 150 insertions, 25 deletions
diff --git a/src/client/views/search/CheckBox.scss b/src/client/views/search/CheckBox.scss
index 582d24e72..9b0af68d5 100644
--- a/src/client/views/search/CheckBox.scss
+++ b/src/client/views/search/CheckBox.scss
@@ -1,13 +1,16 @@
@import "../globalCssVariables";
-.checkbox {
+.checkboxfilter {
display: flex;
+ margin-top: 0px;
+ padding: 3px;
.outer {
display: flex;
position: relative;
justify-content: center;
- align-items: center;
+ align-items: center;
+ margin-top: 0px;
}
.check-box {
@@ -28,7 +31,6 @@
.check-container:hover ~ .check-box {
background-color: $intermediate-color;
-
}
.check-container {
@@ -49,6 +51,8 @@
}
.checkbox-title {
+ display: flex;
+ align-items: center;
text-transform: capitalize;
margin-left: 15px;
} \ No newline at end of file
diff --git a/src/client/views/search/CheckBox.tsx b/src/client/views/search/CheckBox.tsx
index 26ad9d8ce..24c404892 100644
--- a/src/client/views/search/CheckBox.tsx
+++ b/src/client/views/search/CheckBox.tsx
@@ -10,6 +10,7 @@ interface CheckBoxProps {
title: string;
parent: any;
numCount: number;
+ default: boolean;
}
@observer
@@ -36,6 +37,9 @@ export class CheckBox extends React.Component<CheckBoxProps>{
autoplay: false,
direction: "normal",
});
+
+ // console.log(this.props.getStatus())
+ // console.log(this.props.getStatus)
}
componentDidMount = () => {
@@ -55,6 +59,7 @@ export class CheckBox extends React.Component<CheckBoxProps>{
if (this.props.originalStatus) {
this.checkTimeline.play();
+ this.checkTimeline.restart();
}
this._resetReaction = reaction(
@@ -76,12 +81,18 @@ export class CheckBox extends React.Component<CheckBoxProps>{
@action.bound
reset() {
- if (!this._status) {
+ if(this.props.default){
this._status = true;
this.checkTimeline.play();
this.checkTimeline.restart();
}
+ else{
+ this._status = false;
+ this.uncheckTimeline.play();
+ this.uncheckTimeline.restart();
+ }
+ this.props.updateStatus(this.props.default);
}
@action.bound
@@ -102,7 +113,7 @@ export class CheckBox extends React.Component<CheckBoxProps>{
render() {
return (
- <div className="checkbox" onClick={this.onClick}>
+ <div className="checkboxfilter" onClick={this.onClick}>
<div className="outer">
<div className="check-container">
<svg viewBox="0 12 40 40">
diff --git a/src/client/views/search/CollectionFilters.scss b/src/client/views/search/CollectionFilters.scss
new file mode 100644
index 000000000..5e1f4effc
--- /dev/null
+++ b/src/client/views/search/CollectionFilters.scss
@@ -0,0 +1,19 @@
+@import "../globalCssVariables";
+
+.collection-filters{
+ display: flex;
+ flex-direction: row;
+ width: 100%;
+}
+
+.collection-filters.main{
+ width: 47%;
+ float: left;
+}
+
+.collection-filters.optional{
+ width: 60%;
+ display: grid;
+ grid-template-columns: 50% 50%;
+ float: right;
+} \ No newline at end of file
diff --git a/src/client/views/search/CollectionFilters.tsx b/src/client/views/search/CollectionFilters.tsx
new file mode 100644
index 000000000..8d1aa1294
--- /dev/null
+++ b/src/client/views/search/CollectionFilters.tsx
@@ -0,0 +1,52 @@
+import * as React from 'react';
+import { observer } from 'mobx-react';
+import { observable, action, runInAction } from 'mobx';
+import "./SearchBox.scss";
+import { CheckBox } from './CheckBox';
+import { Keys } from './SearchBox';
+import "./SearchBox.scss";
+import "./CollectionFilters.scss";
+import { FieldFilters } from './FieldFilters';
+
+interface CollectionFilterProps {
+ collectionStatus: boolean;
+ updateCollectionStatus(val: boolean): void;
+ collectionSelfStatus: boolean;
+ updateSelfCollectionStatus(val: boolean): void;
+ collectionParentStatus: boolean;
+ updateParentCollectionStatus(val: boolean): void;
+}
+
+export class CollectionFilters extends React.Component<CollectionFilterProps> {
+
+ static Instance: CollectionFilters;
+
+ @observable public resetBoolean = false;
+ @observable public resetCounter: number = 0;
+
+ constructor(props:CollectionFilterProps){
+ super(props);
+ CollectionFilters.Instance = this;
+ }
+
+ resetCollectionFilters() {
+ this.resetBoolean = true;
+ }
+
+ render() {
+ return (
+ <div>
+ <div className='collection-title'>Search in current collections</div>
+ <div className="collection-filters">
+ <div className="collection-filters main">
+ <CheckBox default = {false} title={"limit to current collection"} parent={this} numCount={3} updateStatus={this.props.updateCollectionStatus} originalStatus={this.props.collectionStatus} />
+ </div>
+ <div className="collection-filters optional">
+ <CheckBox default = {true} title={"Search in self"} parent={this} numCount={3} updateStatus={this.props.updateSelfCollectionStatus} originalStatus={this.props.collectionSelfStatus} />
+ <CheckBox default = {true} title={"Search in parent"} parent={this} numCount={3} updateStatus={this.props.updateParentCollectionStatus} originalStatus={this.props.collectionParentStatus} />
+ </div>
+ </div>
+ </div>
+ );
+ }
+} \ No newline at end of file
diff --git a/src/client/views/search/FieldFilters.tsx b/src/client/views/search/FieldFilters.tsx
index a7b142617..c7928dcd6 100644
--- a/src/client/views/search/FieldFilters.tsx
+++ b/src/client/views/search/FieldFilters.tsx
@@ -1,6 +1,6 @@
import * as React from 'react';
import { observer } from 'mobx-react';
-import { observable, action, runInAction } from 'mobx';
+import { observable, action, runInAction, } from 'mobx';
import "./SearchBox.scss";
import { CheckBox } from './CheckBox';
import { Keys } from './SearchBox';
@@ -21,25 +21,22 @@ export class FieldFilters extends React.Component<FieldFilterProps> {
@observable public resetBoolean = false;
@observable public resetCounter: number = 0;
- constructor(props: FieldFilterProps){
+ constructor(props: FieldFilterProps) {
super(props);
FieldFilters.Instance = this;
}
-resetFieldFilters() {
- this.props.updateAuthorStatus(true);
- this.props.updateDataStatus(true);
- this.props.updateTitleStatus(true);
- this.resetBoolean = true;
-}
+ resetFieldFilters() {
+ this.resetBoolean = true;
+ }
render() {
return (
<div>
<div className="filter field-title">Filter by Basic Keys</div>
- <CheckBox numCount = {3} parent = {this} originalStatus={this.props.titleFieldStatus} updateStatus={this.props.updateTitleStatus} title={Keys.TITLE} />
- <CheckBox numCount = {3} parent = {this} originalStatus={this.props.authorFieldStatus} updateStatus={this.props.updateAuthorStatus} title={Keys.AUTHOR} />
- <CheckBox numCount = {3} parent = {this} originalStatus={this.props.dataFieldStatus} updateStatus={this.props.updateDataStatus} title={Keys.DATA} />
+ <CheckBox default = {true} numCount={3} parent={this} originalStatus={this.props.titleFieldStatus} updateStatus={this.props.updateTitleStatus} title={Keys.TITLE} />
+ <CheckBox default = {true} numCount={3} parent={this} originalStatus={this.props.authorFieldStatus} updateStatus={this.props.updateAuthorStatus} title={Keys.AUTHOR} />
+ <CheckBox default = {true} numCount={3} parent={this} originalStatus={this.props.dataFieldStatus} updateStatus={this.props.updateDataStatus} title={Keys.DATA} />
</div>
);
}
diff --git a/src/client/views/search/SearchBox.scss b/src/client/views/search/SearchBox.scss
index 26a23c218..486ec9a93 100644
--- a/src/client/views/search/SearchBox.scss
+++ b/src/client/views/search/SearchBox.scss
@@ -69,6 +69,7 @@
.filter-collection{
display: inline-block;
+ width: 100%;
}
.field-title {
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 4ebd9c5e4..2ff960aeb 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -29,6 +29,7 @@ import { DocumentView } from '../nodes/DocumentView';
import { CollectionView } from '../collections/CollectionView';
import { CollectionPDFView } from '../collections/CollectionPDFView';
import { CollectionVideoView } from '../collections/CollectionVideoView';
+import { CollectionFilters } from './CollectionFilters';
export enum Keys {
TITLE = "title",
@@ -55,6 +56,8 @@ export class SearchBox extends React.Component {
@observable authorFieldStatus: boolean = true;
@observable dataFieldStatus: boolean = true;
@observable collectionStatus = false;
+ @observable collectionSelfStatus = true;
+ @observable collectionParentStatus = true;
constructor(props: Readonly<{}>) {
super(props);
@@ -79,6 +82,14 @@ export class SearchBox extends React.Component {
ToggleBar.Instance.resetToggle();
IconBar.Instance.selectAll();
FieldFilters.Instance.resetFieldFilters();
+ // console.log("field filters at end")
+ // console.log("title", this.titleFieldStatus, "author:", this.authorFieldStatus, "data:", this.dataFieldStatus)
+ // console.log("should be true, true, true\n")
+
+ CollectionFilters.Instance.resetCollectionFilters();
+ // console.log("collection filters at end")
+ // console.log("normal;", this.collectionStatus, "self:", this.collectionSelfStatus, "parent:", this.collectionParentStatus)
+ // console.log("should be fase, true, true")
}
@action.bound
@@ -207,10 +218,6 @@ export class SearchBox extends React.Component {
query = this.addCollectionFilter(query);
query = query.replace(/\s+/g, ' ').trim();
}
-
- //gets rid of any extra spaces that may have been added
- // query = query.replace(/\s+/g, ' ').trim();
-
return query;
}
@@ -238,8 +245,6 @@ export class SearchBox extends React.Component {
query = this.getFinalQuery(query);
- console.log(query);
-
//if there is no query there should be no result
if (query === "") {
results = [];
@@ -429,6 +434,40 @@ export class SearchBox extends React.Component {
this.collectionStatus = newStat;
}
+ @action.bound
+ updateSelfCollectionStatus(newStat: boolean) {
+ this.collectionSelfStatus = newStat;
+ }
+
+ @action.bound
+ updateParentCollectionStatus(newStat: boolean) {
+ this.collectionParentStatus = newStat;
+ }
+
+ getCollectionStatus() {
+ return this.collectionStatus;
+ }
+
+ getSelfCollectionStatus() {
+ return this.collectionSelfStatus;
+ }
+
+ getParentCollectionStatus() {
+ return this.collectionParentStatus;
+ }
+
+ getTitleStatus() {
+ return this.titleFieldStatus;
+ }
+
+ getAuthorStatus() {
+ return this.authorFieldStatus;
+ }
+
+ getDataStatus() {
+ return this.dataFieldStatus;
+ }
+
// Useful queries:
// Delegates of a document: {!join from=id to=proto_i}id:{protoId}
// Documents in a collection: {!join from=data_l to=id}id:{collectionProtoId} //id of collections prototype
@@ -466,11 +505,13 @@ export class SearchBox extends React.Component {
<IconBar />
</div>
<div className="filter-collection filter-div">
- <div className='collection-title'>Search in current collections</div>
- <CheckBox title={"limit to current collection"} parent={this} numCount={1} updateStatus={this.updateCollectionStatus} originalStatus={this.collectionStatus} />
+ <CollectionFilters
+ updateCollectionStatus = {this.updateCollectionStatus} updateParentCollectionStatus = {this.updateParentCollectionStatus} updateSelfCollectionStatus = {this.updateSelfCollectionStatus}
+ collectionStatus = {this.collectionStatus} collectionParentStatus = {this.collectionParentStatus} collectionSelfStatus = {this.collectionSelfStatus}/>
</div>
<div className="where-in-doc filter-div">
- <FieldFilters titleFieldStatus={this.titleFieldStatus} dataFieldStatus={this.dataFieldStatus} authorFieldStatus={this.authorFieldStatus}
+ <FieldFilters
+ titleFieldStatus={this.titleFieldStatus} dataFieldStatus={this.dataFieldStatus} authorFieldStatus={this.authorFieldStatus}
updateAuthorStatus={this.updateAuthorStatus} updateDataStatus={this.updateDataStatus} updateTitleStatus={this.updateTitleStatus} />
</div>
</div>