From 04fd1451fb33bba806f9fe406d51c13d8d4dd541 Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 16 Apr 2019 17:17:41 -0400 Subject: checking other search --- src/client/views/Main.scss | 39 ++++++++++++++++++++++++++++----------- src/client/views/Main.tsx | 3 +++ 2 files changed, 31 insertions(+), 11 deletions(-) (limited to 'src') diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss index 4373534b2..26284974a 100644 --- a/src/client/views/Main.scss +++ b/src/client/views/Main.scss @@ -1,5 +1,6 @@ @import "globalCssVariables"; @import "nodeModuleOverrides"; + html, body { width: 100%; @@ -7,9 +8,9 @@ body { overflow: auto; font-family: $sans-serif; margin: 0; - position:absolute; + position: absolute; top: 0; - left:0; + left: 0; } #dash-title { @@ -42,7 +43,7 @@ h1 { } .jsx-parser { - width:100% + width: 100% } p { @@ -80,6 +81,10 @@ button:hover { cursor: pointer; } +search { + background: $dark-color; +} + .clear-db-button { position: absolute; right: 45%; @@ -114,6 +119,7 @@ button:hover { position: absolute; bottom: 62px; left: 24px; + .toolbar-button { display: block; margin-bottom: 10px; @@ -125,6 +131,7 @@ button:hover { position: absolute; bottom: 24px; left: 24px; + label { background: $dark-color; color: $light-color; @@ -137,44 +144,53 @@ button:hover { cursor: pointer; transition: transform 0.2s; } + label p { padding-left: 10.5px; padding-top: 3px; } + label:hover { background: $main-accent; transform: scale(1.15); } + input { display: none; } + input:not(:checked)~#add-options-content { display: none; } + input:checked~label { transform: rotate(45deg); transition: transform 0.5s; cursor: pointer; } } + #root { overflow: visible; } + #main-div { - width:100%; - height:100%; - position:absolute; + width: 100%; + height: 100%; + position: absolute; top: 0; - left:0; + left: 0; overflow: scroll; } + #mainContent-div { - width:100%; - height:100%; - position:absolute; + width: 100%; + height: 100%; + position: absolute; top: 0; - left:0; + left: 0; } + #add-options-content { display: table; opacity: 1; @@ -189,6 +205,7 @@ button:hover { ul#add-options-list { list-style: none; padding: 0; + li { display: inline-block; padding: 0; diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 0469211fa..7d47c9932 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -262,6 +262,9 @@ export class Main extends React.Component { ,
, + +
hello
, +
]; -- cgit v1.2.3-70-g09d2 From 2181bc0f19b04a5c1a3e6e20206fc04a086995d2 Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 16 Apr 2019 17:28:56 -0400 Subject: attempting graphics --- src/client/views/Main.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 7d47c9932..92c7fa7dd 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -263,7 +263,7 @@ export class Main extends React.Component {
, -
hello
, +
,
-- cgit v1.2.3-70-g09d2 From 39bb878a32821d2e14110f4158471890234f4769 Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Mon, 29 Apr 2019 19:52:35 -0400 Subject: search UI --- src/client/views/Main.scss | 4 -- src/client/views/Main.tsx | 5 ++- src/client/views/SearchBox.scss | 64 +++++++++++++++++++++++++++++ src/client/views/SearchBox.tsx | 89 +++++++++++++++++++++++++++++++++++++++++ 4 files changed, 156 insertions(+), 6 deletions(-) create mode 100644 src/client/views/SearchBox.scss create mode 100644 src/client/views/SearchBox.tsx (limited to 'src') diff --git a/src/client/views/Main.scss b/src/client/views/Main.scss index 26284974a..bca75da47 100644 --- a/src/client/views/Main.scss +++ b/src/client/views/Main.scss @@ -81,10 +81,6 @@ button:hover { cursor: pointer; } -search { - background: $dark-color; -} - .clear-db-button { position: absolute; right: 45%; diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 92c7fa7dd..87eefe67f 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -38,6 +38,7 @@ import "./Main.scss"; import { MainOverlayTextBox } from './MainOverlayTextBox'; import { DocumentView } from './nodes/DocumentView'; import { PreviewCursor } from './PreviewCursor'; +import { SearchBox } from './SearchBox'; @observer @@ -263,9 +264,9 @@ export class Main extends React.Component {
, -
, +
, -
+
]; } diff --git a/src/client/views/SearchBox.scss b/src/client/views/SearchBox.scss new file mode 100644 index 000000000..e1a1de142 --- /dev/null +++ b/src/client/views/SearchBox.scss @@ -0,0 +1,64 @@ +@import "globalCssVariables"; + +.searchBox { + height: 32px; + //display: flex; + //padding: 4px; + -webkit-transition: width 0.4s ease-in-out; + transition: width 0.4s ease-in-out; + align-items: center; + + .submit-search { + display: inline-block; + text-align: right; + color: $dark-color; + -webkit-transition: right 0.4s; + transition: right 0.4s; + } + + .submit-search:hover { + color: $main-accent; + transform: scale(1.05); + cursor: pointer; + } + + input[type=text] { + width: 130px; + -webkit-transition: width 0.4s; + transition: width 0.4s; + position: absolute; + right: 100px; + } + + input[type=text]:focus { + width: 500px; + outline: 3px solid lightblue; + } + + .filter-button { + position: absolute; + right: 30px; + } +} + +.filter-form { + background: $dark-color; + height: 400px; + width: 400px; + position: relative; + right: 1px; + color: $light-color; + padding: 10px; + flex-direction: column; +} + +#header { + text-transform: uppercase; + letter-spacing: 2px; + font-size: 100%; + height: 40px; +} + +#option { + height: 20px; +} \ No newline at end of file diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx new file mode 100644 index 000000000..7f388719d --- /dev/null +++ b/src/client/views/SearchBox.tsx @@ -0,0 +1,89 @@ +import * as React from 'react'; +import { observer } from 'mobx-react'; +import { observable, action } from 'mobx'; +import { Utils } from '../../Utils'; +import { MessageStore } from '../../server/Message'; +import { Server } from '../Server'; +import "./SearchBox.scss"; +import { faSearch } from '@fortawesome/free-solid-svg-icons'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { library } from '@fortawesome/fontawesome-svg-core'; +import { actionFieldDecorator } from 'mobx/lib/internal'; + +library.add(faSearch); + +@observer +export class SearchBox extends React.Component { + @observable + searchString: string = ""; + + @observable private _open: boolean = false; + + @action.bound + onChange(e: React.ChangeEvent) { + this.searchString = e.target.value; + + } + + submitSearch = () => { + Utils.EmitCallback(Server.Socket, MessageStore.SearchFor, this.searchString, (results: string[]) => { + for (const result of results) { + console.log(result); + Utils.GetQueryVariable() + } + }); + } + + @action + handleClick = (e: Event): void => { + var className = (e.target as any).className; + var id = (e.target as any).id; + console.log(id); + //let imgPrev = document.getElementById("img_preview"); + console.log(className); + if (className !== "filter-button" && className !== "filter-form") { + console.log("false"); + this._open = false; + } + + } + + componentWillMount() { + document.addEventListener('mousedown', this.handleClick, false); + } + + componentWillUnmount() { + document.removeEventListener('mousedown', this.handleClick, false); + } + + @action + toggleDisplay = () => { + this._open = !this._open; + } + + render() { + return ( +
+
+ {/* + +
+
+
+ +
+ filter by collection, key, type of node +
+ +
+
+ + ); + } +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From df9fa3e362a6bdd616bc0b46ef9b425cfc5a010d Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 30 Apr 2019 16:17:39 -0400 Subject: before pull --- src/client/views/SearchBox.scss | 1 - src/fields/Document.ts | 15 +++++++-------- src/server/Search.ts | 38 ++++++++++++++++++++++++++++++++++++++ src/server/database.ts | 12 ++++++++++++ src/server/index.ts | 19 ++++++++++++++++--- 5 files changed, 73 insertions(+), 12 deletions(-) create mode 100644 src/server/Search.ts (limited to 'src') diff --git a/src/client/views/SearchBox.scss b/src/client/views/SearchBox.scss index e1a1de142..92363e681 100644 --- a/src/client/views/SearchBox.scss +++ b/src/client/views/SearchBox.scss @@ -9,7 +9,6 @@ align-items: center; .submit-search { - display: inline-block; text-align: right; color: $dark-color; -webkit-transition: right 0.4s; diff --git a/src/fields/Document.ts b/src/fields/Document.ts index 2797efc09..6f6533754 100644 --- a/src/fields/Document.ts +++ b/src/fields/Document.ts @@ -29,15 +29,14 @@ export class Document extends Field { } static FromJson(data: any, id: string, save: boolean): Document { let doc = new Document(id, save); - let fields = data as [string, string][]; - fields.forEach(pair => doc._proxies.set(pair[0], pair[1])); + let fields = data as { key: string, field: string }[]; + fields.forEach(pair => doc._proxies.set(pair.key, pair.field)); return doc; } - UpdateFromServer(data: [string, string][]) { - for (const key in data) { - const element = data[key]; - this._proxies.set(element[0], element[1]); + UpdateFromServer(data: { key: string, field: string }[]) { + for (const kv of data) { + this._proxies.set(kv.key, kv.field); } } @@ -448,9 +447,9 @@ export class Document extends Field { } ToJson() { - let fields: [string, string][] = []; + let fields: { key: string, field: string }[] = []; this._proxies.forEach((field, key) => - field && fields.push([key, field])); + field && fields.push({ key, field })); return { type: Types.Document, diff --git a/src/server/Search.ts b/src/server/Search.ts new file mode 100644 index 000000000..7d8602346 --- /dev/null +++ b/src/server/Search.ts @@ -0,0 +1,38 @@ +import * as rp from 'request-promise'; +import { Database } from './database'; + +export class Search { + public static Instance = new Search(); + private url = 'http://localhost:8983/solr/'; + + public updateDocument(document: any): rp.RequestPromise { + return rp.post(this.url + "dash/update/json/docs", { + headers: { 'content-type': 'application/json' }, + body: JSON.stringify(document) + }); + } + + public async search(query: string) { + const searchResults = JSON.parse(await rp.get(this.url + "dash/select", { + qs: { + q: query + } + })); + const fields = searchResults.response.docs; + const ids = fields.map((field: any) => field.id); + const docs = await Database.Instance.searchQuery(ids); + const docIds = docs.map((doc: any) => doc._id); + return docIds; + } + + public async clear() { + return rp.post(this.url + "dash/update", { + body: { + delete: { + query: "*:*" + } + }, + json: true + }); + } +} \ No newline at end of file diff --git a/src/server/database.ts b/src/server/database.ts index 5457e4dd5..d5905c7b3 100644 --- a/src/server/database.ts +++ b/src/server/database.ts @@ -72,6 +72,18 @@ export class Database { }); } + public searchQuery(ids: string[], collectionName = Database.DocumentsCollection): Promise { + return new Promise(resolve => { + this.db && this.db.collection(collectionName).find({ "data.field": { "$in": ids } }).toArray((err, docs) => { + if (err) { + console.log(err.message); + console.log(err.errmsg); + } + resolve(docs); + }); + }); + } + public print() { console.log("db says hi!"); } diff --git a/src/server/index.ts b/src/server/index.ts index 70a7d266c..cb4268a2d 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -11,6 +11,7 @@ import { ObservableMap } from 'mobx'; import * as passport from 'passport'; import * as path from 'path'; import * as request from 'request'; +import * as rp from 'request-promise'; import * as io from 'socket.io'; import { Socket } from 'socket.io'; import * as webpack from 'webpack'; @@ -22,7 +23,7 @@ import { getForgot, getLogin, getLogout, getReset, getSignup, postForgot, postLo import { DashUserModel } from './authentication/models/user_model'; import { Client } from './Client'; import { Database } from './database'; -import { MessageStore, Transferable } from "./Message"; +import { MessageStore, Transferable, Types } from "./Message"; import { RouteStore } from './RouteStore'; const app = express(); const config = require('../../webpack.config'); @@ -32,6 +33,7 @@ const serverPort = 4321; import expressFlash = require('express-flash'); import flash = require('connect-flash'); import c = require("crypto"); +import { Search } from './Search'; const MongoStore = require('connect-mongo')(session); const mongoose = require('mongoose'); @@ -120,6 +122,12 @@ app.get("/pull", (req, res) => // GETTERS +app.get("/search", async (req, res) => { + let query = req.query.query || "hello"; + let results = await Search.Instance.search(query); + res.send(results); +}); + // anyone attempting to navigate to localhost at this port will // first have to login addSecureRoute( @@ -234,14 +242,16 @@ server.on("connection", function (socket: Socket) { Utils.AddServerHandler(socket, MessageStore.DeleteAll, deleteFields); }); -function deleteFields() { - return Database.Instance.deleteAll(); +async function deleteFields() { + await Database.Instance.deleteAll(); + await Search.Instance.clear(); } async function deleteAll() { await Database.Instance.deleteAll(); await Database.Instance.deleteAll('sessions'); await Database.Instance.deleteAll('users'); + await Search.Instance.clear(); } function barReceived(guid: String) { @@ -260,6 +270,9 @@ function getFields([ids, callback]: [string[], (result: Transferable[]) => void] function setField(socket: Socket, newValue: Transferable) { Database.Instance.update(newValue.id, newValue, () => socket.broadcast.emit(MessageStore.SetField.Message, newValue)); + if (newValue.type === Types.Text) { + Search.Instance.updateDocument({ id: newValue.id, data: (newValue as any).data }); + } } server.listen(serverPort); -- cgit v1.2.3-70-g09d2 From b269ce7d85a9b83280d2b5b23299aa16e6cc5a92 Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 30 Apr 2019 19:59:38 -0400 Subject: confused but still goin --- src/client/views/SearchBox.tsx | 2 +- .../collections/collectionFreeForm/CollectionFreeFormView.tsx | 8 ++++++-- 2 files changed, 7 insertions(+), 3 deletions(-) (limited to 'src') diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index 7f388719d..7ceaf1da6 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -29,7 +29,7 @@ export class SearchBox extends React.Component { Utils.EmitCallback(Server.Socket, MessageStore.SearchFor, this.searchString, (results: string[]) => { for (const result of results) { console.log(result); - Utils.GetQueryVariable() + //Utils.GetQueryVariable(); } }); } diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 8647ded8a..08c28e76f 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -48,9 +48,13 @@ export class CollectionFreeFormView extends CollectionSubView { this.addDocument(newBox, false); } - public addDocument = (newBox: Document, allowDuplicates: boolean) => this.props.addDocument(this.bringToFront(newBox), false); + public addDocument = (newBox: Document, allowDuplicates: boolean) => { + this.props.addDocument(newBox, false); + this.bringToFront(newBox); + return true; + } - public selectDocuments = (docs: Document[]) => { + private selectDocuments = (docs: Document[]) => { SelectionManager.DeselectAll; docs.map(doc => DocumentManager.Instance.getDocumentView(doc)).filter(dv => dv).map(dv => SelectionManager.SelectDoc(dv!, true)); -- cgit v1.2.3-70-g09d2 From eed0866d6148dfdb29c3f87b42afe365231f258c Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 30 Apr 2019 21:47:03 -0400 Subject: i am CONFUSED --- src/client/views/SearchBox.tsx | 31 ++++++++++++++++++++++++------- src/server/Search.ts | 2 ++ 2 files changed, 26 insertions(+), 7 deletions(-) (limited to 'src') diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index 7ceaf1da6..0670360a2 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -9,6 +9,10 @@ import { faSearch } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { library } from '@fortawesome/fontawesome-svg-core'; import { actionFieldDecorator } from 'mobx/lib/internal'; +// const app = express(); +// import * as express from 'express'; +import { Search } from '../../server/Search'; + library.add(faSearch); @@ -26,12 +30,25 @@ export class SearchBox extends React.Component { } submitSearch = () => { - Utils.EmitCallback(Server.Socket, MessageStore.SearchFor, this.searchString, (results: string[]) => { - for (const result of results) { - console.log(result); - //Utils.GetQueryVariable(); - } - }); + // Utils.EmitCallback(Server.Socket, MessageStore.SearchFor, this.searchString, (results: string[]) => { + // for (const result of results) { + // console.log(result); + // //Utils.GetQueryVariable(); + // } + // }); + + let query = this.searchString; + console.log(query); + //something bad is happening here + let results = Search.Instance.search(query); + console.log(results); + + // app.get("/search", async (req, res) => { + // //let query = req.query.query || "hello"; + // let query = this.searchString; + // let results = await Search.Instance.search(query); + // res.send(results); + // }); } @action @@ -73,7 +90,7 @@ export class SearchBox extends React.Component { map(prop => )} */} -
+
diff --git a/src/server/Search.ts b/src/server/Search.ts index 7d8602346..8ae996e9e 100644 --- a/src/server/Search.ts +++ b/src/server/Search.ts @@ -13,6 +13,8 @@ export class Search { } public async search(query: string) { + console.log("____________________________"); + console.log(query); const searchResults = JSON.parse(await rp.get(this.url + "dash/select", { qs: { q: query -- cgit v1.2.3-70-g09d2 From 364396d9062381d72c618c5b9931267c6cc55c97 Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Mon, 6 May 2019 19:37:37 -0400 Subject: things happening --- src/client/views/SearchBox.tsx | 87 +++++++++++++++++++++++++++++------------ src/client/views/SearchItem.tsx | 34 ++++++++++++++++ 2 files changed, 95 insertions(+), 26 deletions(-) create mode 100644 src/client/views/SearchItem.tsx (limited to 'src') diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index 0670360a2..2fd809d9e 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -12,6 +12,9 @@ import { actionFieldDecorator } from 'mobx/lib/internal'; // const app = express(); // import * as express from 'express'; import { Search } from '../../server/Search'; +import * as rp from 'request-promise'; +import { Document } from '../../fields/Document'; +import { SearchItem } from './SearchItem'; library.add(faSearch); @@ -23,43 +26,74 @@ export class SearchBox extends React.Component { @observable private _open: boolean = false; + @observable + private _results: any; + + constructor(props: any) { + super(props); + let searchInput = document.getElementById("input"); + if (searchInput) { + searchInput.addEventListener("keydown", this.onKeyPress) + } + } + + //this is not working????? + @action + onKeyPress = (e: KeyboardEvent) => { + console.log('things happening') + //Number 13 is the "Enter" key on the keyboard + if (e.keyCode === 13) { + console.log("happi") + // Cancel the default action, if needed + e.preventDefault(); + // Trigger the button element with a click + let btn = document.getElementById("submit"); + if (btn) { + console.log("yesyesyes") + btn.click(); + } + } + } + @action.bound onChange(e: React.ChangeEvent) { this.searchString = e.target.value; + }; - } - - submitSearch = () => { - // Utils.EmitCallback(Server.Socket, MessageStore.SearchFor, this.searchString, (results: string[]) => { - // for (const result of results) { - // console.log(result); - // //Utils.GetQueryVariable(); - // } - // }); + submitSearch = async () => { let query = this.searchString; - console.log(query); - //something bad is happening here - let results = Search.Instance.search(query); - console.log(results); - - // app.get("/search", async (req, res) => { - // //let query = req.query.query || "hello"; - // let query = this.searchString; - // let results = await Search.Instance.search(query); - // res.send(results); - // }); + + let response = await rp.get('http://localhost:1050/search', { + qs: { + query + } + }); + + let results = JSON.parse(response); + + this._results = results; + + let doc = await Server.GetField(this._results[1]); + if (doc instanceof Document) { + console.log("doc"); + console.log(doc.Title); + } + + // console.log("results") + // console.log(results); + // console.log("type") + // console.log(results.type) + console.log(this._results); + + } @action handleClick = (e: Event): void => { var className = (e.target as any).className; var id = (e.target as any).id; - console.log(id); - //let imgPrev = document.getElementById("img_preview"); - console.log(className); if (className !== "filter-button" && className !== "filter-form") { - console.log("false"); this._open = false; } @@ -85,12 +119,13 @@ export class SearchBox extends React.Component { {/* -
+
diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx new file mode 100644 index 000000000..f030e011b --- /dev/null +++ b/src/client/views/SearchItem.tsx @@ -0,0 +1,34 @@ +import React = require("react"); +import { Document } from "../../fields/Document"; + +export interface SearchProps { + doc: Document; + //description: string; + //event: (e: React.MouseEvent) => void; +} + +// export interface SubmenuProps { +// description: string; +// subitems: ContextMenuProps[]; +// } + +// export interface ContextMenuItemProps { +// type: ContextMenuProps | SubmenuProps; +// } + + + +export class SearchItem extends React.Component { + + onClick = () => { + console.log("clicked search item"); + }; + + render() { + return ( +
+
{this.props.doc.Title}
+
+ ); + } +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From c3e613aebc056fd75bb1a5b3ac95f2367532b098 Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 7 May 2019 13:11:13 -0400 Subject: type issues?? --- src/client/views/SearchBox.tsx | 87 ++++++++++++++++++++++++++--------------- src/client/views/SearchItem.tsx | 2 +- 2 files changed, 56 insertions(+), 33 deletions(-) (limited to 'src') diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index 2fd809d9e..eb3cd56fd 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -15,6 +15,7 @@ import { Search } from '../../server/Search'; import * as rp from 'request-promise'; import { Document } from '../../fields/Document'; import { SearchItem } from './SearchItem'; +import { isString } from 'util'; library.add(faSearch); @@ -26,40 +27,41 @@ export class SearchBox extends React.Component { @observable private _open: boolean = false; - @observable - private _results: any; - - constructor(props: any) { - super(props); - let searchInput = document.getElementById("input"); - if (searchInput) { - searchInput.addEventListener("keydown", this.onKeyPress) - } - } - - //this is not working????? - @action - onKeyPress = (e: KeyboardEvent) => { - console.log('things happening') - //Number 13 is the "Enter" key on the keyboard - if (e.keyCode === 13) { - console.log("happi") - // Cancel the default action, if needed - e.preventDefault(); - // Trigger the button element with a click - let btn = document.getElementById("submit"); - if (btn) { - console.log("yesyesyes") - btn.click(); - } - } - } + //@observable + private _results: Document[] = []; + + // constructor(props: any) { + // super(props); + // let searchInput = document.getElementById("input"); + // if (searchInput) { + // // searchInput.addEventListener("keydown", this.onKeyPress) + // } + // } + + // //this is not working????? + // @action + // onKeyPress = (e: KeyboardEvent) => { + // console.log('things happening') + // //Number 13 is the "Enter" key on the keyboard + // if (e.keyCode === 13) { + // console.log("happi") + // // Cancel the default action, if needed + // e.preventDefault(); + // // Trigger the button element with a click + // let btn = document.getElementById("submit"); + // if (btn) { + // console.log("yesyesyes") + // btn.click(); + // } + // } + // } @action.bound onChange(e: React.ChangeEvent) { this.searchString = e.target.value; - }; + } + //@action submitSearch = async () => { let query = this.searchString; @@ -74,17 +76,38 @@ export class SearchBox extends React.Component { this._results = results; - let doc = await Server.GetField(this._results[1]); + let doc = await Server.GetField(results[1]); if (doc instanceof Document) { console.log("doc"); console.log(doc.Title); } + // weird things happening // console.log("results") // console.log(results); // console.log("type") // console.log(results.type) - console.log(this._results); + let temp: string = this._results[1].Id; + // console.log(this._results) + // console.log(this._results[1]) + + console.log(this._results[1].constructor.name) + + if (this._results[1] instanceof Document) { + console.log("is a doc") + } + + if (this._results[1]) { + console.log("is a string") + } + + console.log(temp); + let doc2 = await Server.GetField(temp); + console.log(doc2); + if (doc2 instanceof Document) { + console.log("doc2"); + console.log(doc2.Title); + } } @@ -122,7 +145,7 @@ export class SearchBox extends React.Component { {/* {this._items.filter(prop => prop.description.toLowerCase().indexOf(this._searchString.toLowerCase()) !== -1). map(prop => )} */} - {/* {this._results.map(doc => )} */} + {this._results.map(doc => )}
diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx index f030e011b..c8fd6457b 100644 --- a/src/client/views/SearchItem.tsx +++ b/src/client/views/SearchItem.tsx @@ -22,7 +22,7 @@ export class SearchItem extends React.Component { onClick = () => { console.log("clicked search item"); - }; + } render() { return ( -- cgit v1.2.3-70-g09d2 From 96d9bd38cb3ae6d59945d15071e1b346e4d0a8e2 Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 7 May 2019 14:38:23 -0400 Subject: hacky way of getting search to work --- src/client/views/SearchBox.scss | 52 ++++++++++++++++++++++++++++++++--------- src/client/views/SearchBox.tsx | 52 +++++++++++------------------------------ 2 files changed, 55 insertions(+), 49 deletions(-) (limited to 'src') diff --git a/src/client/views/SearchBox.scss b/src/client/views/SearchBox.scss index 92363e681..1aad13b2e 100644 --- a/src/client/views/SearchBox.scss +++ b/src/client/views/SearchBox.scss @@ -8,18 +8,7 @@ transition: width 0.4s ease-in-out; align-items: center; - .submit-search { - text-align: right; - color: $dark-color; - -webkit-transition: right 0.4s; - transition: right 0.4s; - } - .submit-search:hover { - color: $main-accent; - transform: scale(1.05); - cursor: pointer; - } input[type=text] { width: 130px; @@ -38,6 +27,19 @@ position: absolute; right: 30px; } + + .submit-search { + text-align: right; + color: $dark-color; + -webkit-transition: right 0.4s; + transition: right 0.4s; + } + + .submit-search:hover { + color: $main-accent; + transform: scale(1.05); + cursor: pointer; + } } .filter-form { @@ -60,4 +62,32 @@ #option { height: 20px; +} + +.search-item { + width: 500px; + height: 50px; + background: $light-color-secondary; + display: flex; + justify-content: left; + align-items: center; + transition: all 0.1s; + border-width: 0.11px; + border-style: none; + border-color: $intermediate-color; + border-bottom-style: solid; + padding: 10px; + white-space: nowrap; + font-size: 13px; +} + +.search-item:hover { + transition: all 0.1s; + background: $lighter-alt-accent; +} + +.search-title { + text-transform: uppercase; + text-align: left; + width: 8vw; } \ No newline at end of file diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index eb3cd56fd..eecd9c8bb 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -74,42 +74,19 @@ export class SearchBox extends React.Component { let results = JSON.parse(response); - this._results = results; - - let doc = await Server.GetField(results[1]); - if (doc instanceof Document) { - console.log("doc"); - console.log(doc.Title); - } - - // weird things happening - // console.log("results") - // console.log(results); - // console.log("type") - // console.log(results.type) - let temp: string = this._results[1].Id; - // console.log(this._results) - // console.log(this._results[1]) - - console.log(this._results[1].constructor.name) - - if (this._results[1] instanceof Document) { - console.log("is a doc") - } - - if (this._results[1]) { - console.log("is a string") - } - - console.log(temp); - let doc2 = await Server.GetField(temp); - console.log(doc2); - if (doc2 instanceof Document) { - console.log("doc2"); - console.log(doc2.Title); - } + //gets json result into a list of documents that can be used + this.getResults(results); + } + getResults = async (res: string[]) => { + let doc; + res.map(async result => { + doc = await Server.GetField(result); + if (doc instanceof Document) { + this._results.push(doc); + } + }); } @action @@ -143,10 +120,9 @@ export class SearchBox extends React.Component {
-- cgit v1.2.3-70-g09d2 From 500f75d10f82db4717cba968577f9421d901a17c Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 7 May 2019 15:51:00 -0400 Subject: things showing up --- src/client/views/SearchBox.tsx | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) (limited to 'src') diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index eecd9c8bb..0760578a8 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { observer } from 'mobx-react'; -import { observable, action } from 'mobx'; +import { observable, action, runInAction } from 'mobx'; import { Utils } from '../../Utils'; import { MessageStore } from '../../server/Message'; import { Server } from '../Server'; @@ -8,7 +8,6 @@ import "./SearchBox.scss"; import { faSearch } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { library } from '@fortawesome/fontawesome-svg-core'; -import { actionFieldDecorator } from 'mobx/lib/internal'; // const app = express(); // import * as express from 'express'; import { Search } from '../../server/Search'; @@ -26,8 +25,9 @@ export class SearchBox extends React.Component { searchString: string = ""; @observable private _open: boolean = false; + @observable private _resultsOpen: boolean = false; - //@observable + @observable private _results: Document[] = []; // constructor(props: any) { @@ -61,7 +61,7 @@ export class SearchBox extends React.Component { this.searchString = e.target.value; } - //@action + @action submitSearch = async () => { let query = this.searchString; @@ -71,20 +71,20 @@ export class SearchBox extends React.Component { query } }); - let results = JSON.parse(response); //gets json result into a list of documents that can be used this.getResults(results); + runInAction(() => { this._resultsOpen = true; }); } + @action getResults = async (res: string[]) => { - let doc; res.map(async result => { - doc = await Server.GetField(result); + const doc = await Server.GetField(result); if (doc instanceof Document) { - this._results.push(doc); + runInAction(() => this._results.push(doc)); } }); } @@ -120,7 +120,7 @@ export class SearchBox extends React.Component { -- cgit v1.2.3-70-g09d2 From 93d2214b84eaef61c9a9f980d24b5c1addbd67dc Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 7 May 2019 16:26:51 -0400 Subject: things working --- src/client/views/SearchBox.scss | 6 ++++++ src/client/views/SearchBox.tsx | 46 ++++++++++++----------------------------- src/client/views/SearchItem.tsx | 2 +- 3 files changed, 20 insertions(+), 34 deletions(-) (limited to 'src') diff --git a/src/client/views/SearchBox.scss b/src/client/views/SearchBox.scss index 1aad13b2e..f4fc0029e 100644 --- a/src/client/views/SearchBox.scss +++ b/src/client/views/SearchBox.scss @@ -64,6 +64,12 @@ height: 20px; } +.results { + top: 300px; + display: flex; + flex-direction: column; +} + .search-item { width: 500px; height: 50px; diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index 0760578a8..ff215efab 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -15,6 +15,7 @@ import * as rp from 'request-promise'; import { Document } from '../../fields/Document'; import { SearchItem } from './SearchItem'; import { isString } from 'util'; +import { constant } from 'async'; library.add(faSearch); @@ -30,40 +31,15 @@ export class SearchBox extends React.Component { @observable private _results: Document[] = []; - // constructor(props: any) { - // super(props); - // let searchInput = document.getElementById("input"); - // if (searchInput) { - // // searchInput.addEventListener("keydown", this.onKeyPress) - // } - // } - - // //this is not working????? - // @action - // onKeyPress = (e: KeyboardEvent) => { - // console.log('things happening') - // //Number 13 is the "Enter" key on the keyboard - // if (e.keyCode === 13) { - // console.log("happi") - // // Cancel the default action, if needed - // e.preventDefault(); - // // Trigger the button element with a click - // let btn = document.getElementById("submit"); - // if (btn) { - // console.log("yesyesyes") - // btn.click(); - // } - // } - // } - @action.bound onChange(e: React.ChangeEvent) { this.searchString = e.target.value; + console.log(this.searchString) } @action submitSearch = async () => { - + runInAction(() => this._results = []); let query = this.searchString; let response = await rp.get('http://localhost:1050/search', { @@ -112,19 +88,23 @@ export class SearchBox extends React.Component { this._open = !this._open; } + enter = (e: React.KeyboardEvent) => { + if (e.key === "Enter") { + this.submitSearch(); + } + } + render() { return (
- {/* -
+
+ {this._results.map(result => )} +
diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx index c8fd6457b..6021c0736 100644 --- a/src/client/views/SearchItem.tsx +++ b/src/client/views/SearchItem.tsx @@ -21,7 +21,7 @@ export interface SearchProps { export class SearchItem extends React.Component { onClick = () => { - console.log("clicked search item"); + console.log("document clicked: ", this.props.doc); } render() { -- cgit v1.2.3-70-g09d2 From 11ab63f6c91093951fdc293c3d67e63073fb2f4c Mon Sep 17 00:00:00 2001 From: Monika Hedman Date: Tue, 7 May 2019 17:42:37 -0400 Subject: navigate to searched doc --- src/client/util/DocumentManager.ts | 30 +++++++++++++++++++++++++++++- src/client/views/Main.tsx | 2 +- src/client/views/SearchBox.tsx | 2 +- src/client/views/SearchItem.tsx | 16 ++-------------- src/client/views/nodes/LinkBox.tsx | 23 +---------------------- 5 files changed, 34 insertions(+), 39 deletions(-) (limited to 'src') diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts index 69964e2c9..3151bcfb5 100644 --- a/src/client/util/DocumentManager.ts +++ b/src/client/util/DocumentManager.ts @@ -1,8 +1,10 @@ import { computed, observable } from 'mobx'; import { DocumentView } from '../views/nodes/DocumentView'; import { Doc } from '../../new_fields/Doc'; -import { FieldValue, Cast } from '../../new_fields/Types'; +import { FieldValue, Cast, NumCast } from '../../new_fields/Types'; import { listSpec } from '../../new_fields/Schema'; +import { undoBatch } from './UndoManager'; +import { CollectionDockingView } from '../views/collections/CollectionDockingView'; export class DocumentManager { @@ -87,4 +89,30 @@ export class DocumentManager { return pairs; }, [] as { a: DocumentView, b: DocumentView, l: Doc }[]); } + + @undoBatch + public jumpToDocument = async (doc: Doc): Promise => { + let docView = DocumentManager.Instance.getDocumentView(doc); + if (docView) { + docView.props.focus(docView.props.Document); + } else { + const contextDoc = await Cast(doc.annotationOn, Doc); + if (!contextDoc) { + CollectionDockingView.Instance.AddRightSplit(Doc.MakeDelegate(doc)); + } else { + const page = NumCast(doc.page, undefined); + const curPage = NumCast(contextDoc.curPage, undefined); + if (page !== curPage) { + contextDoc.curPage = page; + } + let contextView = DocumentManager.Instance.getDocumentView(contextDoc); + if (contextView) { + contextDoc.panTransformType = "Ease"; + contextView.props.focus(contextDoc); + } else { + CollectionDockingView.Instance.AddRightSplit(contextDoc); + } + } + } + } } \ No newline at end of file diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index 677902c5b..c9d5c395c 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -267,7 +267,7 @@ export class Main extends React.Component {
,
, -
+
]; diff --git a/src/client/views/SearchBox.tsx b/src/client/views/SearchBox.tsx index a52598f4c..827d468df 100644 --- a/src/client/views/SearchBox.tsx +++ b/src/client/views/SearchBox.tsx @@ -17,6 +17,7 @@ import { constant } from 'async'; import { DocServer } from '../DocServer'; import { Doc } from '../../new_fields/Doc'; import { Id } from '../../new_fields/RefField'; +import { DocumentManager } from '../util/DocumentManager'; library.add(faSearch); @@ -35,7 +36,6 @@ export class SearchBox extends React.Component { @action.bound onChange(e: React.ChangeEvent) { this.searchString = e.target.value; - console.log(this.searchString) } @action diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx index 82cb5404c..81da7ebd2 100644 --- a/src/client/views/SearchItem.tsx +++ b/src/client/views/SearchItem.tsx @@ -1,27 +1,15 @@ import React = require("react"); import { Doc } from "../../new_fields/Doc"; +import { DocumentManager } from "../util/DocumentManager"; export interface SearchProps { doc: Doc; - //description: string; - //event: (e: React.MouseEvent) => void; } -// export interface SubmenuProps { -// description: string; -// subitems: ContextMenuProps[]; -// } - -// export interface ContextMenuItemProps { -// type: ContextMenuProps | SubmenuProps; -// } - - - export class SearchItem extends React.Component { onClick = () => { - console.log("document clicked: ", this.props.doc); + DocumentManager.Instance.jumpToDocument(this.props.doc) } render() { diff --git a/src/client/views/nodes/LinkBox.tsx b/src/client/views/nodes/LinkBox.tsx index 08cfa590b..611cb66b6 100644 --- a/src/client/views/nodes/LinkBox.tsx +++ b/src/client/views/nodes/LinkBox.tsx @@ -31,28 +31,7 @@ export class LinkBox extends React.Component { @undoBatch onViewButtonPressed = async (e: React.PointerEvent): Promise => { e.stopPropagation(); - let docView = DocumentManager.Instance.getDocumentView(this.props.pairedDoc); - if (docView) { - docView.props.focus(docView.props.Document); - } else { - const contextDoc = await Cast(this.props.pairedDoc.annotationOn, Doc); - if (!contextDoc) { - CollectionDockingView.Instance.AddRightSplit(Doc.MakeDelegate(this.props.pairedDoc)); - } else { - const page = NumCast(this.props.pairedDoc.page, undefined); - const curPage = NumCast(contextDoc.curPage, undefined); - if (page !== curPage) { - contextDoc.curPage = page; - } - let contextView = DocumentManager.Instance.getDocumentView(contextDoc); - if (contextView) { - contextDoc.panTransformType = "Ease"; - contextView.props.focus(contextDoc); - } else { - CollectionDockingView.Instance.AddRightSplit(contextDoc); - } - } - } + DocumentManager.Instance.jumpToDocument(this.props.pairedDoc); } onEditButtonPressed = (e: React.PointerEvent): void => { -- cgit v1.2.3-70-g09d2