[Library | Trunk]: 1. Change curator service. 2. Add icons preview
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@60516 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou
parent
455b84aa56
commit
b2bec99ff4
|
|
@ -11,19 +11,19 @@ export class CuratorService {
|
|||
constructor(private http: HttpClient) {
|
||||
}
|
||||
|
||||
public getCurators(properties: EnvProperties, emails: string): Observable<Curator[]> {
|
||||
let url: string = properties.adminToolsAPIURL + '/curator?emails='+emails;
|
||||
public getCurators(properties: EnvProperties, communityId: string): Observable<Curator[]> {
|
||||
let url: string = properties.adminToolsAPIURL + '/' + communityId + '/curator';
|
||||
return this.http.get<Curator[]>((properties.useCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url);
|
||||
}
|
||||
|
||||
public updateCurator(properties: EnvProperties, curator: Curator) {
|
||||
let url: string = properties.adminToolsAPIURL + "curator";
|
||||
return this.http.post<Curator>(url, curator, CustomOptions.getAuthOptions());
|
||||
return this.http.post<Curator>(url, curator, CustomOptions.registryOptions());
|
||||
}
|
||||
|
||||
public getCurator(properties: EnvProperties, curatorId: string): Observable<Curator> {
|
||||
let url: string = properties.adminToolsAPIURL + 'curator/'+curatorId;
|
||||
return this.http.get<Curator>((properties.useCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url);
|
||||
public getCurator(properties: EnvProperties): Observable<Curator> {
|
||||
let url: string = properties.adminToolsAPIURL + 'curator';
|
||||
return this.http.get<Curator>((properties.useCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url, CustomOptions.registryOptions());
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,149 @@
|
|||
import {Component} from "@angular/core";
|
||||
|
||||
@Component({
|
||||
selector: 'icons-preview',
|
||||
template: `
|
||||
<div class="uk-section uk-container uk-container-large" style="font-size: 14px;">
|
||||
<h4 class="uk-text-bold">Icons</h4>
|
||||
<div class="uk-grid uk-grid-small uk-child-width-1-6" uk-grid>
|
||||
<div class="uk-text-center">
|
||||
<icon name="arrow_left"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">arrow_left</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="arrow_right"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">arrow_right</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="arrow_up"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">arrow_up</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="arrow_down"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">arrow_down</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="book"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">book</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="database"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">database</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="cog"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">cog</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="earth"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">earth</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="edit"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">edit</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="remove"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">remove</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="preview"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">preview</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="bullet"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">bullet</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="remove_circle"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">remove_circle</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="remove_circle_outline"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">remove_circle_outline</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="person_add"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">person_add</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="cloud_upload"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">cloud_upload</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="add"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">add</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="group"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">group</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="lock"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">lock</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="search"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">search</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="refresh"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">refresh</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="close"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">close</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="done"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">done</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="mail"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">mail</div>
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<icon name="photo"></icon>
|
||||
<div class="uk-text-bold uk-margin-small-top">photo</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin-medium-top">
|
||||
<h4 class="uk-text-bold">Usage</h4>
|
||||
<ul class="uk-list">
|
||||
<li>1. Import IconsModule</li>
|
||||
<li>2. Add this to your module with these icons you will need<br>
|
||||
<div class="uk-margin-top">
|
||||
<pre><code>constructor(private iconsService: IconsService) {{ "{" }}
|
||||
this.iconsService.registerIcons([edit]);
|
||||
{{ "}" }}</code></pre>
|
||||
</div>
|
||||
</li>
|
||||
<li>3. Use an icon with icon tag. Add parameter ratio to scale this icon. Default size 20x20 (ratio: 1)<br>
|
||||
<div class="uk-margin-top">
|
||||
<pre><code>{{'<'}}icon name="edit"{{'><'}}/icon{{'>'}}</code></pre>
|
||||
</div>
|
||||
</li>
|
||||
<li>4. Add a color class in parent of icon to give your icon a color.<br>
|
||||
<div class="uk-margin-top">
|
||||
<pre><code>{{'<'}}div class="uk-text-secondary"{{'>'}}
|
||||
{{'<'}}icon name="edit"{{'><'}}/icon{{'>'}}
|
||||
{{'<'}}/div{{'>'}}</code></pre>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-margin-medium-top">
|
||||
<h4 class="uk-text-bold">Add a new icon</h4>
|
||||
<ul class="uk-list">
|
||||
<li>1. Go to <a href="https://material.io/resources/icons/?style=baseline">Material Icons</a></li>
|
||||
<li>2. Find your icon and download it as svg.</li>
|
||||
<li>3. Open svg file with an editor and change width and height to 20</li>
|
||||
<li>4. Create an entry on icons file with your new icon.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
export class IconsPreviewComponent {
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
import {NgModule} from "@angular/core";
|
||||
import {CommonModule} from "@angular/common";
|
||||
import {RouterModule} from "@angular/router";
|
||||
import {IconsPreviewComponent} from "./icons-preview.component";
|
||||
import {IconsService} from "../icons.service";
|
||||
import {IconsModule} from "../icons.module";
|
||||
import {
|
||||
add,
|
||||
arrow_down,
|
||||
arrow_left,
|
||||
arrow_right,
|
||||
arrow_up,
|
||||
book, bullet, close, cloud_upload,
|
||||
cog,
|
||||
database, done,
|
||||
earth,
|
||||
edit, group, lock, mail, person_add, photo,
|
||||
preview, refresh,
|
||||
remove, remove_circle, remove_circle_outline, search
|
||||
} from "../icons";
|
||||
|
||||
@NgModule({
|
||||
imports: [CommonModule, RouterModule.forChild([
|
||||
{path: '', component: IconsPreviewComponent}
|
||||
]), IconsModule],
|
||||
declarations: [IconsPreviewComponent],
|
||||
exports: [IconsPreviewComponent]
|
||||
})
|
||||
export class IconsPreviewModule {
|
||||
constructor(private iconsService: IconsService) {
|
||||
this.iconsService.registerIcons([arrow_left, arrow_right, arrow_up, arrow_down, book, database, cog, earth, edit,
|
||||
remove, preview, bullet, remove_circle, remove_circle_outline, person_add, cloud_upload, add, group, lock, search,
|
||||
refresh, close, done, mail, photo
|
||||
])
|
||||
}
|
||||
}
|
||||
|
|
@ -50,7 +50,7 @@ export const edit: Icon = {
|
|||
|
||||
export const remove: Icon = {
|
||||
name: 'remove',
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M16 9v10H8V9h8m-1.5-6h-5l-1 1H5v2h14V4h-3.5l-1-1zM18 7H6v12c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7z"/></svg>'
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 9.91 11.01"><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path d="M8.83,1.85V9.41A1.58,1.58,0,0,1,7.26,11H2.62a1.6,1.6,0,0,1-1.57-1.6V1.85H.28A.26.26,0,0,1,0,1.57.27.27,0,0,1,.28,1.3H2.59v-1A.26.26,0,0,1,2.87,0H7a.28.28,0,0,1,.27.28v1H9.63a.28.28,0,0,1,.28.27.3.3,0,0,1-.28.28Zm-7.23,0V9.41a1,1,0,0,0,1,1.05H7.26a1,1,0,0,0,1-1.05V1.85ZM6.76,1.3V.55H3.15V1.3Z"/><path class="cls-1" d="M3.06,3.73a.28.28,0,0,1,.28-.28.29.29,0,0,1,.27.28V8.58a.29.29,0,0,1-.27.28.28.28,0,0,1-.28-.28Z"/><path class="cls-1" d="M6.29,3.73a.28.28,0,0,1,.28-.28.29.29,0,0,1,.27.28V8.58a.29.29,0,0,1-.27.28.28.28,0,0,1-.28-.28Z"/><path class="cls-1" d="M4.66,3.73a.3.3,0,0,1,.28-.28.29.29,0,0,1,.28.28V8.58a.29.29,0,0,1-.28.28.3.3,0,0,1-.28-.28Z"/></g></g></svg>'
|
||||
}
|
||||
|
||||
export const preview: Icon = {
|
||||
|
|
@ -126,3 +126,4 @@ export const photo = {
|
|||
name: 'photo',
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="20"><path d="M0 0h24v24H0z" fill="none"/><circle cx="12" cy="12" r="3.2"/><path d="M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/></svg>'
|
||||
}
|
||||
/** Add new icon under this line to be sure that it will be added on preview */
|
||||
|
|
|
|||
Loading…
Reference in New Issue