Project

General

Profile

« Previous | Next » 

Revision 60161

[Monitor Dashboard | Trunk]: Add note for https on edit-stakeholder. Change number indicator form logic

View differences:

modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/monitor/monitor.component.html
137 137
                      out of
138 138
                      {{countSelectedFilters()}}</div>
139 139
                    <div class="uk-text-bold ">{{indicator.name}}</div>
140
                    <h3 *ngIf="numberResults.get(i + '-' + j)" class="uk-margin-medium-top uk-text-bold">
141
                      <span>{{numberResults.get(i + '-' + j) | number}}</span>
140
                    <h3 class="uk-margin-medium-top uk-text-bold">
141
                      <span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | number}}</span>
142
                      <span *ngIf="!numberResults.get(i + '-' + j)">--</span>
142 143
                    </h3>
143 144
                    <!--<ng-container *ngTemplateOutlet="description; context: {indicator:indicator}"></ng-container>-->
144 145
                  </div>
modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/monitor/monitor.component.ts
435 435
              result = result[jsonPath];
436 436
            }
437 437
          });
438
          if (typeof result === 'string' || typeof result === 'number') {
439
            result = Number(result);
440
            if (result === Number.NaN) {
441
              result = 0;
442
            }
443
          } else {
444
            result = 0;
445
          }
438 446
          this.numberResults.set(i + '-' + j, result);
439 447
        });
440 448
      }));
modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/general/edit-stakeholder/edit-stakeholder.component.ts
10 10
import {UtilitiesService} from "../../openaireLibrary/services/utilities.service";
11 11
import {Session, User} from "../../openaireLibrary/login/utils/helper.class";
12 12
import {UserManagementService} from "../../openaireLibrary/services/user-management.service";
13
import {StringUtils} from "../../openaireLibrary/utils/string-utils.class";
13 14

  
14 15
declare var UIkit;
15 16

  
......
73 74
            </div>
74 75
          </div>
75 76
        </div>
77
        <div class="uk-margin-remove-top uk-width-1-1">
78
          <div class="uk-flex uk-flex-right" uk-grid>
79
            <div class="uk-width-3-5@l uk-width-1-1 uk-text-small">
80
              <span class="uk-text-bold">Note:</span> Prefer urls like "<span class="uk-text-bold">https://example.com/my-secure-image.png</span>" instead
81
              of "http://example.com/my-image.png".
82
              <span class="uk-text-bold">Browsers may not load non secure content.</span>
83
            </div>
84
          </div>
85
        </div>
76 86
        <div *ngIf="uploadError" class="uk-text-danger uk-width-1-1">{{uploadError}}</div>
77 87
        <div dashboard-input class="uk-width-1-3@m" [formInput]="stakeholderFb.get('visibility')"
78 88
             [placeholder]="'Select a status'"
......
155 165
            [
156 166
              Validators.required,
157 167
              this.stakeholderUtils.aliasValidatorString(
158
                  this.alias.filter(alias => alias !== this.stakeholder.alias)
168
                this.alias.filter(alias => alias !== this.stakeholder.alias)
159 169
              )]
160 170
          ),
161 171
          isDefault: this.fb.control((this.isDefault)),
......
163 173
          type: this.fb.control(this.stakeholder.type, Validators.required),
164 174
          topics: this.fb.control(this.stakeholder.topics),
165 175
          isUpload: this.fb.control(this.stakeholder.isUpload),
166
          logoUrl: this.fb.control(this.stakeholder.logoUrl),
176
          logoUrl: this.fb.control(this.stakeholder.logoUrl, StringUtils.urlValidator()),
167 177
        });
168 178
        this.initPhoto();
