diff --git a/src/app/topic/indicators.component.html b/src/app/topic/indicators.component.html
index 6996059..4e81311 100644
--- a/src/app/topic/indicators.component.html
+++ b/src/app/topic/indicators.component.html
@@ -58,8 +58,9 @@
         <div *ngIf="indicator" [id]="indicator._id"
              [class.uk-width-1-3@m]="grid && indicator.width === 'small'"
              [class.uk-width-1-2@m]="grid && indicator.width === 'medium'"
-             [class.uk-width-1-1@m]="!grid || indicator.width === 'large'">
-          <div class="md-card" [class.uk-sortable-nodrag]="!canNumbersReorder">
+             [class.uk-width-1-1@m]="!grid || indicator.width === 'large'"
+             long-click (onLongPress)="onLongPress('number')">
+          <div class="md-card" [class.md-card-hover]="canNumbersReorder" [class.uk-sortable-nodrag]="!canNumbersReorder">
             <div class="md-card-toolbar">
               <div class="md-card-toolbar-actions" [class.uk-flex-middle]="!grid" [class.uk-flex]="!grid">
                 <span *ngIf="!grid" class="uk-margin-medium-right uk-flex uk-flex-middle">
@@ -122,8 +123,9 @@
         <div *ngIf="indicator" [id]="indicator._id"
              [class.uk-width-1-3@m]="grid && indicator.width === 'small'"
              [class.uk-width-1-2@m]="grid && indicator.width === 'medium'"
-             [class.uk-width-1-1@m]="!grid || indicator.width === 'large'">
-          <div class="md-card" [class.uk-sortable-nodrag]="!canChartsReorder">
+             [class.uk-width-1-1@m]="!grid || indicator.width === 'large'"
+             long-click (onLongPress)="onLongPress()">
+          <div class="md-card" [class.md-card-hover]="canChartsReorder" [class.uk-sortable-nodrag]="!canChartsReorder">
             <div class="md-card-toolbar">
               <div class="md-card-toolbar-actions" [class.uk-flex-middle]="!grid" [class.uk-flex]="!grid">
                 <ng-template [ngIf]="!grid">
