Skip to content
Permalink
Browse files

feat(view): add picture to a portal view

  • Loading branch information...
tcompiegne committed Feb 3, 2019
1 parent c9587c1 commit 9e092cb77e3016c5fc0cfb795507f71ece9a4cbb
@@ -18,6 +18,7 @@ import NotificationService from '../../../../services/notification.service';
import ApiService from "../../../../services/api.service";
import * as _ from 'lodash';
import { StateService } from '@uirouter/core';
import {IScope} from "angular";

class ViewController {
private createMode: boolean = false;
@@ -29,6 +30,7 @@ class ViewController {
private deletedAPIs: any[];
public searchText: string = "";
public viewForm: any;
private formChanged: boolean = false;

constructor(
private ApiService: ApiService,
@@ -38,7 +40,8 @@ class ViewController {
private $filter: ng.IFilterService,
private $state: StateService,
private $location: ng.ILocationService,
private $mdDialog: angular.material.IDialogService) {
private $mdDialog: angular.material.IDialogService,
private $scope: IScope) {
'ngInject';
this.createMode = $location.path().endsWith('new');
}
@@ -47,6 +50,11 @@ class ViewController {
this.deletedAPIs = [];
this.addedAPIs = [];
this.selectedAPIs = (this.viewApis) ? this.viewApis.slice(0) : [];
let self = this;
this.$scope.$on("apiPictureChangeSuccess", function(event, args) {
self.view.picture = args.image;
self.formChanged = true;
});
}

save() {
@@ -94,6 +102,7 @@ class ViewController {
});
}
this.searchText = "";
this.formChanged = true;
setTimeout(function () {
document.getElementById('new-view-apis-autocomplete-id').blur();
},0);
@@ -110,7 +119,6 @@ class ViewController {
}).then(function (deleteApi) {
if (deleteApi) {
that.deletedAPIs.push(api);
debugger;
if (that.viewApis.some(a => a.id === api.id)) {
// we need to retrieve the API to get the all information required for the update
that.ApiService.get(api.id).then(response => {
@@ -23,37 +23,44 @@ <h1>{{$ctrl.createMode ? 'New' : 'Edit'}} view</h1>
<div class="gv-form">
<h2>General</h2>
<div class="gv-form-content" layout="column">
<form name="$ctrl.viewForm">
<div layout-gt-sm="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Name</label>
<input ng-model="$ctrl.view.name" type="text" required name="name" maxlength="50">
<div class="hint" ng-if="$ctrl.viewForm.name.$valid || $ctrl.viewForm.name.$pristine">View Name</div>
<div ng-messages="$ctrl.viewForm.name.$error">
<div ng-message="required">View name is required.</div>
<div ng-message="md-maxlength">The name has to be less than 50 characters long.</div>
</div>
</md-input-container>
</div>
<form name="$ctrl.viewForm">
<div layout="row">
<div layout="column" flex>
<div layout-gt-sm="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Name</label>
<input ng-model="$ctrl.view.name" type="text" required name="name" maxlength="50">
<div class="hint" ng-if="$ctrl.viewForm.name.$valid || $ctrl.viewForm.name.$pristine">View Name</div>
<div ng-messages="$ctrl.viewForm.name.$error">
<div ng-message="required">View name is required.</div>
<div ng-message="md-maxlength">The name has to be less than 50 characters long.</div>
</div>
</md-input-container>
</div>

<div layout-gt-sm="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Description</label>
<input ng-model="$ctrl.view.description" type="text" name="description">
<div class="hint" ng-if="$ctrl.viewForm.description.$valid || $ctrl.viewForm.description.$pristine">
Provide a description of your view
</div>
</md-input-container>
</div>
<div layout-gt-sm="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Description</label>
<input ng-model="$ctrl.view.description" type="text" name="description">
<div class="hint" ng-if="$ctrl.viewForm.description.$valid || $ctrl.viewForm.description.$pristine">
Provide a description of your view
</div>
</md-input-container>
</div>

<div layout-gt-sm="row" class="new-view-form-input-action">
<md-input-container class="md-block" flex-gt-sm>
<label>Visibility</label>
<ng-md-icon icon="visibility{{$ctrl.view.hidden?'_off':''}}" ng-click="$ctrl.toggleVisibility()"></ng-md-icon>
<div class="hint" ng-if="$ctrl.viewForm.name.$valid || $ctrl.viewForm.name.$pristine">Choose to display or hide the view</div>
</md-input-container>
</div>
</form>
<div layout-gt-sm="row" class="new-view-form-input-action">
<md-input-container class="md-block" flex-gt-sm>
<label>Visibility</label>
<ng-md-icon icon="visibility{{$ctrl.view.hidden?'_off':''}}" ng-click="$ctrl.toggleVisibility()"></ng-md-icon>
<div class="hint" ng-if="$ctrl.viewForm.name.$valid || $ctrl.viewForm.name.$pristine">Choose to display or hide the view</div>
</md-input-container>
</div>
</div>
<div>
<gravitee-image image="$ctrl.view.picture" image-url="$ctrl.view.picture_url || 'assets/GRAVITEE_LOGOsstxtclair-05.png'"></gravitee-image>
</div>
</div>
</form>
</div>
</div>

@@ -124,7 +131,7 @@ <h4 ng-if="api.version"><ng-md-icon icon="watch_later" style="fill:grey;" size="
</md-table-container>

<div layout="row">
<md-button ng-disabled="$ctrl.viewForm.$invalid || $ctrl.viewForm.$pristine"
<md-button ng-disabled="$ctrl.viewForm.$invalid || $ctrl.viewForm.$pristine && !$ctrl.formChanged"
ng-click="$ctrl.save()"
permission permission-only="['portal-view-c', 'portal-view-u']"
class="md-raised md-primary">
@@ -133,4 +140,4 @@ <h4 ng-if="api.version"><ng-md-icon icon="watch_later" style="fill:grey;" size="
</div>
</div>
</div>
</div>
</div>
@@ -17,10 +17,13 @@
-->
<md-content gv-theme-element="portal.apisList">
<div id="main-content" layout="row" layout-align="center start" flex="100" style="padding-top: 70px; padding-bottom: 50px;">
<div layout="column" flex="60" class="portal-view-container">
<h3>{{viewCtrl.view.name}}</h3>
<div layout="column" flex="70" class="portal-view-container">
<div layout="row" layout-align="center start">
<div class="portal-view-description" flex="40">
<div class="portal-view-description" layout="column" flex="40">
<div layout="row" layout-align="start center">
<img ng-src="{{::viewCtrl.view.picture_url}}" alt="view-logo" style="max-width:120px; max-height:60px; width: auto; height: auto;"/>
<span style="color: #333333; font-size: 26px; padding-left: 24px;">{{viewCtrl.view.name}}</span>
</div>
<p>
<span ng-if="!viewCtrl.view.description" translate="view.defaultDescription" translate-values="{viewName: viewCtrl.view.name}" ></span>
{{viewCtrl.view.description}}
@@ -35,6 +35,11 @@
<span class="md-headline">{{::view.name}}</span>
<span class="md-subhead"><strong>{{::view.totalApis}}</strong> API(s)</span>
</md-card-title-text>
<md-card-title-media>
<div class="md-media-sm card-media gravitee-media">
<img ng-src="{{::view.picture_url}}" alt="view-logo" />
</div>
</md-card-title-media>
</md-card-title>
<md-card-content>
<div>

0 comments on commit 9e092cb

Please sign in to comment.
You can’t perform that action at this time.