From 225d2b6a8c707e530288404306e6af45137e6608 Mon Sep 17 00:00:00 2001 From: Braun Patrik Date: Mon, 9 May 2016 19:14:33 +0200 Subject: [PATCH] creating content wrapper for search preparation --- backend/middlewares/GalleryMWs.ts | 9 +++- backend/routes/GalleryRouter.ts | 11 +++- common/entities/ConentWrapper.ts | 13 +++++ common/entities/SearchResult.ts | 12 +++++ frontend/app/gallery/gallery.component.html | 6 +-- frontend/app/gallery/gallery.component.ts | 14 +----- frontend/app/gallery/gallery.service.ts | 35 +++++++++++-- .../gallery/grid/grid.gallery.component.html | 3 +- .../gallery/grid/grid.gallery.component.ts | 50 +++++++++++++------ frontend/index.ejs | 2 +- 10 files changed, 117 insertions(+), 38 deletions(-) create mode 100644 common/entities/ConentWrapper.ts create mode 100644 common/entities/SearchResult.ts diff --git a/backend/middlewares/GalleryMWs.ts b/backend/middlewares/GalleryMWs.ts index 51f45411..03814897 100644 --- a/backend/middlewares/GalleryMWs.ts +++ b/backend/middlewares/GalleryMWs.ts @@ -6,6 +6,7 @@ import {Directory} from "../../common/entities/Directory"; import {Config} from "../config/Config"; import {ObjectManagerRepository} from "../model/ObjectManagerRepository"; import {AutoCompleteItem} from "../../common/entities/AutoCompleteItem"; +import {ContentWrapper} from "../../common/entities/ConentWrapper"; export class GalleryMWs { @@ -26,7 +27,7 @@ export class GalleryMWs { if (err || !directory) { return next(new Error(ErrorCodes.GENERAL_ERROR, err)); } - req.resultPipe = directory; + req.resultPipe = new ContentWrapper(directory, null); return next(); }); } @@ -52,6 +53,12 @@ export class GalleryMWs { return next(new Error(ErrorCodes.GENERAL_ERROR)); } + + public static instantSearch(req:Request, res:Response, next:NextFunction) { + //TODO: implement + return next(new Error(ErrorCodes.GENERAL_ERROR)); + } + public static autocomplete(req:Request, res:Response, next:NextFunction) { if (!(req.params.text)) { return next(); diff --git a/backend/routes/GalleryRouter.ts b/backend/routes/GalleryRouter.ts index cb47691e..2124463e 100644 --- a/backend/routes/GalleryRouter.ts +++ b/backend/routes/GalleryRouter.ts @@ -13,6 +13,7 @@ export class GalleryRouter { this.addDirectoryList(); this.addSearch(); + this.addInstantSearch(); this.addAutoComplete(); } @@ -43,13 +44,21 @@ export class GalleryRouter { }; private addSearch() { - this.app.get("/api/gallery/search", + this.app.get("/api/gallery/search/:text", AuthenticationMWs.authenticate, GalleryMWs.search, RenderingMWs.renderResult ); }; + private addInstantSearch() { + this.app.get("/api/gallery/instant-search/:text", + AuthenticationMWs.authenticate, + GalleryMWs.instantSearch, + RenderingMWs.renderResult + ); + }; + private addAutoComplete() { this.app.get("/api/gallery/autocomplete/:text", AuthenticationMWs.authenticate, diff --git a/common/entities/ConentWrapper.ts b/common/entities/ConentWrapper.ts new file mode 100644 index 00000000..f834e170 --- /dev/null +++ b/common/entities/ConentWrapper.ts @@ -0,0 +1,13 @@ +import {Directory} from "./Directory"; +import {SearchResult} from "./SearchResult"; +export class ContentWrapper { + + public directory:Directory; + public searchResult:SearchResult; + + constructor(directory:Directory = null, searchResult:SearchResult = null) { + this.directory = directory; + this.searchResult = searchResult; + } + +} \ No newline at end of file diff --git a/common/entities/SearchResult.ts b/common/entities/SearchResult.ts new file mode 100644 index 00000000..7f582cb1 --- /dev/null +++ b/common/entities/SearchResult.ts @@ -0,0 +1,12 @@ +import {Directory} from "./Directory"; +import {Photo} from "./Photo"; +export class SearchResult { + + public directories:Array; + public photos:Array; + + constructor(directories:Array, photos:Array) { + this.directories = directories; + this.photos = photos; + } +} \ No newline at end of file diff --git a/frontend/app/gallery/gallery.component.html b/frontend/app/gallery/gallery.component.html index 3246aa67..a9b6fdb1 100644 --- a/frontend/app/gallery/gallery.component.html +++ b/frontend/app/gallery/gallery.component.html @@ -3,10 +3,10 @@
-
-
+
+
- +
\ No newline at end of file diff --git a/frontend/app/gallery/gallery.component.ts b/frontend/app/gallery/gallery.component.ts index 3feb9423..891d13c4 100644 --- a/frontend/app/gallery/gallery.component.ts +++ b/frontend/app/gallery/gallery.component.ts @@ -4,8 +4,6 @@ import {Component, OnInit} from "@angular/core"; import {AuthenticationService} from "../model/network/authentication.service.ts"; import {Router, RouteParams} from "@angular/router-deprecated"; import {GalleryService} from "./gallery.service"; -import {Directory} from "../../../common/entities/Directory"; -import {Message} from "../../../common/entities/Message"; import {GalleryDirectoryComponent} from "./directory/directory.gallery.component"; import {GalleryGridComponent} from "./grid/grid.gallery.component"; import {FrameComponent} from "../frame/frame.component"; @@ -24,8 +22,6 @@ import {GallerySearchComponent} from "./search/search.gallery.component"; }) export class GalleryComponent implements OnInit { - currentDirectory:Directory = new Directory(); - constructor(private _galleryService:GalleryService, private _params:RouteParams, @@ -43,14 +39,8 @@ export class GalleryComponent implements OnInit { console.log(this._params); console.log(directoryName); directoryName = directoryName ? directoryName : ""; - this._galleryService.getDirectory(directoryName).then((message:Message) => { - if (message.error) { - //TODO: implement - return; - } - - this.currentDirectory = message.result; - }); + + this._galleryService.getDirectory(directoryName); } diff --git a/frontend/app/gallery/gallery.service.ts b/frontend/app/gallery/gallery.service.ts index 5b7395f5..fa54886d 100644 --- a/frontend/app/gallery/gallery.service.ts +++ b/frontend/app/gallery/gallery.service.ts @@ -3,16 +3,45 @@ import {Injectable} from "@angular/core"; import {NetworkService} from "../model/network/network.service.ts"; import {Message} from "../../../common/entities/Message"; -import {Directory} from "../../../common/entities/Directory"; +import {ContentWrapper} from "../../../common/entities/ConentWrapper"; @Injectable() export class GalleryService { + public content:ContentWrapper; + constructor(private _networkService:NetworkService) { + this.content = new ContentWrapper(); } - public getDirectory(directoryName:string):Promise> { - return this._networkService.getJson("/gallery/content/" + directoryName); + public getDirectory(directoryName:string):Promise> { + return this._networkService.getJson("/gallery/content/" + directoryName).then( + (message:Message) => { + if (!message.error && message.result) { + this.content = message.result; + } + return message; + }); + } + + public search(text:string):Promise> { + return this._networkService.getJson("/gallery/search/" + text).then( + (message:Message) => { + if (!message.error && message.result) { + this.content = message.result; + } + return message; + }); + } + + public instantSearch(text:string):Promise> { + return this._networkService.getJson("/gallery/instant-search/" + text).then( + (message:Message) => { + if (!message.error && message.result) { + this.content = message.result; + } + return message; + }); } } diff --git a/frontend/app/gallery/grid/grid.gallery.component.html b/frontend/app/gallery/grid/grid.gallery.component.html index 7d26fec7..7ccbb3f3 100644 --- a/frontend/app/gallery/grid/grid.gallery.component.html +++ b/frontend/app/gallery/grid/grid.gallery.component.html @@ -1,7 +1,6 @@ -
+
{ - if (this.gridPhotoQL.length < this.photosToRender.length) { - return; - } - if (this.renderedConteinerWidth != this.getContainerWidth()) { - this.renderPhotos(); - } - }); + /* this.gridPhotoQL.changes.subscribe( + (x)=> { + console.log("changed"); + if (!this.directory || this.gridPhotoQL.length < this.directory.photos.length) { + console.log("bad"); + console.log(this.directory ? this.gridPhotoQL.length + " < "+this.directory.photos.length : "no dir"); + return; + } + if (this.renderedContainerWidth != this.getContainerWidth()) { + this.renderPhotos(); + } + }, + (err) => { + console.log('Error: %s', err); + }, + () =>{ + console.log('Completed'); + } + ); */ + + + setImmediate(() => { + this.renderPhotos(); + }); } - private renderedConteinerWidth = 0; + + private renderedContainerWidth = 0; private renderPhotos() { + if (this.getContainerWidth() == 0) { + return; + } let maxRowHeight = window.innerHeight / this.MIN_ROW_COUNT; let minRowHeight = window.innerHeight / this.MAX_ROW_COUNT; let containerWidth = this.getContainerWidth(); - this.renderedConteinerWidth = containerWidth; + this.renderedContainerWidth = containerWidth; this.photosToRender = []; let i = 0; while (i < this.directory.photos.length) { - let photoRowBuilder = new GridRowBuilder(this.directory.photos, i, this.IMAGE_MARGIN, this.getContainerWidth()); + let photoRowBuilder = new GridRowBuilder(this.directory.photos, i, this.IMAGE_MARGIN, containerWidth); photoRowBuilder.addPhotos(this.TARGET_COL_COUNT); photoRowBuilder.adjustRowHeightBetween(minRowHeight, maxRowHeight); @@ -87,9 +110,6 @@ export class GalleryGridComponent implements OnChanges,AfterViewInit { } } - onResize() { - this.renderPhotos(); - } private getContainerWidth():number { if (!this.gridContainer) { diff --git a/frontend/index.ejs b/frontend/index.ejs index 4a023843..5ca8c6dc 100644 --- a/frontend/index.ejs +++ b/frontend/index.ejs @@ -11,7 +11,7 @@ crossorigin="anonymous"> - + Loading...