169 179
        if (!isDefault) {
modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.component.html
57 57
              <span class="uk-icon-button small portal-icon-button">
58 58
                <icon name="add"></icon>
59 59
              </span>
60
              <span class="uk-hidden-hover space" [class.uk-hidden]="!open"> Create new topic</span>
60
              <span [class.uk-hidden-hover]="stakeholder.topics.length > 0" class="space" [class.uk-hidden]="!open"> Create new topic</span>
61 61
            </span>
62 62
          </li>
63 63
        </ul>
......
141 141
                <span class="uk-icon-button small portal-icon-button">
142 142
                  <icon name="add"></icon>
143 143
                </span>
144
                <span class="uk-hidden-hover space">Create new category</span>
144
                <span [class.uk-hidden-hover]="stakeholder.topics[topicIndex].categories.length > 0" class="space">Create new category</span>
145 145
              </span>
146 146
          </li>
147 147
        </ul>
......
194 194
              <span class="uk-icon-button small portal-icon-button">
195 195
                <icon name="add"></icon>
196 196
              </span>
197
              <span class="uk-hidden-hover space">Create new subcategory</span>
197
              <span [class.uk-hidden-hover]="stakeholder.topics[topicIndex].categories[selectedCategoryIndex].subCategories.length > 0" class="space">Create new subcategory</span>
198 198
            </span>
199 199
      </li>
200 200
    </ul>
modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/indicators.component.html
76 76
                <div class="uk-text-center uk-text-bold">
77 77
                  {{indicator.name ? indicator.name : 'No title available'}}
78 78
                </div>
79
                <h3 *ngIf="numberResults.get(i + '-' + j)" class="uk-margin-medium-top uk-text-center uk-text-bold">
80
                  <span>{{numberResults.get(i + '-' + j) | number}}</span>
79
                <h3 class="uk-margin-medium-top uk-text-center uk-text-bold">
80
                  <span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | number}}</span>
81
                  <span *ngIf="!numberResults.get(i + '-' + j)">--</span>
81 82
                </h3>
82 83
                <!--<ng-container *ngTemplateOutlet="description; context: {indicator:indicator}"></ng-container>-->
83 84
              </div>
......
270 271
              </div>
271 272
            </div>
272 273
            <div formArrayName="jsonPath" class="uk-width-1-1">
273
              <h6 class="uk-text-bold uk-flex uk-flex-middle uk-margin-remove-bottom"
274
                  [class.uk-text-danger]="numberIndicatorPaths.at(i).get('result').invalid && numberIndicatorPaths.at(i).get('result').errors.required">
274
              <h6 class="uk-text-bold uk-flex uk-flex-middle uk-margin-remove-bottom">
275 275
                <span>JSON Path</span>
276 276
              </h6>
277
              <div
278
                  *ngIf="numberIndicatorPaths.at(i).get('result').invalid && numberIndicatorPaths.at(i).get('result').errors.required">
277
              <div *ngIf="numberIndicatorPaths.at(i).get('result').invalid && numberIndicatorPaths.at(i).get('result').errors.required">
279 278
                <div class="uk-text-danger uk-text-small">
280 279
                  This JSON path is not valid or the result has not been calculated yet.
281 280
                  Please press calculate on box below to see the result.
......
286 285
                  <div dashboard-input class="uk-width-1-1"
287 286
                       [extraLeft]="false"
288 287
                       [formInput]="jsonPath"
289
                       placeholder="Write a field name"
288
                       placeholder="Write a field"
290 289
                       [label]="'Level ' + +(j + 1)">
291 290
                    <div class="uk-flex uk-flex-middle">
292 291
                    <span *ngIf="getJsonPath(i).length !== 1"
293
                          class=" uk-margin-small-left uk-text-danger clickable"
292
                          [class.uk-hidden]="numberIndicatorFb.get('defaultId').value"
293
                          class="uk-margin-small-left uk-text-danger clickable"
294
                          [class.uk-disabled]="getJsonPath(i).disabled"
294 295
                          (click)="removeJsonPath(i, j)">
295 296
                      <icon name="close"></icon>
