Project

General

Profile

« Previous | Next » 

Revision 46561

Added by Argiro Kokogiannaki about 7 years ago

more layout changes for linking - simplify linking - easy switch between bulk and search mode

View differences:

linkingGeneric.component.ts
11 11 
    template: `
12 12 
    <div class="container uk-margin-top">
13 13 
      <div class="page-header">
14 
        <div   *ngIf=" bulkMode "   class="uk-float-right uk-badge uk-badge-notification">
15 
            <span class="uk-text-center uk-margin-top uk-text-medium"> <i class="uk-icon-upload"></i> Bulk mode</span>
16 
        </div>
17 14 
        <h1>Linking</h1>
18 15 
      </div>
19 
      <linking-home *ngIf="  show == 'home' " [bulkMode]="bulkMode" (linkTypeChange)="linkTypeChange($event)"  ></linking-home>
16 
        <start-over [results]="results" [contexts]="contexts" [projects]="projects" ></start-over>
17 
        <ul class="uk-pagination">
18 
            <li class="uk-pagination-previous" *ngIf="show != 'result' " (click)="prev()"><a><i class="uk-icon-angle-left"></i> Previous</a></li>
19 
            <li class="uk-pagination-next" *ngIf="show != 'claim' " (click)="next()"><a>Next <i class="uk-icon-angle-right"></i></a></li>
20 
            <li class="uk-pagination-next" *ngIf="show == 'claim' " (click)="next()">
21 
            <claim-insert   [contexts]="contexts" [results]="results"  [projects]="projects" [show] = "show"
22 
              (showChange)="showChange($event)" ></claim-insert>
20 23 

  		




  21
  
  
    
      <div  *ngIf="  show != 'home' &&  show != 'myclaims' " >


  		




  22
  
  
    
        <ul  *ngIf="    show != 'myclaims' " class="uk-breadcrumb">


  		




  23
  
  
    
          <li *ngIf="linkType == 'project'" [class]="(show == 'project' )?'uk-active':''"><a *ngIf="show != 'project'" (click)="showChangedType('project')" >Project</a><span *ngIf="show == 'project'">Project</span></li>


  		




  24
  
  
    
          <li *ngIf="linkType == 'context'" [class]="(show == 'context' )?'uk-active':''"><a *ngIf="show != 'context'" (click)="showChangedType('context')" >Context</a><span *ngIf="show == 'context'">Context</span></li>


  		




  25
  
  
    
          <li *ngIf="linkType == 'software'" [class]="(show == 'software' )?'uk-active':''"><a *ngIf="show != 'software'"  (click)="showChangedType('software')" >Software</a><span *ngIf="show == 'software'">Software</span> </li>


  		




  26
  
  
    
          <li  *ngIf="!bulkMode " [class]="(show == 'result' || show == 'publication' || show == 'dataset')?'uk-active':''"><a *ngIf="show != 'result' && show != 'publication' && show != 'dataset'" (click)="showChangedType('result')" >Research Result</a><span *ngIf="show == 'result' || show == 'publication' || show == 'dataset'">Research Result</span></li>


  		




  27
  
  
    
          <li  *ngIf="!bulkMode " [class]="(show == 'claim')?'uk-active':''"><span *ngIf="show == 'claim'">Link</span><a *ngIf="show != 'claim'" (click)="showChangedType('claim')">Link</a> </li>


  		




  28
  
  
    
          <li  *ngIf="bulkMode  " [class]="(show == 'claim' )?'uk-active':''"><span *ngIf="show == 'claim'">Upload & Link</span><a *ngIf="show != 'claim'" (click)="showChangedType('claim')">Upload & Link</a> </li>


  		




  
  24
  
    
            </li>


  		




  29
  25
  
    
        </ul>


  		




  30
  
  
    

  		




  31
  
  
    
      <!--div  *ngIf="  show != 'claim'  && show != 'myclaims' " class="uk-grid" -->


  		




  
  26
  
    
        <!-- link with Projects & Contexts -->


  		




  
  27
  
    
                <div class="uk-width-small-1-1 uk-width-medium-1-1 uk-width-large-1-1 uk-grid">


  		




  
  28
  
    
                   <div class="uk-width-small-1-1 uk-width-medium-1-2 uk-width-large-1-2 uk-width-xlarge-1-2 ">


  		




  
  29
  
    
                      <claim-selected-contexts  title="link Communities" [contexts]="contexts"  [show]="show" [linkType]=linkType


  		




  
  30
  
    
                       (showChange)="showChange($event)"  > </claim-selected-contexts>


  		




  
  31
  
    
                  </div>


  		




  
  32
  
    
                  <div class="uk-width-small-1-1 uk-width-medium-1-2 uk-width-large-1-2 uk-width-xlarge-1-2 ">


  		




  
  33
  
    
                       <claim-selected-projects   title="link Projects" [projects]="projects" [show]="show" [linkType]=linkType


  		




  
  34
  
    
                         (showChange)="showChange($event)"   > </claim-selected-projects>


  		




  
  35
  
    
                  </div>


  		




  
  36
  
    
                </div>


  		




  32
  37
  
    
        <!-- Research Results -->


  		




  33
  38
  
    
        <div class="uk-width-small-1-1 uk-width-medium-1-1 uk-width-large-1-1">


  		




  34
  
  
    
               <claim-selected-results  title= "Research Results" [results]="results"  [bulkMode]="bulkMode" [showSearch]="show=='claim'|| bulkMode? false: true"  [showAccessRights]="show=='claim' || bulkMode? true: false">


  		




  
  39
  
    
               <claim-selected-results  title= "with Research Results" [results]="results"  [bulkMode]="bulkMode" [showSearch]="show=='claim'|| bulkMode? false: true"  [showAccessRights]="show=='claim' || bulkMode? true: false">


  		




  35
  40
  
    
               </claim-selected-results>


  		




  36
  41
  
    
        </div>


  		




  37
  
  
    
        <bulk-claim *ngIf=" bulkMode " [publications]="results" > </bulk-claim>


  		




  38
  42
  
    

  		




  39
  
  
    
<!-- link with Projects & Contexts -->


  		




  40
  
  
    
        <div class="uk-width-small-1-1 uk-width-medium-1-1 uk-width-large-1-1 uk-grid">


  		




  41
  
  
    
           <div class="uk-width-small-1-1 uk-width-medium-1-2 uk-width-large-1-2 uk-width-xlarge-1-2 ">


  		




  42
  
  
    
              <claim-selected-contexts   [contexts]="contexts"  [show]="show"[linkType]=linkType


  		




  43
  
  
    
               (showChange)="showChange($event)"  > </claim-selected-contexts>


  		




  44
  
  
    
          </div>


  		




  45
  
  
    
          <div class="uk-width-small-1-1 uk-width-medium-1-2 uk-width-large-1-2 uk-width-xlarge-1-2 ">


  		




  46
  
  
    
               <claim-selected-projects    [projects]="projects" [show]="show" [linkType]=linkType


  		




  47
  
  
    
                 (showChange)="showChange($event)"   > </claim-selected-projects>


  		




  48
  
  
    
          </div>


  		




  49
  
  
    
        </div>


  		




  50
  43
  
    

  		




  51
  
  
    
      <div  *ngIf="  show == 'claim'  "  class="uk-width-small-1-1 uk-width-medium-1-1 uk-width-large-1-1 uk-grid">


  		




  52
  
  
    
              <div class="uk-width-1-1  ">


  		




  53
  
  
    
               <claim-insert   [contexts]="contexts" [results]="results"  [projects]="projects" [show] = "show"


  		




  54
  
  
    
                 (showChange)="showChange($event)" ></claim-insert>


  		




  55
  
  
    
              </div>


  		




  56
  
  
    
        </div>


  		




  57
  44
  
    

  		




  58
  
  
    
      <ul *ngIf="show != 'home'"  class="uk-pagination">


  		




  59
  
  
    
          <li class="uk-pagination-previous" (click)="prev()"><a><i class="uk-icon-angle-left"></i> Previous</a></li>


  		




  
  45
  
    

  		




  
  46
  
    
      <ul class="uk-pagination">


  		




  
  47
  
    
          <li class="uk-pagination-previous" *ngIf="show != 'result' " (click)="prev()"><a><i class="uk-icon-angle-left"></i> Previous</a></li>


  		




  60
  48
  
    
          <li class="uk-pagination-next" *ngIf="show != 'claim' " (click)="next()"><a>Next <i class="uk-icon-angle-right"></i></a></li>


  		




  
  49
  
    
          <li class="uk-pagination-next" *ngIf="show == 'claim' " (click)="next()">


  		




  
  50
  
    
          <claim-insert   [contexts]="contexts" [results]="results"  [projects]="projects" [show] = "show"


  		




  
  51
  
    
            (showChange)="showChange($event)" ></claim-insert>


  		




  
  52
  
    

  		




  
  53
  
    
          </li>


  		




  61
  54
  
    
      </ul>


  		




  62
  
  
    
  </div>


  		




  63
  
  
    
</div>


  		




  
  55
  
    
 </div>


  		




  64
  56
  
    

  		




  65
  57
  
    

  		




  66
  58
  
    
`


  		




  ......




  75
  67
  
    
  contexts=[];


  		




  76
  68
  
    
  projects=[];


  		




  77
  69
  
    
   results = [];


  		




  78
  
  
    
  show = "home";


  		




  
  70
  
    
  show = "result";


  		




  79
  71
  
    
  date='8-6-2016';


  		




  80
  72
  
    
  keyword: string = "";


  		




  81
  73
  
    
  linkType:string ="project"; // link type (selected in home page) : project, context, software, etc


  		




  ......




  101
  93
  
    
    }


  		




  102
  94
  
    
  }


  		




  103
  95
  
    
  prev(){


  		




  104
  
  
    
    if(this.show == 'result'){


  		




  105
  
  
    
        this.show =  'home'//this.linkType;


  		




  106
  
  
    

  		




  107
  
  
    
  } else if(this.show == 'claim'){


  		




  108
  
  
    
        if(!this.bulkMode){


  		




  109
  
  
    
          this.show='result';


  		




  110
  
  
    
        }else{


  		




  111
  
  
    
          this.show =  "home";


  		




  112
  
  
    
        }


  		




  
  96
  
    
  if(this.show == 'claim'){


  		




  
  97
  
    
      this.show='result';


  		




  113
  98
  
    
    }


  		




  114
  99
  
    
  }


  		




  115
  100
  
    

  		




  116
  
  
    
 


  		




  
  101
  
    

  		




  117
  102
  
    
  resultsChange($event) {


  		




  118
  103
  
    
    this.results=$event.value;


  		




  119
  104
  
    
  }


  		












Also available in:  Unified diff