-
![]()
+
+
![]()
-
+
{{subCategory.label}}
Back
diff --git a/src/constants.ts b/src/constants.ts
index b1e72a67..e9d4dfb2 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -20,20 +20,20 @@ var saasOfferings: any = [
var categories: any = [
{id: 'languages', label: 'Languages', subCategories: [
- {id: 'java', label: 'Java', tags: ['java'], icon: 'font-icon icon-openjdk'},
- {id: 'javascript', tags: ['javascript', 'nodejs', 'js'], label: 'JavaScript', icon: 'font-icon icon-js'},
- {id: 'dotnet', label: '.NET', tags: ['dotnet'], icon: 'font-icon icon-dotnet'},
- {id: 'perl', label: 'Perl', tags: ['perl'], icon: 'font-icon icon-perl'},
- {id: 'ruby', label: 'Ruby', tags: ['ruby'], icon: 'font-icon icon-ruby'},
- {id: 'php', label: 'PHP', tags: ['php'], icon: 'font-icon icon-php'},
- {id: 'python', label: 'Python', tags: ['python'], icon: 'font-icon icon-python'},
- {id: 'golang', label: 'Go', tags: ['golang', 'go'], icon: 'font-icon icon-go-gopher'}
+ {id: 'java', label: 'Java', tags: ['java'], icon: 'icon-openjdk'},
+ {id: 'javascript', tags: ['javascript', 'nodejs', 'js'], label: 'JavaScript', icon: 'icon-js'},
+ {id: 'dotnet', label: '.NET', tags: ['dotnet'], icon: 'icon-dotnet'},
+ {id: 'perl', label: 'Perl', tags: ['perl'], icon: 'icon-perl'},
+ {id: 'ruby', label: 'Ruby', tags: ['ruby'], icon: 'icon-ruby'},
+ {id: 'php', label: 'PHP', tags: ['php'], icon: 'icon-php'},
+ {id: 'python', label: 'Python', tags: ['python'], icon: 'icon-python'},
+ {id: 'golang', label: 'Go', tags: ['golang', 'go'], icon: 'icon-go-gopher'},
]},
{id: 'databases', label: 'Databases', subCategories: [
- {id: 'mongodb', label: 'Mongo', tags: ['mongodb'], icon: 'font-icon icon-mongodb'},
- {id: 'mysql', label: 'mySQL', tags: ['mysql'], icon: 'font-icon icon-mysql-database'},
- {id: 'postgresql', label: 'Postgres', tags: ['postgresql'], icon: 'font-icon icon-postgresql'},
- {id: 'mariadb', label: 'MariaDB', tags: ['mariadb'], icon: 'font-icon icon-mariadb'}
+ {id: 'mongodb', label: 'Mongo', tags: ['mongodb'], icon: 'icon-mongodb'},
+ {id: 'mysql', label: 'mySQL', tags: ['mysql'], icon: 'icon-mysql-database'},
+ {id: 'postgresql', label: 'Postgres', tags: ['postgresql'], icon: 'icon-postgresql'},
+ {id: 'mariadb', label: 'MariaDB', tags: ['mariadb'], icon: 'icon-mariadb'}
]},
{id: 'middleware', label: 'Middleware', subCategories: [
{id: 'integration', label: 'Integration', tags: ['amq', 'fuse', 'jboss-fuse', 'sso']},
@@ -42,7 +42,7 @@ var categories: any = [
{id: 'runtimes', label: 'Runtimes & Frameworks', tags: ['eap', 'httpd', 'tomcat']}
]},
{id: 'cicd', label: 'CI/CD', subCategories: [
- {id: 'jenkins', label: 'Jenkins', tags: ['jenkins'], icon: 'font-icon icon-jenkins'},
+ {id: 'jenkins', label: 'Jenkins', tags: ['jenkins'], icon: 'icon-jenkins'},
{id: 'pipelines', label: 'Pipelines', tags: ['pipelines'], icon: 'fa fa-clone'}
]}
];
diff --git a/src/services/catalog.service.ts b/src/services/catalog.service.ts
index baaec4b5..e333fd2a 100644
--- a/src/services/catalog.service.ts
+++ b/src/services/catalog.service.ts
@@ -173,6 +173,10 @@ export class CatalogService { static $inject = ['$filter', '$q', 'Constants', 'A
return _.get(this.constants, ['PUBLISHER_SYNONYMS', rawVendor]) as string || rawVendor;
}
+ public getImageForIconClass(iconClass: string): string {
+ return this.$filter('imageForIconClass')(iconClass) as string;
+ }
+
/**
* Creates an items array under each sub-category and categorizes each
* item accordingly. Dynamically creates 'all' and 'other' main and sub-
@@ -353,7 +357,14 @@ export class ServiceItem implements IServiceItem {
}
private getImage(): string {
- return _.get(this.resource, 'spec.externalMetadata.imageUrl') as string || '';
+ let image: string = _.get(this.resource, 'spec.externalMetadata.imageUrl') as string;
+ if (image) {
+ return image;
+ }
+
+
+ let iconClass: string = _.get(this.resource, ['spec', 'externalMetadata', 'console.openshift.io/iconClass']) as string;
+ return this.catalogSrv.getImageForIconClass(iconClass);
}
private getIcon(): string {
@@ -404,6 +415,7 @@ export class ImageItem implements IServiceItem {
this.builderSpecTagName = this.getBuilderSpecTagName();
if (this.builderSpecTagName) {
this.tags = this.getTags();
+ this.imageUrl = this.getImage();
this.iconClass = this.getIcon();
this.name = this.getName();
this.description = this.getDescription();
@@ -442,6 +454,11 @@ export class ImageItem implements IServiceItem {
return this.catalogSrv.$filter('imageStreamTagTags')(this.resource, this.builderSpecTagName);
}
+ private getImage() {
+ let iconClass = this.catalogSrv.$filter('imageStreamTagIconClass')(this.resource, this.builderSpecTagName);
+ return this.catalogSrv.getImageForIconClass(iconClass);
+ }
+
private getIcon() {
let icon = this.catalogSrv.$filter('imageStreamTagIconClass')(this.resource, this.builderSpecTagName);
icon = (icon.indexOf('icon-') !== -1) ? 'font-icon ' + icon : icon;
@@ -495,7 +512,9 @@ export class TemplateItem implements IServiceItem {
}
private getImage() {
- return '';
+ // Show images instead for some icon classes that we recognize.
+ let iconClass = _.get(this.resource, 'metadata.annotations.iconClass') as string;
+ return this.catalogSrv.getImageForIconClass(iconClass);
}
private getIcon() {
diff --git a/src/styles/order-service.less b/src/styles/order-service.less
index c479d6c8..380f0598 100644
--- a/src/styles/order-service.less
+++ b/src/styles/order-service.less
@@ -18,6 +18,12 @@
max-height: 60px;
max-width: 60px;
}
+ &[src$=".svg"] {
+ height: 52px;
+ @media (min-width: @order-service-title-sm-min) {
+ height: 60px;
+ }
+ }
}
}
}