296 297
                    </span>
......
310 311
            </div>
311 312
            <div class="uk-width-1-1 uk-flex uk-flex-center">
312 313
              <div class="uk-flex uk-position-relative">
313
                <span class="uk-padding number number-preview">
314
                  <span
315
                      *ngIf="numberIndicatorPaths.at(i).get('result').valid">{{numberIndicatorPaths.at(i).get('result').value | number}}</span>
314
                <span class="uk-padding number number-preview uk-text-center">
315
                  <span *ngIf="numberIndicatorPaths.at(i).get('result').valid && numberIndicatorPaths.at(i).get('result').value !== 0">
316
                    {{numberIndicatorPaths.at(i).get('result').value | number}}
317
                  </span>
318
                  <span *ngIf="numberIndicatorPaths.at(i).get('result').valid && numberIndicatorPaths.at(i).get('result').value === 0">
319
                    --
320
                  </span>
316 321
                </span>
317 322
                <div *ngIf="numberIndicatorPaths.at(i).get('result').invalid"
318 323
                     class="uk-width-1-1 uk-height-1-1 refresh-indicator">
319 324
                  <div class="uk-position-relative uk-height-1-1">
320 325
                    <div class="uk-position-center uk-text-center clickable uk-text-small"
321
                         (click)="validateJsonPath(i)">
326
                         [class.uk-disabled]="numberIndicatorPaths.at(i).get('url').invalid"
327
                         (click)="validateJsonPath(i, true)">
322 328
                      <div>
323 329
                        <icon name="refresh"></icon>
324 330
                      </div>
modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/indicators.component.ts
30 30
import {Router} from "@angular/router";
31 31
import {Session} from "../openaireLibrary/login/utils/helper.class";
32 32
import {UserManagementService} from "../openaireLibrary/services/user-management.service";
33
import {StringUtils} from "../openaireLibrary/utils/string-utils.class";
33 34

  
34 35
declare var UIkit;
35 36

  
......
172 173
              result = result[jsonPath];
173 174
            }
174 175
          });
176
          if (typeof result === 'string' || typeof result === 'number') {
177
            result = Number(result);
178
            if (result === Number.NaN) {
179
              result = 0;
180
            }
181
          } else {
182
            result = 0;
183
          }
175 184
          this.numberResults.set(i + '-' + j, result);
176 185
        });
177 186
      }));
......
431 440
  
432 441
  public addJsonPath(index: number) {
433 442
    if (index == 0 && this.getJsonPath(index).getRawValue()[index].indexOf(",") != -1) {
434
      //if in the first path there are more than one paaths comma separated, split them and autogenerate the forms
443
      //if in the first path there are more than one paths comma separated, split them and autogenerate the forms
435 444
      let paths = this.getJsonPath(index).getRawValue()[index].split(",");
436 445
      for (let i = 0; i < paths.length; i++) {
437 446
        if (i != 0) {
......
439 448
        }
440 449
      }
441 450
      this.getJsonPath(index).setValue(paths)
442
      return;
451
    } else {
452
      this.getJsonPath(index).push(this.fb.control('', Validators.required));
443 453
    }
444
    this.getJsonPath(index).push(this.fb.control('', Validators.required));
445 454
  }
446 455
  