diff --git a/src/app/topic/indicators.component.ts b/src/app/topic/indicators.component.ts
index ddeef8c..9467541 100644
--- a/src/app/topic/indicators.component.ts
+++ b/src/app/topic/indicators.component.ts
@@ -14,463 +14,479 @@ import {LayoutService} from "../library/sharedComponents/sidebar/layout.service"
 declare var UIkit;
 
 @Component({
-    selector: 'indicators',
-    templateUrl: './indicators.component.html'
+  selector: 'indicators',
+  templateUrl: './indicators.component.html'
 })
 export class IndicatorsComponent implements OnInit, OnDestroy, OnChanges, AfterViewInit {
-
-    @Input()
-    public properties: EnvProperties = null;
-    @Input()
-    public topicIndex: number = 0;
-    @Input()
-    public categoryIndex: number = 0;
-    @Input()
-    public subcategoryIndex: number = 0;
-    @Input()
-    public stakeholder: Stakeholder = null;
-    public indicatorUtils: IndicatorUtils = new IndicatorUtils();
-    public indicatorFb: FormGroup;
-    /**
-     * Editable indicator
-     */
-    public indicator: Indicator;
-    public index: number;
-    /**
-     * Displayed chart and numbers base on Top filters
-     */
-    public displayCharts: Indicator[] = [];
-    public displayNumbers: Indicator[] = [];
-    /**
-     * Top filters
-     */
-    public filters: FormGroup;
-    public all: Option = {
-        value: 'all',
-        label: 'All'
-    };
-    /**
-     * Grid or List View
-     */
-    public grid: boolean = true;
-    private subscriptions: any[] = [];
-    private urlSubscriptions: any[] = [];
-    @ViewChild('editIndicatorModal') editIndicatorModal: AlertModal;
-    @ViewChild('deleteIndicatorModal') deleteIndicatorModal: AlertModal;
-
-    constructor(private layoutService: LayoutService,
-                private stakeholderService: StakeholderService,
-                private statisticsService: StatisticsService,
-                private fb: FormBuilder,
-                private sanitizer: DomSanitizer) {
+  
+  @Input()
+  public properties: EnvProperties = null;
+  @Input()
+  public topicIndex: number = 0;
+  @Input()
+  public categoryIndex: number = 0;
+  @Input()
+  public subcategoryIndex: number = 0;
+  @Input()
+  public stakeholder: Stakeholder = null;
+  public indicatorUtils: IndicatorUtils = new IndicatorUtils();
+  public indicatorFb: FormGroup;
+  /**
+   * Editable indicator
+   */
+  public indicator: Indicator;
+  public index: number;
+  /**
+   * Displayed chart and numbers base on Top filters
+   */
+  public displayCharts: Indicator[] = [];
+  public displayNumbers: Indicator[] = [];
+  /**
+   * Top filters
+   */
+  public filters: FormGroup;
+  public all: Option = {
+    value: 'all',
+    label: 'All'
+  };
+  /**
+   * Toggles
+   */
+  public grid: boolean = true;
+  public numberReorder: boolean = false;
+  public chartReorder: boolean = false;
+  private subscriptions: any[] = [];
+  private urlSubscriptions: any[] = [];
+  @ViewChild('editIndicatorModal') editIndicatorModal: AlertModal;
+  @ViewChild('deleteIndicatorModal') deleteIndicatorModal: AlertModal;
+  
+  constructor(private layoutService: LayoutService,
+              private stakeholderService: StakeholderService,
+              private statisticsService: StatisticsService,
+              private fb: FormBuilder,
+              private sanitizer: DomSanitizer) {
+  }
+  
+  ngOnInit(): void {
+    this.buildFilters();
+  }
+  
+  ngOnDestroy(): void {
+    this.subscriptions.forEach(value => {
+      if (value instanceof Subscriber) {
+        value.unsubscribe();
+      } else if (value instanceof Function) {
+        value();
+      }
+    });
+  }
+  
+  ngAfterViewInit(): void {
+    if (document !== undefined) {
+      let callback = (list): void => {
+        let items: HTMLCollection = list.current.children;
+        let reordered = [];
+        for (let i = 0; i < items.length; i++) {
+          if (items.item(i).id) {
+            reordered.push(items.item(i).id);
+          }
+        }
+        this.reorderIndicators(list.current.id, reordered);
+      };
+      this.subscriptions.push(UIkit.util.on(document, 'moved', '#chart', callback));
+      this.subscriptions.push(UIkit.util.on(document, 'moved', '#number', callback));
+      this.subscriptions.push(UIkit.util.on(document, 'stop', '#chart', (): void => {
+        this.chartReorder = false;
+      }));
+      this.subscriptions.push(UIkit.util.on(document, 'stop', '#number', (): void => {
+        this.numberReorder = false;
+      }));
     }
-
-    ngOnInit(): void {
+  }
+  
+  ngOnChanges(changes: SimpleChanges): void {
+    if (this.canEdit) {
+      if (changes.topicIndex || changes.categoryIndex || changes.subcategoryIndex) {
         this.buildFilters();
+      }
+      this.filterCharts();
+      this.filterNumbers();
     }
-
-    ngOnDestroy(): void {
-        this.subscriptions.forEach(value => {
-            if (value instanceof Subscriber) {
-                value.unsubscribe();
-            } else if (value instanceof Function) {
-                value();
-            }
-        });
+  }
+  
+  public toggleOpen(event = null) {
+    if (!event) {
+      this.layoutService.setOpen(!this.open);
+    } else if (event && event['value'] === true) {
+      this.layoutService.setOpen(false);
     }
-
-    ngAfterViewInit(): void {
-        if (document !== undefined) {
-            let callback = (list): void => {
-                let items: HTMLCollection = list.current.children;
-                let reordered = [];
-                for (let i = 0; i < items.length; i++) {
-                    if (items.item(i).id) {
-                        reordered.push(items.item(i).id);
-                    }
-                }
-                this.reorderIndicators(list.current.id, reordered);
-            };
-            this.subscriptions.push(UIkit.util.on(document, 'moved', '#chart', callback));
-            this.subscriptions.push(UIkit.util.on(document, 'moved', '#number', callback));
+  }
+  
+  public changeGrid(value) {
+    this.grid = value;
+  }
+  
+  private buildFilters() {
+    this.filters = this.fb.group({
+      chartType: this.fb.control('all'),
+      privacy: this.fb.control('all'),
+      status: this.fb.control('all'),
+      keyword: this.fb.control('')
+    });
+    this.subscriptions.push(this.filters.get('chartType').valueChanges.subscribe(value => {
+      this.onChartTypeChange(value);
+    }));
+    this.subscriptions.push(this.filters.get('privacy').valueChanges.subscribe(value => {
+      this.onPrivacyChange(value);
+    }));
+    this.subscriptions.push(this.filters.get('status').valueChanges.subscribe(value => {
+      this.onStatusChange(value);
+    }));
+    this.subscriptions.push(this.filters.get('keyword').valueChanges.subscribe(value => {
+      this.onKeywordChange(value);
+    }));
+  }
+  
+  filterCharts() {
+    this.displayCharts = this.filterChartType(this.filterPrivacy(
+      this.filterStatus(this.filterByKeyword(this.charts, this.filters.value.keyword),
+        this.filters.value.status),
+      this.filters.value.privacy),
+      this.filters.value.chartType
+    );
+  }
+  
+  filterNumbers() {
+    this.displayNumbers = this.filterPrivacy(this.filterStatus(
+      this.filterByKeyword(this.numbers, this.filters.value.keyword),
+      this.filters.value.status),
+      this.filters.value.privacy);
+  }
+  
+  onLongPress(type = 'chart') {
+    if(type === 'number') {
+      this.numberReorder = true;
+    } else {
+      this.chartReorder = true;
+    }
+  }
+  
+  onChartTypeChange(value) {
+    this.displayCharts = this.filterChartType(this.charts, value);
+  }
+  
+  onPrivacyChange(value) {
+    this.displayCharts = this.filterPrivacy(this.charts, value);
+    this.displayNumbers = this.filterPrivacy(this.numbers, value);
+  }
+  
+  onStatusChange(value) {
+    this.displayCharts = this.filterStatus(this.charts, value);
+    this.displayNumbers = this.filterStatus(this.numbers, value);
+  }
+  
+  onKeywordChange(value) {
+    this.displayCharts = this.filterByKeyword(this.charts, value);
+    this.displayNumbers = this.filterByKeyword(this.numbers, value);
+  }
+  
+  private filterChartType(indicators: Indicator[], value): Indicator[] {
+    if (value === 'all') {
+      return indicators;
+    } else {
+      return indicators.filter(indicator =>
+        indicator.indicatorPaths.filter(indicatorPath => indicatorPath.type === value).length > 0);
+    }
+  }
+  
+  private filterPrivacy(indicators: Indicator[], value): Indicator[] {
+    if (value === 'all') {
+      return indicators;
+    } else {
+      return indicators.filter(indicator => indicator.isPublic === value);
+    }
+  }
+  
+  private filterStatus(indicators: Indicator[], value): Indicator[] {
+    if (value === 'all') {
+      return indicators;
+    } else {
+      return indicators.filter(indicator => indicator.isActive === value);
+    }
+  }
+  
+  private filterByKeyword(indicators: Indicator[], value): Indicator[] {
+    if (value === null || value === '') {
+      return indicators;
+    } else {
+      return indicators.filter(indicator => (indicator.name && indicator.name.toLowerCase().includes(value.toLowerCase()))
+        || (indicator.description && indicator.description.toLowerCase().includes(value.toLowerCase())));
+    }
+  }
+  
+  get charts(): Indicator[] {
+    return this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].charts;
+  }
+  
+  set charts(indicators: Indicator[]) {
+    this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].charts = indicators;
+  }
+  
+  get numbers(): Indicator[] {
+    return this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].numbers;
+  }
+  
+  set numbers(indicators: Indicator[]) {
+    this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].numbers = indicators;
+  }
+  
+  get open(): boolean {
+    return this.layoutService.open;
+  }
+  
+  get canNumbersReorder(): boolean {
+    return this.numberReorder && this.displayNumbers.length === this.numbers.length && this.grid;
+  }
+  
+  get canChartsReorder(): boolean {
+    return this.chartReorder && this.displayCharts.length === this.charts.length && this.grid;
+  }
+  
+  get canEdit() {
+    return this.stakeholder &&
+      this.stakeholder.topics[this.topicIndex] &&
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex] &&
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex];
+  }
+  
+  public get indicatorPaths(): FormArray {
+    return this.indicatorFb.get('indicatorPaths') as FormArray;
+  }
+  
+  public getParameters(index: number): FormArray {
+    return this.indicatorPaths.at(index).get('parameters') as FormArray;
+  }
+  
+  public getParameter(index: number, key: string): FormControl {
+    return this.getParameters(index).controls.filter(control => control.value.key === key)[0] as FormControl;
+  }
+  
+  private getSecureUrlByStakeHolder(indicatorPath: IndicatorPath) {
+    return this.sanitizer.bypassSecurityTrustResourceUrl(
+      this.statisticsService.getChartUrl(indicatorPath.source, this.indicatorUtils.getFullUrl(indicatorPath)));
+  }
+  
+  private getUrlByStakeHolder(indicatorPath: IndicatorPath) {
+    return this.statisticsService.getChartUrl(indicatorPath.source, this.indicatorUtils.getFullUrl(indicatorPath));
+  }
+  
+  public addIndicatorPath(value: string = '', parameters: FormArray = new FormArray([])) {
+    this.indicatorPaths.push(this.fb.group({
+        url: this.fb.control(value, [Validators.required,
+          Validators.pattern('https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.' +
+            '[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.' +
+            '[a-zA-Z0-9]+\.[^\s]{2,}')]),
+        parameters: parameters
+      }
+    ));
+    let index = this.indicatorPaths.length - 1;
+    this.urlSubscriptions.push(this.indicatorPaths.at(index).valueChanges.subscribe(value => {
+        if (this.indicatorPaths.at(index).valid) {
+          let indicatorPath: IndicatorPath = this.indicatorUtils.generateIndicatorByChartUrl(this.statisticsService.getChartSource(value.url), value.url);
+          let parameters = this.getParametersAsFormArray(indicatorPath);
+          (this.indicatorPaths.at(index) as FormGroup).setControl('parameters', parameters);
+          if (!this.indicator.indicatorPaths[index]) {
+            this.indicator.indicatorPaths[index] = indicatorPath;
+            this.indicator.indicatorPaths[index].safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath);
+          } else {
+            indicatorPath.safeResourceUrl = this.indicator.indicatorPaths[index].safeResourceUrl;
+            this.indicator.indicatorPaths[index] = indicatorPath;
+          }
         }
-    }
-
-    ngOnChanges(changes: SimpleChanges): void {
-        if (this.canEdit) {
-            if (changes.topicIndex || changes.categoryIndex || changes.subcategoryIndex) {
-                this.buildFilters();
-            }
-            this.filterCharts();
-            this.filterNumbers();
+      })
+    );
+  }
+  
+  private getParametersAsFormArray(indicatorPath: IndicatorPath): FormArray {
+    let parameters = this.fb.array([]);
+    if (indicatorPath.parameters) {
+      Object.keys(indicatorPath.parameters).forEach(key => {
+        if (this.indicatorUtils.ignoredParameters.indexOf(key) === -1) {
+          if (this.indicatorUtils.parametersValidators.has(key)) {
+            parameters.push(this.fb.group({
+              key: this.fb.control(key),
+              value: this.fb.control(indicatorPath.parameters[key], this.indicatorUtils.parametersValidators.get(key))
+            }));
+          } else {
+            parameters.push(this.fb.group({
+              key: this.fb.control(key),
+              value: this.fb.control(indicatorPath.parameters[key])
+            }));
+          }
         }
+      });
     }
-
-    public toggleOpen(event = null) {
-        if (!event) {
-            this.layoutService.setOpen(!this.open);
-        } else if (event && event['value'] === true) {
-            this.layoutService.setOpen(false);
-        }
+    return parameters;
+  }
+  
+  public editChartIndicatorOpen(id = null) {
+    this.urlSubscriptions.forEach(value => {
+      if (value instanceof Subscriber) {
+        value.unsubscribe();
+      }
+    });
+    this.index = (id) ? this.charts.findIndex(value => value._id === id) : -1;
+    if (this.index !== -1) {
+      this.indicator = HelperFunctions.copy(this.charts[this.index]);
+      this.indicatorFb = this.fb.group({
+        id: this.fb.control(this.indicator._id),
+        name: this.fb.control(this.indicator.name/*, Validators.required*/),
+        description: this.fb.control(this.indicator.description),
+        isPublic: this.fb.control(this.indicator.isPublic),
+        isActive: this.fb.control(this.indicator.isActive),
+        indicatorPaths: this.fb.array([]),
+        width: this.fb.control(this.indicator.width),
+      });
+      this.indicator.indicatorPaths.forEach(indicatorPath => {
+        this.addIndicatorPath(this.getUrlByStakeHolder(indicatorPath), this.getParametersAsFormArray(indicatorPath));
+        indicatorPath.safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath)
+      });
+    } else {
+      this.indicator = new Indicator('', '', 'chart', 'small', false, false, []);
+      this.indicatorFb = this.fb.group({
+        id: this.fb.control(null),
+        name: this.fb.control(''),
+        description: this.fb.control(''),
+        isPublic: this.fb.control(false),
+        isActive: this.fb.control(false),
+        indicatorPaths: this.fb.array([]),
+        width: this.fb.control('small', Validators.required),
+      });
+      this.addIndicatorPath();
     }
-
-    public changeGrid(value) {
-        this.grid = value;
+    this.editIndicatorModal.cancelButtonText = 'Cancel';
+    this.editIndicatorModal.okButtonLeft = false;
+    this.editIndicatorModal.alertMessage = false;
+    if (this.index === -1) {
+      this.editIndicatorModal.alertTitle = 'Create a new chart Indicator';
+      this.editIndicatorModal.okButtonText = 'Save';
+    } else {
+      this.editIndicatorModal.okButtonText = 'Save Changes';
     }
-
-    private buildFilters() {
-        this.filters = this.fb.group({
-            chartType: this.fb.control('all'),
-            privacy: this.fb.control('all'),
-            status: this.fb.control('all'),
-            keyword: this.fb.control('')
-        });
-        this.subscriptions.push(this.filters.get('chartType').valueChanges.subscribe(value => {
-            this.onChartTypeChange(value);
-        }));
-        this.subscriptions.push(this.filters.get('privacy').valueChanges.subscribe(value => {
-            this.onPrivacyChange(value);
-        }));
-        this.subscriptions.push(this.filters.get('status').valueChanges.subscribe(value => {
-            this.onStatusChange(value);
-        }));
-        this.subscriptions.push(this.filters.get('keyword').valueChanges.subscribe(value => {
-            this.onKeywordChange(value);
-        }));
+    this.editIndicatorModal.open();
+  }
+  
+  saveIndicator() {
+    if (this.indicator.type === 'chart') {
+      this.indicator = this.indicatorUtils.generateIndicatorByForm(this.indicatorFb.value, this.indicator.indicatorPaths);
     }
-
-    filterCharts() {
-        this.displayCharts = this.filterChartType(this.filterPrivacy(
-            this.filterStatus(this.filterByKeyword(this.charts, this.filters.value.keyword),
-                this.filters.value.status),
-            this.filters.value.privacy),
-            this.filters.value.chartType
-        );
-    }
-
-    filterNumbers() {
-        this.displayNumbers = this.filterPrivacy(this.filterStatus(
-            this.filterByKeyword(this.numbers, this.filters.value.keyword),
-            this.filters.value.status),
-            this.filters.value.privacy);
-    }
-
-    onChartTypeChange(value) {
-        this.displayCharts = this.filterChartType(this.charts, value);
-    }
-
-    onPrivacyChange(value) {
-        this.displayCharts = this.filterPrivacy(this.charts, value);
-        this.displayNumbers = this.filterPrivacy(this.numbers, value);
-    }
-
-    onStatusChange(value) {
-        this.displayCharts = this.filterStatus(this.charts, value);
-        this.displayNumbers = this.filterStatus(this.numbers, value);
-    }
-
-    onKeywordChange(value) {
-        this.displayCharts = this.filterByKeyword(this.charts, value);
-        this.displayNumbers = this.filterByKeyword(this.numbers, value);
-    }
-
-    private filterChartType(indicators: Indicator[], value): Indicator[] {
-        if (value === 'all') {
-            return indicators;
-        } else {
-            return indicators.filter(indicator =>
-                indicator.indicatorPaths.filter(indicatorPath => indicatorPath.type === value).length > 0);
-        }
-    }
-
-    private filterPrivacy(indicators: Indicator[], value): Indicator[] {
-        if (value === 'all') {
-            return indicators;
-        } else {
-            return indicators.filter(indicator => indicator.isPublic === value);
-        }
-    }
-
-    private filterStatus(indicators: Indicator[], value): Indicator[] {
-        if (value === 'all') {
-            return indicators;
-        } else {
-            return indicators.filter(indicator => indicator.isActive === value);
-        }
-    }
-
-    private filterByKeyword(indicators: Indicator[], value): Indicator[] {
-        if (value === null || value === '') {
-            return indicators;
-        } else {
-            return indicators.filter(indicator => (indicator.name && indicator.name.toLowerCase().includes(value.toLowerCase()))
-                || (indicator.description && indicator.description.toLowerCase().includes(value.toLowerCase())));
-        }
-    }
-
-    get charts(): Indicator[] {
-        return this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].charts;
-    }
-
-    set charts(indicators: Indicator[]) {
-        this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].charts = indicators;
-    }
-
-    get numbers(): Indicator[] {
-        return this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].numbers;
-    }
-
-    set numbers(indicators: Indicator[]) {
-        this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex].numbers = indicators;
-    }
-
-    get open(): boolean {
-        return this.layoutService.open;
-    }
-
-    get canNumbersReorder(): boolean {
-        return this.displayNumbers.length === this.numbers.length;
-    }
-
-    get canChartsReorder(): boolean {
-        return this.displayCharts.length === this.charts.length;
-    }
-
-    get canEdit() {
-        return this.stakeholder &&
-            this.stakeholder.topics[this.topicIndex] &&
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex] &&
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex];
-    }
-
-    public get indicatorPaths(): FormArray {
-        return this.indicatorFb.get('indicatorPaths') as FormArray;
-    }
-
-    public getParameters(index: number): FormArray {
-        return this.indicatorPaths.at(index).get('parameters') as FormArray;
-    }
-
-    public getParameter(index: number, key: string): FormControl {
-        return this.getParameters(index).controls.filter(control => control.value.key === key)[0] as FormControl;
-    }
-
-    private getSecureUrlByStakeHolder(indicatorPath: IndicatorPath) {
-        return this.sanitizer.bypassSecurityTrustResourceUrl(
-            this.statisticsService.getChartUrl(indicatorPath.source, this.indicatorUtils.getFullUrl(indicatorPath)));
-    }
-
-    private getUrlByStakeHolder(indicatorPath: IndicatorPath) {
-        return this.statisticsService.getChartUrl(indicatorPath.source, this.indicatorUtils.getFullUrl(indicatorPath));
-    }
-
-    public addIndicatorPath(value: string = '', parameters: FormArray = new FormArray([])) {
-        this.indicatorPaths.push(this.fb.group({
-                url: this.fb.control(value, [Validators.required,
-                    Validators.pattern('https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.' +
-                        '[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.' +
-                        '[a-zA-Z0-9]+\.[^\s]{2,}')]),
-                parameters: parameters
-            }
-        ));
-        let index = this.indicatorPaths.length - 1;
-        this.urlSubscriptions.push(this.indicatorPaths.at(index).valueChanges.subscribe(value => {
-                if (this.indicatorPaths.at(index).valid) {
-                    let indicatorPath: IndicatorPath = this.indicatorUtils.generateIndicatorByChartUrl(this.statisticsService.getChartSource(value.url), value.url);
-                    let parameters = this.getParametersAsFormArray(indicatorPath);
-                    (this.indicatorPaths.at(index) as FormGroup).setControl('parameters', parameters);
-                    if (!this.indicator.indicatorPaths[index]) {
-                        this.indicator.indicatorPaths[index] = indicatorPath;
-                        this.indicator.indicatorPaths[index].safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath);
-                    } else {
-                        indicatorPath.safeResourceUrl = this.indicator.indicatorPaths[index].safeResourceUrl;
-                        this.indicator.indicatorPaths[index] = indicatorPath;
-                    }
-                }
-            })
-        );
-    }
-
-    private getParametersAsFormArray(indicatorPath: IndicatorPath): FormArray {
-        let parameters = this.fb.array([]);
-        if (indicatorPath.parameters) {
-            Object.keys(indicatorPath.parameters).forEach(key => {
-                if (this.indicatorUtils.ignoredParameters.indexOf(key) === -1) {
-                    if (this.indicatorUtils.parametersValidators.has(key)) {
-                        parameters.push(this.fb.group({
-                            key: this.fb.control(key),
-                            value: this.fb.control(indicatorPath.parameters[key], this.indicatorUtils.parametersValidators.get(key))
-                        }));
-                    } else {
-                        parameters.push(this.fb.group({
-                            key: this.fb.control(key),
-                            value: this.fb.control(indicatorPath.parameters[key])
-                        }));
-                    }
-                }
-            });
-        }
-        return parameters;
-    }
-
-    public editChartIndicatorOpen(id = null) {
-        this.urlSubscriptions.forEach(value => {
-           if(value instanceof Subscriber) {
-               value.unsubscribe();
-           }
-        });
-        this.index = (id) ? this.charts.findIndex(value => value._id === id) : -1;
-        if (this.index !== -1) {
-            this.indicator = HelperFunctions.copy(this.charts[this.index]);
-            this.indicatorFb = this.fb.group({
-                id: this.fb.control(this.indicator._id),
-                name: this.fb.control(this.indicator.name/*, Validators.required*/),
-                description: this.fb.control(this.indicator.description),
-                isPublic: this.fb.control(this.indicator.isPublic),
-                isActive: this.fb.control(this.indicator.isActive),
-                indicatorPaths: this.fb.array([]),
-                width: this.fb.control(this.indicator.width),
-            });
-            this.indicator.indicatorPaths.forEach(indicatorPath => {
-                this.addIndicatorPath(this.getUrlByStakeHolder(indicatorPath), this.getParametersAsFormArray(indicatorPath));
-                indicatorPath.safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath)
-            });
-        } else {
-            this.indicator = new Indicator('', '', 'chart', 'small', false, false, []);
-            this.indicatorFb = this.fb.group({
-                id: this.fb.control(null),
-                name: this.fb.control(''),
-                description: this.fb.control(''),
-                isPublic: this.fb.control(false),
-                isActive: this.fb.control(false),
-                indicatorPaths: this.fb.array([]),
-                width: this.fb.control('small', Validators.required),
-            });
-            this.addIndicatorPath();
-        }
-        this.editIndicatorModal.cancelButtonText = 'Cancel';
-        this.editIndicatorModal.okButtonLeft = false;
-        this.editIndicatorModal.alertMessage = false;
-        if (this.index === -1) {
-            this.editIndicatorModal.alertTitle = 'Create a new chart Indicator';
-            this.editIndicatorModal.okButtonText = 'Save';
-        } else {
-            this.editIndicatorModal.okButtonText = 'Save Changes';
-        }
-        this.editIndicatorModal.open();
-    }
-
-    saveIndicator() {
-        if (this.indicator.type === 'chart') {
-            this.indicator = this.indicatorUtils.generateIndicatorByForm(this.indicatorFb.value, this.indicator.indicatorPaths);
-        }
-        let path = [
-            this.stakeholder._id,
-            this.stakeholder.topics[this.topicIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id
-        ];
-        this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, this.indicator, path).subscribe(indicator => {
-            if (this.index !== -1) {
-                this.charts[this.index] = indicator;
-            } else {
-                this.charts.push(indicator);
-            }
-            this.filterCharts();
-            this.stakeholderService.setStakeholder(this.stakeholder);
-            this.indicatorFb = null;
-        }, error => {
-            this.indicatorFb = null;
-        });
-    }
-
-    reorderIndicators(type: string, indicatorIds: string[]) {
-        let path = [
-            this.stakeholder._id,
-            this.stakeholder.topics[this.topicIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id
-        ];
-        this.stakeholderService.reorderIndicators(this.properties.monitorServiceAPIURL, path, indicatorIds, type).subscribe(indicators => {
-            if (type === 'chart') {
-                this.charts = indicators;
-                this.filterCharts();
-            } else {
-                this.numbers = indicators;
-                this.filterNumbers();
-            }
-            this.stakeholderService.setStakeholder(this.stakeholder);
-        });
-    }
-
-    hasDifference(index: number): boolean {
-        return this.indicator.indicatorPaths[index].safeResourceUrl.toString() !==
-            this.getSecureUrlByStakeHolder(this.indicator.indicatorPaths[index]).toString();
-    }
-
-    refreshIndicator() {
-        this.indicator = this.indicatorUtils.generateIndicatorByForm(this.indicatorFb.value, this.indicator.indicatorPaths);
-        this.indicator.indicatorPaths.forEach(indicatorPath => {
-            indicatorPath.safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath);
-        });
-    }
-
-    deleteIndicatorOpen(id: string, type: string = 'chart') {
-        if (type === 'chart') {
-            this.indicator = this.charts.find(value => value._id == id);
-        } else {
-            this.indicator = this.numbers.find(value => value._id == id);
-        }
-        this.deleteIndicatorModal.alertTitle = 'Delete ' + this.indicator.name;
-        this.deleteIndicatorModal.cancelButtonText = 'No';
-        this.deleteIndicatorModal.okButtonText = 'Yes';
-        this.deleteIndicatorModal.message = 'This indicator will permanently be deleted. Are you sure you want to proceed?';
-        this.deleteIndicatorModal.open();
-    }
-
-    deleteIndicator() {
-        let path = [
-            this.stakeholder._id,
-            this.stakeholder.topics[this.topicIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id,
-            this.indicator._id
-        ];
-        this.stakeholderService.deleteElement(this.properties.monitorServiceAPIURL, path).subscribe(() => {
-            if (this.indicator.type === 'chart') {
-                this.charts.splice(this.index, 1);
-            } else {
-                this.numbers.splice(this.index, 1);
-            }
-            this.stakeholderService.setStakeholder(this.stakeholder);
-        });
-    }
-
-    toggleIndicatorStatus(indicator: Indicator) {
-        let path = [
-            this.stakeholder._id,
-            this.stakeholder.topics[this.topicIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id,
-            indicator._id
-        ];
-        this.stakeholderService.toggleStatus(this.properties.monitorServiceAPIURL, path).subscribe(isActive => {
-            indicator.isActive = isActive;
-            this.stakeholderService.setStakeholder(this.stakeholder);
-        });
-    }
-
-    toggleIndicatorAccess(indicator: Indicator) {
-        let path = [
-            this.stakeholder._id,
-            this.stakeholder.topics[this.topicIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id,
-            indicator._id
-        ];
-        this.stakeholderService.toggleAccess(this.properties.monitorServiceAPIURL, path).subscribe(isPublic => {
-            indicator.isPublic = isPublic;
-            this.stakeholderService.setStakeholder(this.stakeholder);
-        });
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id
+    ];
+    this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, this.indicator, path).subscribe(indicator => {
+      if (this.index !== -1) {
+        this.charts[this.index] = indicator;
+      } else {
+        this.charts.push(indicator);
+      }
+      this.filterCharts();
+      this.stakeholderService.setStakeholder(this.stakeholder);
+      this.indicatorFb = null;
+    }, error => {
+      this.indicatorFb = null;
+    });
+  }
+  
+  reorderIndicators(type: string, indicatorIds: string[]) {
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id
+    ];
+    this.stakeholderService.reorderIndicators(this.properties.monitorServiceAPIURL, path, indicatorIds, type).subscribe(indicators => {
+      if (type === 'chart') {
+        this.charts = indicators;
+        this.filterCharts();
+      } else {
+        this.numbers = indicators;
+        this.filterNumbers();
+      }
+      this.stakeholderService.setStakeholder(this.stakeholder);
+    });
+  }
+  
+  hasDifference(index: number): boolean {
+    return this.indicator.indicatorPaths[index].safeResourceUrl.toString() !==
+      this.getSecureUrlByStakeHolder(this.indicator.indicatorPaths[index]).toString();
+  }
+  
+  refreshIndicator() {
+    this.indicator = this.indicatorUtils.generateIndicatorByForm(this.indicatorFb.value, this.indicator.indicatorPaths);
+    this.indicator.indicatorPaths.forEach(indicatorPath => {
+      indicatorPath.safeResourceUrl = this.getSecureUrlByStakeHolder(indicatorPath);
+    });
+  }
+  
+  deleteIndicatorOpen(id: string, type: string = 'chart') {
+    if (type === 'chart') {
+      this.indicator = this.charts.find(value => value._id == id);
+    } else {
+      this.indicator = this.numbers.find(value => value._id == id);
     }
+    this.deleteIndicatorModal.alertTitle = 'Delete ' + this.indicator.name;
+    this.deleteIndicatorModal.cancelButtonText = 'No';
+    this.deleteIndicatorModal.okButtonText = 'Yes';
+    this.deleteIndicatorModal.message = 'This indicator will permanently be deleted. Are you sure you want to proceed?';
+    this.deleteIndicatorModal.open();
+  }
+  
+  deleteIndicator() {
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id,
+      this.indicator._id
+    ];
+    this.stakeholderService.deleteElement(this.properties.monitorServiceAPIURL, path).subscribe(() => {
+      if (this.indicator.type === 'chart') {
+        this.charts.splice(this.index, 1);
+      } else {
+        this.numbers.splice(this.index, 1);
+      }
+      this.stakeholderService.setStakeholder(this.stakeholder);
+    });
+  }
+  
+  toggleIndicatorStatus(indicator: Indicator) {
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id,
+      indicator._id
+    ];
+    this.stakeholderService.toggleStatus(this.properties.monitorServiceAPIURL, path).subscribe(isActive => {
+      indicator.isActive = isActive;
+      this.stakeholderService.setStakeholder(this.stakeholder);
+    });
+  }
+  
+  toggleIndicatorAccess(indicator: Indicator) {
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.categoryIndex].subCategories[this.subcategoryIndex]._id,
+      indicator._id
+    ];
+    this.stakeholderService.toggleAccess(this.properties.monitorServiceAPIURL, path).subscribe(isPublic => {
+      indicator.isPublic = isPublic;
+      this.stakeholderService.setStakeholder(this.stakeholder);
+    });
+  }
 }
diff --git a/src/app/topic/topic.module.ts b/src/app/topic/topic.module.ts
index a7b9393..262be5d 100644
--- a/src/app/topic/topic.module.ts
+++ b/src/app/topic/topic.module.ts
@@ -12,13 +12,12 @@ import {FormsModule, ReactiveFormsModule} from "@angular/forms";
 import {IndicatorsComponent} from "./indicators.component";
 import {AlertModalModule} from "../openaireLibrary/utils/modal/alertModal.module";
 import {InputModule} from "../library/sharedComponents/input/input.module";
-import {DragDropModule} from "@angular/cdk/drag-drop";
 import {ClickModule} from "../openaireLibrary/utils/click/click.module";
 
 @NgModule({
   imports: [
     CommonModule, TopicRoutingModule, ClickModule, RouterModule, FormsModule, AlertModalModule,
-    ReactiveFormsModule, InputModule, DragDropModule
+    ReactiveFormsModule, InputModule
   ],
   declarations: [
     TopicComponent, IndicatorsComponent