Difference between revisions of "FRM PR"

From mn/ifi/inf5750
Jump to: navigation, search
 
(6 intermediate revisions by one other user not shown)
Line 2: Line 2:
 
===Status===
 
===Status===
 
MERGET
 
MERGET
===PQ===
+
===PR===
 +
<pre>
 
  The following changes since commit 1e6ce2f50c69ca191a07aaad996f4deb464880f8:
 
  The following changes since commit 1e6ce2f50c69ca191a07aaad996f4deb464880f8:
 
   
 
   
 
   Fixed map  (pair programming) (2015-11-12 14:11:13 +0100)
 
   Fixed map  (pair programming) (2015-11-12 14:11:13 +0100)
 
   
 
   
are available in the git repository at:
+
are available in the git repository at:
 
   
 
   
 
   gitolite@git.uio.no:u/erikhf/frm.git search
 
   gitolite@git.uio.no:u/erikhf/frm.git search
 
   
 
   
for you to fetch changes up to 2cae79a5fb719d73b248913fa7bf502dc47d8bfa:
+
for you to fetch changes up to 2cae79a5fb719d73b248913fa7bf502dc47d8bfa:
 
   
 
   
 
   [search] Code cleanup (2015-11-14 15:33:39 +0100)
 
   [search] Code cleanup (2015-11-14 15:33:39 +0100)
Line 27: Line 28:
 
       Merge branch 'master' into search
 
       Merge branch 'master' into search
 
       [search] Code cleanup
 
       [search] Code cleanup
 
+
 
   package.json                          |  1 +
 
   package.json                          |  1 +
 
   src/components/app.ts                  |  4 +--
 
   src/components/app.ts                  |  4 +--
Line 154: Line 155:
 
  +++ b/src/components/search/search.html
 
  +++ b/src/components/search/search.html
 
  @@ -1 +1,19 @@
 
  @@ -1 +1,19 @@
  -<div style="width: 500px; height: 50px; background: #ff647c; ">Søkefelt! </div>
+
  - <div style="width: 500px; height: 50px; background: #ff647c; ">Søkefelt! </div>
 
  \ No newline at end of file
 
  \ No newline at end of file
 
  +
 
  +
Line 224: Line 225:
 
     <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
 
     <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
 
     <link rel="stylesheet" type="text/css" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
 
     <link rel="stylesheet" type="text/css" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">
 +
</pre>
 +
 +
==#2==
 +
===Status===
 +
MERGET
 +
===PR===
 +