447 456
  public removeJsonPath(i: number, j: number) {
448
    this.getJsonPath(i).removeAt(j);
449
    if (this.getJsonPath(i).length !== this.getCurrentJsonPath(i).length) {
450
      this.getJsonPath(i).markAsDirty();
457
    if(this.getJsonPath(i).enabled) {
458
      this.getJsonPath(i).removeAt(j);
451 459
    }
452 460
  }
453 461
  
454
  public validateJsonPath(index: number) {
462
  public validateJsonPath(index: number, dirty: boolean = false) {
455 463
    let indicatorPath: FormGroup = <FormGroup>this.numberIndicatorPaths.at(index);
456 464
    if (this.indicator.defaultId === null) {
457 465
      this.getJsonPath(index).disable();
......
467 475
      setTimeout(() => {
468 476
        if (this.indicator.defaultId === null) {
469 477
          this.getJsonPath(index).enable();
478
          if(dirty) {
479
            this.getJsonPath(index).markAsDirty();
480
          }
470 481
        }
471 482
        indicatorPath.get('result').setErrors(null);
472
        console.debug(result);
473 483
        if (typeof result === 'string' || typeof result === 'number') {
474 484
          result = Number(result);
475 485
          if (result !== Number.NaN) {
476 486
            indicatorPath.get('result').setValue(result);
477 487
          } else {
478
            indicatorPath.get('result').setValue(null);
488
            indicatorPath.get('result').setValue(0);
479 489
          }
480 490
        } else {
481
          indicatorPath.get('result').setValue(null);
491
          indicatorPath.get('result').setValue(0);
482 492
        }
483 493
      }, 500);
494
    }, error => {
495
      setTimeout(() => {
496
        if (this.indicator.defaultId === null) {
497
          this.getJsonPath(index).enable();
498
          if (dirty) {
499
            this.getJsonPath(index).markAsDirty();
500
          }
501
        }
502
        indicatorPath.get('result').setErrors(null);
503
        indicatorPath.get('result').setValue(0);
504
      }, 500);
484 505
    }));
485 506
  }
486 507
  
......
514 535
      jsonPath.push(this.fb.control('', Validators.required));
515 536
    }
516 537
    this.numberIndicatorPaths.push(this.fb.group({
517
        url: this.fb.control(url, Validators.required),
538
        url: this.fb.control(url, [Validators.required, StringUtils.urlValidator()]),
518 539
        jsonPath: jsonPath,
519 540
        result: this.fb.control(0, Validators.required),
520 541
        // parameters: parameters,
......
587 608
  
588 609
  public addChartIndicatorPath(value: string = '', parameters: FormArray = new FormArray([]), disableUrl: boolean = false, type: string = null) {
589 610
    this.chartIndicatorPaths.push(this.fb.group({
590
        url: this.fb.control(value, [Validators.required,
591
          Validators.pattern('https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.' +
592
            '[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.' +
593
            '[a-zA-Z0-9]+\.[^\s]{2,}')]),
611
        url: this.fb.control(value, [Validators.required, StringUtils.urlValidator()]),
594 612
        parameters: parameters,
595 613
        type: this.fb.control(type)
596 614
      }
modules/uoa-monitor-portal/trunk/monitor_dashboard/src/assets/new.css
10 10
  --primary-color-rgb: var(--theme-secondary-color-rgb);
11 11
  --secondary-color-rgb: var(--theme-secondary-color-rgb);
12 12
}
13

  
14 13
/*Stakeholder Specific*/
15 14
.publicationsSearchForm {
16 15
  background-image: none;
......
145 144
  max-width: 50px;
146 145
  background: var(--secondary-color);
147 146
  color: var(--contrast-color);
148
  -webkit-clip-path: polygon(15% 5%, 100% 5%, 100% 100%, 0% 100%);
147
  -webkit-clip-path: polygon(20% 5%, 80% 5%, 100% 100%, 0% 100%);
149 148
  clip-path: polygon(20% 5%, 80% 5%, 100% 100%, 0% 100%);
150 149
  display: none;
150
  padding-left: 10px;
151 151
}
152 152

  
153 153
.dashboard .section {
modules/uoa-monitor-portal/trunk/monitor_dashboard/src/assets/dashboard-theme/input.css
10 10
}
11 11

  
12 12
.input-box {
13
  background-color: #FAFAFA;
13
  background-color: #FAFAFA !important;
14 14
  border: 1px solid transparent;
15 15
  padding: 16px;
16 16
  border-radius: 4px;

Also available in: Unified diff