Connect: initial facelift css changes

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@53367 d315682c-612b-4755-9ff5-7f18f6832af3

src/app/communities/communities.component.html

@@ -74,3 +74,66 @@
       </div>
     </div>
 </div>
+
+<div class="uk-section-default" uk-scrollspy="{&quot;target&quot;:&quot;[uk-scrollspy-class]&quot;,&quot;cls&quot;:&quot;uk-animation-fade&quot;,&quot;delay&quot;:false}">
+  <div class="mainPageBottomInfo uk-background-norepeat uk-background-cover uk-background-center-center uk-section uk-section-small ">
+    <div class="uk-container">
+         <div class="uk-grid-divider uk-margin-remove-vertical uk-grid" uk-grid="">
+
+           <div class="uk-width-expand@m uk-width-1-2@s uk-dark uk-first-column">
+              <h4 class="uk-margin-medium uk-text-center uk-h4 uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                 A researcher?
+              </h4>
+              <div class=" uk-text-primary custom-uk-text-light uk-margin-medium uk-width-xlarge uk-margin-auto uk-text-center uk-text-lead uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                 Explore all OA research results. Link all your research. Build your profile
+              </div>
+              <div id="page#37" class=" uk-margin-medium uk-text-center uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                 <a class="explorelink el-content  uk-button uk-button-default uk-button-small" href="https://beta.explore.openaire.eu" target="_blank" style="">
+                 OpenAIRE.EXPLORE
+                 </a>
+              </div>
+           </div>
+
+            <div class="uk-width-expand@m uk-width-1-2@s uk-dark uk-first-column">
+               <h4 class="uk-margin-medium uk-text-center uk-h4 uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  A content provider?
+               </h4>
+               <div class=" uk-text-primary custom-uk-text-light uk-margin-medium uk-width-xlarge uk-margin-auto uk-text-center uk-text-lead uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  Join OpenAIRE, use our tools and make your content more visible around the world.
+               </div>
+               <div id="page#37" class=" uk-margin-medium uk-text-center uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  <a class="providelink el-content  uk-button uk-button-default uk-button-small" href="https://beta.provide.openaire.eu" target="_blank" style="">
+                  OpenAIRE.PROVIDE
+                  </a>
+               </div>
+            </div>
+            <div class="uk-width-expand@m uk-width-1-2@s uk-dark">
+               <h4 class="uk-margin-medium uk-text-center uk-h4 uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  A research manager?
+               </h4>
+               <div class="uk-text-primary custom-uk-text-light uk-margin-medium uk-width-xlarge uk-margin-auto uk-text-center uk-text-lead uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  Use our monitoring services and easily track all relevant research results.
+               </div>
+               <div id="page#41" class=" uk-margin-medium uk-text-center uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  <a class="monitorlink el-content uk-button uk-button-default uk-button-small" href="https://monitor.openaire.eu" target="_blank">
+                  OpenAIRE.MONITOR
+                  </a>
+               </div>
+            </div>          
+            <div class="uk-width-expand@m uk-width-1-2@s uk-dark">
+               <h4 class="uk-margin-medium uk-text-center uk-h4 uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  A developer?
+               </h4>
+               <div id="page#48" class="uk-text-primary custom-uk-text-light uk-margin-medium uk-width-xlarge uk-margin-auto uk-text-center uk-text-lead uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  Get access to OpenAIRE data and capitalize on Europe's open linked research.
+               </div>
+               <div id="page#49" class="  uk-margin-medium uk-text-center uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">
+                  <a class="developlink el-content uk-button uk-button-default uk-button-small" href="https://develop.openaire.eu" target="_blank">
+                  OpenAIRE.DEVELOP
+                  </a>
+               </div>
+            </div>
+         </div>
+      </div>
+   </div>
+</div>

src/app/community/community.module.ts

@@ -15,6 +15,7 @@ import {CommunityService} from '../openaireLibrary/connect/community/community.s
 import {FreeGuard} from '../openaireLibrary/login/freeGuard.guard';
 import {PreviousRouteRecorder} from '../openaireLibrary/utils/piwik/previousRouteRecorder.guard';
 import {SubscribeModule} from '../utils/subscribe/subscribe.module';