<pre>
 +
  The following changes since commit 2cae79a5fb719d73b248913fa7bf502dc47d8bfa:
 +
 +
    [search] Code cleanup (2015-11-14 15:33:39 +0100)
 +
 +
  are available in the git repository at:
 +
 +
    gitolite@git.uio.no:u/erikhf/frm.git search
 +
 +
  for you to fetch changes up to 42930dd2cd2a8d6ad50eea592ebe888c8db28371:
 +
 +
    [search] Styling the search input and results (2015-11-15 16:30:21 +0100)
 +
 +
  ----------------------------------------------------------------
 +
  Erik Haider Forsén (3):
 +
        [search] Make search result clickable
 +
        [search] Moved styles to separate css file
 +
        [search] Styling the search input and results
 +
 +
    src/components/search/search.css  | 52 +++++++++++++++++++++++++++++++++++++++
 +
    src/components/search/search.html | 20 ++++++++-------
 +
    src/components/search/search.ts  |  8 ++++--
 +
    3 files changed, 69 insertions(+), 11 deletions(-)
 +
    create mode 100644 src/components/search/search.css
 +
 +
  diff --git a/src/components/search/search.css b/src/components/search/search.css
 +
  new file mode 100644
 +
  index 0000000..2344396
 +
  --- /dev/null
 +
  +++ b/src/components/search/search.css
 +
  @@ -0,0 +1,52 @@
 +
  +.search div{
 +
  +    position: relative;
 +
  +}
 +
  +
 +
  +.search img{
 +
  +    width: 20px;
 +
  +    position: absolute;
 +
  +}
 +
  +
 +
  +.search li{
 +
  +    padding: 0.5em 0.5em 0.5em 0;
 +
  +    float: none;
 +
  +}
 +
  +
 +
  +.search ul {
 +
  +    display: block;
 +
  +    position: absolute;
 +
  +    top: 100%;
 +
  +    left: 0;
 +
  +    z-index: 1000;
 +
  +    float: left;
 +
  +    min-width: 160px;
 +
  +    padding: 5px 0;
 +
  +    margin: 4px 0 0;
 +
  +    font-size: 14px;
 +
  +    text-align: left;
 +
  +    list-style: none;
 +
  +    background-color: #fff;
 +
  +    -webkit-background-clip: padding-box;
 +
  +    background-clip: padding-box;
 +
  +    border: 1px solid #ccc;
 +
  +    border: 1px solid rgba(0, 0, 0, .15);
 +
  +    border-radius: 4px;
 +
  +    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 +
  +    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 +
  +}
 +
  +
 +
  +.results > li > a{
 +
  +    display: block;
 +
  +    padding: 3px 20px;
 +
  +    clear: both;
 +
  +    font-weight: 400;
 +
  +    line-height: 1.42857143;
 +
  +    color: #333;
 +
  +    white-space: nowrap
 +
  +}
 +
  +
 +
  +.results > li > a:focus, .results > li > a:hover {
 +
  +    color: #262626;
 +
  +    text-decoration: none;
 +
  +    background-color: #f5f5f5
 +
  +}
 +
  diff --git a/src/components/search/search.html b/src/components/search/search.html
 +
  index 2d6495f..bae546b 100644
 +
  --- a/src/components/search/search.html
 +
  +++ b/src/components/search/search.html
 +
  @@ -1,5 +1,4 @@
 +
  -
 +
  -    <section class="form-group">
 +
  +<div class="search clearfix">
 +
            <label class="sr-only" for="livesearch">Search</label>
 +
            <input
 +
                    mou-live-search
 +
  @@ -7,13 +6,16 @@
 +
                    (loading)="loading = $event"
 +
                    type="text"
 +
                    autofocus
 +
  +                class="form-control"
 +
                    id="livesearch">
 +
  -        <img style="width: 20px; position: absolute;"
 +
  -            [hidden]="!loading"
 +
  +        <img [hidden]="!loading"
 +
                src="https://www.brown.edu/sites/default/themes/pawtuxet/img/loader-larger.gif">
 +
  -    </section>
 +
  -    <section>
 +
  -        <div *ng-for="#orgunit of orgunits" style="padding: 0.5em 0.5em 0.5em 0;">
 +
  -            <p>{{orgunit.name}}</p>
 +
  +
 +
  +        <div [hidden]="!orgunits.length">
 +
  +            <ul class="results" >
 +
  +                <li *ng-for="#orgunit of orgunits" (click)="getMoreInfo(orgunit)">
 +
  +                    <a href="#">{{orgunit.name}}<br/><span>{{orgunit.lastUpdated}}</span></a>
 +
  +                </li>
 +
  +            </ul>
 +
            </div>
 +
  -    </section>
 +
  +</div>
 +
  diff --git a/src/components/search/search.ts b/src/components/search/search.ts
 +
  index 951c866..d9d90ae 100644
 +
  --- a/src/components/search/search.ts
 +
  +++ b/src/components/search/search.ts
 +
  @@ -4,14 +4,18 @@ import {LiveSearch} from "./livesearch";
 +
    @Component({
 +
        selector: 'mou-search',
 +
        directives: [CORE_DIRECTIVES, LiveSearch],
 +
  -    templateUrl: './components/search/search.html'
 +
  +    templateUrl: './components/search/search.html',
 +
  +    styleUrls: ['./components/search/search.css']
 +
    })
 +
    export class Search {
 +
        orgunits: Array<any> = [];
 +
        loading: boolean = false;
 +
   
 +
  -    constructor(){
 +
  +    getMoreInfo(orgunit){
 +
  +        console.log(orgunit.id);
 +
        }
 +
  +
 +
  +
 +
    }</pre>
 +
 +
== #3 ==
 +
 +
=== Status ===
 +
Not yet viewed<pre>
 +
The following changes since commit 1e6ce2f50c69ca191a07aaad996f4deb464880f8:
 +
 +
  Fixed map  (pair programming) (2015-11-12 14:11:13 +0100)
 +
 +
are available in the git repository at:
 +
 +
  gitolite@git.uio.no:u/erikhf/frm.git map
 +
 +
for you to fetch changes up to dd095993096b96f042dcaa1103b7eb5aeeffb3be:
 +
 +
  Added "this is you" marker (2015-11-19 09:56:26 +0100)
 +
 +
----------------------------------------------------------------
 +
Julie Hill Roa (3):
 +
      Added "this is you" marker
 +
      Added "this is you" marker
 +
      Added "this is you" marker
 +
 +
src/components/map/map.ts | 88 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-----
 +
1 file changed, 83 insertions(+), 5 deletions(-)</pre><pre>
 +
</pre>

Latest revision as of 10:10, 19 November 2015

#1

Status

MERGET

PR

 The following changes since commit 1e6ce2f50c69ca191a07aaad996f4deb464880f8:
 
  Fixed map  (pair programming) (2015-11-12 14:11:13 +0100)
 
 are available in the git repository at:
 
  gitolite@git.uio.no:u/erikhf/frm.git search
 
 for you to fetch changes up to 2cae79a5fb719d73b248913fa7bf502dc47d8bfa:
 
  [search] Code cleanup (2015-11-14 15:33:39 +0100)
 
 ----------------------------------------------------------------
 Erik Haider Forsén (10):
      [search] experimenting with pipes
      semi working live search
      No longer needed as we're using the query functionality in the API.
      Modified to query the api with the search string
      [search] fixed api query, live/dynamic search is now working (verified on dhis-live platform)
      [apiService] created a service for getting the API URL
      Merge branch 'master' into search
      Revert "[apiService] created a service for getting the API URL"
      Merge branch 'master' into search
      [search] Code cleanup
 
  package.json                           |  1 +
  src/components/app.ts                  |  4 +--
  src/components/search/SearchService.ts | 21 +++++++++++++++
  src/components/search/livesearch.ts    | 47 ++++++++++++++++++++++++++++++++++
  src/components/search/search.html      | 20 ++++++++++++++-
  src/components/search/search.ts        | 13 +++++++---
  src/index.html                         |  5 +++-
  7 files changed, 103 insertions(+), 8 deletions(-)
  create mode 100644 src/components/search/SearchService.ts
  create mode 100644 src/components/search/livesearch.ts
 
 diff --git a/package.json b/package.json
 index 077cd86..aaef61f 100644
 --- a/package.json
 +++ b/package.json
 @@ -15,6 +15,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
 +    "@reactivex/rxjs": "^5.0.0-alpha.10",
     "angular2": "2.0.0-alpha.44",
     "systemjs": "0.19.2"
   },
 diff --git a/src/components/app.ts b/src/components/app.ts
 index cb9479e..7feefc3 100644
 --- a/src/components/app.ts
 +++ b/src/components/app.ts
 @@ -1,5 +1,5 @@
 import {HTTP_PROVIDERS} from 'angular2/http';
 -import {Component, View, bootstrap, provide} from 'angular2/angular2';
 +import {Component, View, bootstrap, provide, ELEMENT_PROBE_PROVIDERS} from 'angular2/angular2';
 import {Map} from './map/map';
 import {Search} from "./search/search";
 import {Filter} from "./filter/filter";
 @@ -18,4 +18,4 @@ class App {
  
 }
 
 -bootstrap(App,[HTTP_PROVIDERS]);
 \ No newline at end of file
 +bootstrap(App,[HTTP_PROVIDERS, ELEMENT_PROBE_PROVIDERS]);
 diff --git a/src/components/search/SearchService.ts b/src/components/search/SearchService.ts
 new file mode 100644
 index 0000000..c17203d
 --- /dev/null
 +++ b/src/components/search/SearchService.ts
 @@ -0,0 +1,21 @@
 +import {provide, Injectable} from 'angular2/angular2';
 +import {Http} from 'angular2/http';
 +import * as Rx from '@reactivex/rxjs/dist/cjs/Rx';
 +
 +@Injectable()
 +export class SearchService {
 +
 +    constructor(public http: Http){
 +
 +    }
 +    search(query: string): Rx.Observable<any[]>{
 +        return this.http.get(dhisAPI + "/api/organisationUnits?paging=false&filter=name:like:" + query)
 +            .map(res=>res.json())
 +            .map(res => res.organisationUnits)
 +            .filter(orgunits => orgunits);
 +    }
 +}
 +
 +export var SEARCH_PROVIDERS: Array<any> = [
 +    provide(SearchService, {useClass: SearchService})
 +];
 diff --git a/src/components/search/livesearch.ts b/src/components/search/livesearch.ts
 new file mode 100644
 index 0000000..0158b24
 --- /dev/null
 +++ b/src/components/search/livesearch.ts
 @@ -0,0 +1,47 @@
 +import {Directive, View, EventEmitter, ElementRef} from 'angular2/angular2';
 +
 +// RxJs
 +import * as Rx from '@reactivex/rxjs/dist/cjs/Rx';
 +
 +import {SearchService} from "./SearchService";
 +
 +declare var zone: Zone;
 +
 +@Directive({
 +    selector: 'input[type=text][mou-live-search]',
 +    outputs: ['results', 'loading'],
 +    providers: [SearchService]
 +})
 +export class LiveSearch {
 +    results: EventEmitter = new EventEmitter();
 +    loading: EventEmitter = new EventEmitter();
 +
 +    constructor( private el: ElementRef, public search: SearchService){
 +
 +    }
 +
 +    onInit(){
 +        console.log("starting");
 +        (<any>Rx).Observable.fromEvent(this.el.nativeElement, 'keyup')
 +            .map(e => e.target.value)
 +            .filter(text => text.length > 2)
 +            .debounceTime(250)
 +            .distinctUntilChanged()
 +            .do(zone.bind(() => this.loading.next(true)))
 +            .flatMap(query => this.search.search(query))
 +            .do(zone.bind(() => this.loading.next(false)))
 +            .subscribe(
 +                zone.bind( orgunits => {
 +                    this.results.next(orgunits);
 +                }),
 +                zone.bind(err => {
 +                    console.log(err);
 +                    this.results.next(['ERROR, see console']);
 +                }),
 +                () => {
 +                    console.log("complete");
 +                }
 +            )
 +    }
 +}
 +
 diff --git a/src/components/search/search.html b/src/components/search/search.html
 index 373e5cc..2d6495f 100644
 --- a/src/components/search/search.html
 +++ b/src/components/search/search.html
 @@ -1 +1,19 @@
 - <div style="width: 500px; height: 50px; background: #ff647c; ">Søkefelt! </div>
 \ No newline at end of file
 +
 +    <section class="form-group">
 +        <label class="sr-only" for="livesearch">Search</label>
 +        <input
 +                mou-live-search
 +                (results)="orgunits = $event"
 +                (loading)="loading = $event"
 +                type="text"
 +                autofocus
 +                id="livesearch">
 +        <img style="width: 20px; position: absolute;"
 +             [hidden]="!loading"
 +             src="https://www.brown.edu/sites/default/themes/pawtuxet/img/loader-larger.gif">
 +    </section>
 +    <section>
 +        <div *ng-for="#orgunit of orgunits" style="padding: 0.5em 0.5em 0.5em 0;">
 +            <p>{{orgunit.name}}</p>
 +        </div>
 +    </section>
 diff --git a/src/components/search/search.ts b/src/components/search/search.ts
 index f5a52cb..951c866 100644
 --- a/src/components/search/search.ts
 +++ b/src/components/search/search.ts
 @@ -1,12 +1,17 @@
 -import {Component, CORE_DIRECTIVES} from 'angular2/angular2';
 +import {Component, View, CORE_DIRECTIVES} from 'angular2/angular2';
 +import {LiveSearch} from "./livesearch";
  
 @Component({
     selector: 'mou-search',
 -    directives: [CORE_DIRECTIVES],
 +    directives: [CORE_DIRECTIVES, LiveSearch],
     templateUrl: './components/search/search.html'
 })
 -
 -
 export class Search {
 +    orgunits: Array<any> = [];
 +    loading: boolean = false;
  
 +    constructor(){
 +    }
 }
 +
 +
 diff --git a/src/index.html b/src/index.html
 index c712323..d86b77e 100644
 --- a/src/index.html
 +++ b/src/index.html
 @@ -3,6 +3,9 @@
 <head>
     <meta charset="UTF-8">
     <title>Sample App</title>
 +
 +    <script src="../node_modules/@reactivex/rxjs/dist/global/Rx.js"></script>
 +
     <script>
         var xhReq = new XMLHttpRequest();
         xhReq.open("GET", "../manifest.webapp", false);
 @@ -14,7 +17,7 @@
     <script src="../node_modules/systemjs/dist/system.src.js"></script>
     <script src="../node_modules/angular2/bundles/angular2.dev.js"></script>
     <script src="../node_modules/angular2/bundles/http.dev.js"></script>
 -    <script src="../node_modules/angular2/bundles/router.dev.js"></script>
 +    <!--<script src="../node_modules/angular2/bundles/router.dev.js"></script>-->
     <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
     <script src="../node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
     <link rel="stylesheet" type="text/css" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">