+import {InviteModule} from '../utils/subscribe/invite.module';
 import {ManageModule} from '../utils/manage/manage.module';
 
 import {StatisticsModule} from "../statistics/statistics.module";
@@ -23,7 +24,7 @@ import {StatisticsModule} from "../statistics/statistics.module";
   imports: [
     CommonModule, FormsModule, RouterModule,
       // CommunityRoutingModule,
-    SubscribeModule, StatisticsModule, ManageModule
+    SubscribeModule, StatisticsModule, ManageModule, InviteModule
   ],
   declarations: [
     CommunityComponent, ResultsComponent

src/app/searchEntries/results/results.component.ts

@@ -6,7 +6,31 @@ import { CommunityInfo } from '../../openaireLibrary/connect/community/community
     selector: 'results-comp',
     template: `
     <div *ngIf="results != null && results.length > 0">
-      <div class="uk-margin-remove-vertical uk-grid-match uk-child-width-1-1 uk-child-width-1-1@m uk-child-width-1-1@l uk-child-width-1-1@xl uk-grid-small uk-grid-divider uk-grid uk-grid-stack" uk-grid="">
+        <div class="uk-margin uk-text-right">
+            <div *ngIf="resultType == 'publication'">
+                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/publications">
+                View all
+                </a>
+            </div>
+            <div *ngIf="resultType == 'dataset'">
+                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/datasets">
+                View all
+                </a>
+            </div>
+            <div *ngIf="resultType == 'software'">
+                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/software">
+                View all
+                </a>
+            </div>
+            <div *ngIf="resultType == 'other'">
+                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/other">
+                View all
+                </a>
+            </div>
+        </div>
+    </div>
+    <div *ngIf="results != null && results.length > 0">
+      <div class="uk-margin-remove-vertical uk-grid-match uk-child-width-1-1 uk-child-width-1-1@m uk-child-width-1-1@l uk-child-width-1-1@xl uk-grid-small uk-grid uk-grid-stack" uk-grid="">
         <li *ngFor="let item of results; let i = index">
          <div class="uk-first-column">
             <div class="el-item uk-panel">
@@ -48,32 +72,8 @@ import { CommunityInfo } from '../../openaireLibrary/connect/community/community
     </div>
 
     <div *ngIf="results != null && results.length == 0 || total == 0" class=" uk-alert uk-alert-primary"> No results available </div>
-    <hr>
 
-    <div *ngIf="results != null && results.length > 0">
-        <div class="uk-margin">
-            <div *ngIf="resultType == 'publication'">
-                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/publications">
-                View all
-                </a>
-            </div>
-            <div *ngIf="resultType == 'dataset'">
-                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/datasets">
-                View all
-                </a>
-            </div>
-            <div *ngIf="resultType == 'software'">
-                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/software">
-                View all
-                </a>
-            </div>
-            <div *ngIf="resultType == 'other'">
-                <a class="el-content uk-button uk-button-text" [queryParams]=params routerLinkActive="router-link-active" routerLink="/search/find/other">
-                View all
-                </a>
-            </div>
-        </div>
-    </div>`
+    `
 
 })
 

src/app/utils/subscribe/invite.component.ts

@@ -0,0 +1,63 @@
+import { Component, Input, ViewChild } from '@angular/core';
+import { Location } from '@angular/common';
+import {ActivatedRoute} from '@angular/router';
+import { EnvProperties} from '../../openaireLibrary/utils/properties/env-properties';
+
+import {InviteService} from './invite.service';
+import {Session} from '../../openaireLibrary/login/utils/helper.class';
+@Component({
+    selector: 'invite',
+    template: `
+    <form class="uk-form-stacked">
+        <div>
+            <label class="uk-form-label">Subject</label>
+            <input type="text" placeholder="Subject" [(ngModel)]=subject name="subject">
+        </div>
+        <div>
+            <div class="uk-form-label">Message</div>
+            <textarea cols="" rows="6" placeholder="Email message..." [(ngModel)]=body name="body"></textarea>
+         </div>
+        <a class="uk-button uk-button-primary" (click)="invite()"> Invite</a>
+    </form>
+
+    `
+})
+
+export class InviteComponent {
+  @Input() communityName:boolean;
+  @Input() communityId:string;
+  properties:EnvProperties;
+
+  subject:string;
+  body:string;
+  recipients:string[] = [];
+
+  constructor (private route: ActivatedRoute,
+      private _inviteService: InviteService
+    ) {
+    }
+
+    public ngOnInit() {
+      this.route.data
+          .subscribe((data: { envSpecific: EnvProperties }) => {
+             this.properties = data.envSpecific;
+             this.subject = "["+this.communityName+"] Invitation to join community";
+             this.body = "Dear sir or madame, \n\nWe would like to invite you to join "+this.communityName +
+             " OpenAIRE community (beta."+this.communityId+".openaire.eu)";
+           });
+
+
+    }
+
+    invite(){
+      var email = Session.getUserEmail();
+      //TODO
+        this._inviteService.inviteUsers(  this.properties.adminToolsAPIURL,this.subject, this.body, ["argirok@di.uoa.gr"]).subscribe (
+          res => {
+             console.log(res);
+
+          });
+      }
+
+
+}

src/app/utils/subscribe/invite.module.ts

@@ -0,0 +1,24 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { RouterModule } from '@angular/router';
+import {FormsModule}                from '@angular/forms';
+
+import { InviteService } from './invite.service';
+import {InviteComponent} from './invite.component';
+import {AlertModalModule} from '../../openaireLibrary/utils/modal/alertModal.module';
+
+@NgModule({
+  imports: [
+    CommonModule,   RouterModule, AlertModalModule, FormsModule
+  ],
+  declarations: [
+    InviteComponent
+   ],
+  providers:[
+    InviteService
+    ],
+  exports: [
+    InviteComponent
+     ]
+})
+export class InviteModule { }

src/app/utils/subscribe/invite.service.ts

@@ -0,0 +1,26 @@
+import { Injectable } from '@angular/core';
+import { Http, Response, Headers, RequestOptions } from '@angular/http';
+import { Observable } from 'rxjs/Rx';
+import {COOKIE} from "../../openaireLibrary/login/utils/helper.class"
+
+
+@Injectable()
+export class InviteService {
+
+  constructor(private http:Http) {
+    }
+     inviteUsers(url:string, subject:string, body:string, recipients:string[]){
+       var email = {"subject":subject, "body":body, recipients: recipients };
+       return this.http.post(url+"/email", JSON.stringify(email), this.getAuthOptionsWithBody())
+           .map(res => <any> res.json())
+           .do(res => {console.log("Response is "+res)});
+     }
+     public getAuthOptionsWithBody():RequestOptions{
+     let headers = new Headers();
+     headers.append('Content-Type', 'application/json');
+     headers.append('X-XSRF-TOKEN',  COOKIE.getCookie(COOKIE.cookieName_id));
+     let options = new RequestOptions({ headers: headers, withCredentials:true  });
+       return options;
+     }
+
+}

src/assets/connect-custom.css

@@ -1,19 +1,23 @@
-.tm-toolbar .uk-subnav-line .custom-connect-li {
-   display: block;
-  background:#2C57D7 !important; color:#fff !important;
+:root {
+    --portal-main-color: #EBB13E;
+    --portal-main-contrast: #2E2E2E; 
+    --portal-dark-color: #4687E6;
 
+    --openaire-main-color: #313179;
+
+    --explore-portal-color: #D95F2D;
+    --provide-portal-color: #37C7E9;
+    --monitor-portal-color: #9ABB55;
+    --connect-portal-color: #EBB13E;
+    --develop-portal-color: #DA65AB;
 }
-.custom-connect-toolbar   ul.uk-subnav.uk-subnav-line{
-  background-color: #FFC700 !important;
-  }
 
-  .custom-connect-toolbar .inner {
-       background-color: #FFC700 !important;
-  }
 
-  .custom-connect-toolbar{
-    border-top-color:#FFC700 !important;
-  }
+
+.tm-toolbar .uk-subnav-line .custom-connect-li {
+  background:var(--portal-main-color) !important;
+}
+
 .uk-button-default:hover,.uk-button-default:focus,.btn:hover,.btn:focus {
   background-color:#fff !important;
   color:#5b5b5b !important;