#2

Status

MERGET

PR

   The following changes since commit 2cae79a5fb719d73b248913fa7bf502dc47d8bfa:
 
     [search] Code cleanup (2015-11-14 15:33:39 +0100)
 
   are available in the git repository at:
 
     gitolite@git.uio.no:u/erikhf/frm.git search
 
   for you to fetch changes up to 42930dd2cd2a8d6ad50eea592ebe888c8db28371:
 
     [search] Styling the search input and results (2015-11-15 16:30:21 +0100)
 
   ----------------------------------------------------------------
   Erik Haider Forsén (3):
         [search] Make search result clickable
         [search] Moved styles to separate css file
         [search] Styling the search input and results
 
    src/components/search/search.css  | 52 +++++++++++++++++++++++++++++++++++++++
    src/components/search/search.html | 20 ++++++++-------
    src/components/search/search.ts   |  8 ++++--
    3 files changed, 69 insertions(+), 11 deletions(-)
    create mode 100644 src/components/search/search.css
 
   diff --git a/src/components/search/search.css b/src/components/search/search.css
   new file mode 100644
   index 0000000..2344396
   --- /dev/null
   +++ b/src/components/search/search.css
   @@ -0,0 +1,52 @@
   +.search div{
   +    position: relative;
   +}
   +
   +.search img{
   +    width: 20px;
   +    position: absolute;
   +}
   +
   +.search li{
   +    padding: 0.5em 0.5em 0.5em 0;
   +    float: none;
   +}
   +
   +.search ul {
   +    display: block;
   +    position: absolute;
   +    top: 100%;
   +    left: 0;
   +    z-index: 1000;
   +    float: left;
   +    min-width: 160px;
   +    padding: 5px 0;
   +    margin: 4px 0 0;
   +    font-size: 14px;
   +    text-align: left;
   +    list-style: none;
   +    background-color: #fff;
   +    -webkit-background-clip: padding-box;
   +    background-clip: padding-box;
   +    border: 1px solid #ccc;
   +    border: 1px solid rgba(0, 0, 0, .15);
   +    border-radius: 4px;
   +    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
   +    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
   +}
   +
   +.results > li > a{
   +    display: block;
   +    padding: 3px 20px;
   +    clear: both;
   +    font-weight: 400;
   +    line-height: 1.42857143;
   +    color: #333;
   +    white-space: nowrap
   +}
   +
   +.results > li > a:focus, .results > li > a:hover {
   +    color: #262626;
   +    text-decoration: none;
   +    background-color: #f5f5f5
   +}
   diff --git a/src/components/search/search.html b/src/components/search/search.html
   index 2d6495f..bae546b 100644
   --- a/src/components/search/search.html
   +++ b/src/components/search/search.html
   @@ -1,5 +1,4 @@
   -
   -    <section class="form-group">
   +<div class="search clearfix">
            <label class="sr-only" for="livesearch">Search</label>
            <input
                    mou-live-search
   @@ -7,13 +6,16 @@
                    (loading)="loading = $event"
                    type="text"
                    autofocus
   +                class="form-control"
                    id="livesearch">
   -        <img style="width: 20px; position: absolute;"
   -             [hidden]="!loading"
   +        <img [hidden]="!loading"
                 src="https://www.brown.edu/sites/default/themes/pawtuxet/img/loader-larger.gif">
   -    </section>
   -    <section>
   -        <div *ng-for="#orgunit of orgunits" style="padding: 0.5em 0.5em 0.5em 0;">
   -            <p>{{orgunit.name}}</p>
   +
   +        <div [hidden]="!orgunits.length">
   +            <ul class="results" >
   +                <li *ng-for="#orgunit of orgunits" (click)="getMoreInfo(orgunit)">
   +                    <a href="#">{{orgunit.name}}<br/><span>{{orgunit.lastUpdated}}</span></a>
   +                </li>
   +            </ul>
            </div>
   -    </section>
   +</div>
   diff --git a/src/components/search/search.ts b/src/components/search/search.ts
   index 951c866..d9d90ae 100644
   --- a/src/components/search/search.ts
   +++ b/src/components/search/search.ts
   @@ -4,14 +4,18 @@ import {LiveSearch} from "./livesearch";
    @Component({
        selector: 'mou-search',
        directives: [CORE_DIRECTIVES, LiveSearch],
   -    templateUrl: './components/search/search.html'
   +    templateUrl: './components/search/search.html',
   +    styleUrls: ['./components/search/search.css']
    })
    export class Search {
        orgunits: Array<any> = [];
        loading: boolean = false;
    
   -    constructor(){
   +    getMoreInfo(orgunit){
   +        console.log(orgunit.id);
        }
   +
   +
    }

#3

Status

Not yet viewed
The following changes since commit 1e6ce2f50c69ca191a07aaad996f4deb464880f8:

  Fixed map  (pair programming) (2015-11-12 14:11:13 +0100)

are available in the git repository at:

  gitolite@git.uio.no:u/erikhf/frm.git map

for you to fetch changes up to dd095993096b96f042dcaa1103b7eb5aeeffb3be:

  Added "this is you" marker (2015-11-19 09:56:26 +0100)

----------------------------------------------------------------
Julie Hill Roa (3):
      Added "this is you" marker
      Added "this is you" marker
      Added "this is you" marker

 src/components/map/map.ts | 88 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 83 insertions(+), 5 deletions(-)