advancing on custom login

proxy.conf.json

@@ -1,32 +1,52 @@
 {
-    "/js": {
+  "/js": {
-       "target":  {
+    "target": {
-         "host": "172.27.0.1",
+      "host": "172.27.0.1",
-         "protocol": "http:",
+      "protocol": "http:",
-         "port": 8000
+      "port": 8000
-       },
-       "secure": false,
-       "changeOrigin": true,
-       "logLevel": "info"
     },
-    "/info": {
+    "secure": false,
-        "target":  {
+    "changeOrigin": true,
-          "host": "172.27.0.1",
+    "logLevel": "info"
-          "protocol": "http:",
+  },
-          "port": 8000
+  "/info": {
-        },
+    "target": {
-        "secure": false,
+      "host": "172.27.0.1",
-        "changeOrigin": true,
+      "protocol": "http:",
-        "logLevel": "info"
+      "port": 8000
-     },
+    },
-    "/log.*": {
+    "secure": false,
-      "target":  {
+    "changeOrigin": true,
-        "host": "172.27.0.1",
+    "logLevel": "info"
-        "protocol": "http:",
+  },
-        "port": 8000
+  "/i18n": {
-      },
+    "target": {
-      "secure": false,
+      "host": "172.27.0.1",
-      "changeOrigin": true,
+      "protocol": "http:",
-      "logLevel": "info"
+      "port": 8000
-    }
+    },
-   }
+    "secure": false,
+    "changeOrigin": true,
+    "logLevel": "info"
+  },
+  "/log.*": {
+    "target": {
+      "host": "172.27.0.1",
+      "protocol": "http:",
+      "port": 8000
+    },
+    "secure": false,
+    "changeOrigin": true,
+    "logLevel": "info"
+  },
+  "/customAuth": {
+    "target": {
+      "host": "172.27.0.1",
+      "protocol": "http:",
+      "port": 8000
+    },
+    "secure": false,
+    "changeOrigin": true,
+    "logLevel": "info"
+  }
+}

src/app/app.module.ts

@@ -15,7 +15,6 @@ import { LoginComponent } from './login/login.component';
 import { ClientDownloadComponent } from './client-download/client-download.component';
 import { ServicesComponent } from './services/services.component';
 
-
 @NgModule({
   declarations: [
     AppComponent,

src/app/login/login.component.css

@@ -69,4 +69,4 @@
 	.card.fat .card-body {
 		padding: 15px;
 	}
-}
+}

src/app/login/login.component.html

@@ -23,15 +23,12 @@
               <input id="password" type="password" class="form-control" name="password" data-eye>
             </div>
 
-            <div class="form-group" *ngIf="false">
+            <div class="form-group" *ngIf="auths.length > 1">
               <label>
                 <uds-translate>Authenticator</uds-translate>
               </label>
-              <select class="custom-select">
+              <select class="custom-select" (change)="changeAuth($event.target.value)">
-                <option selected>Selected AUTH</option>
+                <option *ngFor="let a of auths" value="{{ a.id }}">{{ a.name }}</option>
-                <option value="1">One</option>
-                <option value="2">Two</option>
-                <option value="3">Three</option>
               </select>
             </div>
 

src/app/login/login.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { UdsApiService, Downloadable } from '../uds-api.service';
+import { UdsApiService, Authenticator } from '../uds-api.service';
 
 @Component({
   selector: 'uds-login',
@@ -7,10 +7,31 @@ import { UdsApiService, Downloadable } from '../uds-api.service';
   styleUrls: ['./login.component.css']
 })
 export class LoginComponent implements OnInit {
+  auths: Authenticator[];
 
-  constructor(public api: UdsApiService) { }
+  constructor(public api: UdsApiService) {
+    this.auths = api.config.authenticators.slice(0);
+    // Sort array, so we can display it correctly
+    this.auths.sort((a, b) => a.priority - b.priority);
+  }
 
   ngOnInit() {
   }
 
+  changeAuth(auth) {
+    function doChangeAuth(result: string) {
+      alert(result);
+    }
+
+    for (const l of this.auths) {
+      if (l.id === auth) {
+        if (l.is_custom) { // If is custom, we should get the code from server to authentication
+
+          this.api.getAuthCustomHtml(l.id)
+            .subscribe(result => doChangeAuth(result));
+        }
+      }
+    }
+  }
+
 }

src/app/navbar/navbar.component.html

@@ -1,36 +1,52 @@
 <nav class="navbar navbar-expand-md navbar-light bg-light fixed-top">
   <a class="navbar-brand" routerLink="/">
-      <img alt="Universal Desktop Services" src="/static/modern/img/udsicon.png" class="navbar-img pull-left">
+    <img alt="Universal Desktop Services" src="/static/modern/img/udsicon.png" class="navbar-img pull-left">
-      
+
   </a>
-  <button class="navbar-toggler" type="button" (click)="isNavbarCollapsed = !isNavbarCollapsed" data-target="#navbarUDS" aria-controls="navbarUDS" aria-expanded="false" aria-label="Toggle navigation">
+  <button class="navbar-toggler" type="button" (click)="isNavbarCollapsed = !isNavbarCollapsed" data-target="#navbarUDS" aria-controls="navbarUDS"
+    aria-expanded="false" aria-label="Toggle navigation">
     <span class="navbar-toggler-icon"></span>
   </button>
   <div [ngbCollapse]="isNavbarCollapsed" class="navbar-collapse" id="navbarUDS">
     <ul class="navbar-nav ml-auto">
       <li class="nav-item">
-        <a class="nav-link" routerLink="/client-download"><i class="fa fa-download"></i> UDS Plugin</a>
+        <a class="nav-link" routerLink="/client-download">
+          <i class="fa fa-download"></i> UDS Plugin</a>
       </li>
       <li class="nav-item">
-        <a class="nav-link" href="#"><uds-translate>About</uds-translate></a>
+        <a class="nav-link" href="#">
+          <uds-translate>About</uds-translate>
+        </a>
       </li>
       <li class="nav-item dropdown dropdown-menu-right" ngbDropdown>
-        <a class="nav-link dropdown-toggle" id="navbarLangDropdown" ngbDropdownToggle>{{ lang }}</a>
+        <form id="form_language" action="{{ api.config.urls.changeLang }}" method="post">
-        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarLangDropdown" ngbDropdownMenu>
+          <input type="hidden" name="{{ api.config.csrf_field }}" value="{{ api.config.csrf }}" >
-          <a class="dropdown-item" href="#" *ngFor="let l of langs">{{ l.name }}</a>
+          <input id="id_language" type="hidden" name="language" value="{{ lang.id }}" />
-        </div>
+          <a class="nav-link dropdown-toggle" id="navbarLangDropdown" ngbDropdownToggle>{{ lang.name }}</a>
+          <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarLangDropdown" ngbDropdownMenu>
+            <a class="dropdown-item" href="#" (click)="changeLang(l)" *ngFor="let l of langs">{{ l.name }}</a>
+          </div>
+        </form>
       </li>
 
       <li *ngIf="api.user.isLogged" class="nav-item dropdown dropdown-menu-right" ngbDropdown>
         <a class="nav-link dropdown-toggle" id="navbarUserDropdown" ngbDropdownToggle>{{ api.user.user }}</a>
         <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarUserDropdown" ngbDropdownMenu>
-          <a class="dropdown-item" href="#"><uds-translate>Preferences</uds-translate></a>
+          <a class="dropdown-item" href="#">
-          <a class="dropdown-item" href="#"><uds-translate>Dashboard</uds-translate></a>
+            <uds-translate>Preferences</uds-translate>
-          <a class="dropdown-item" href="#"><uds-translate>Downloads</uds-translate></a>
+          </a>
-          <a class="dropdown-item" href="{{ api.urls.logout }}"><uds-translate>Logout</uds-translate></a>
+          <a class="dropdown-item" href="#">
+            <uds-translate>Dashboard</uds-translate>
+          </a>
+          <a class="dropdown-item" href="#">
+            <uds-translate>Downloads</uds-translate>
+          </a>
+          <a class="dropdown-item" href="{{ api.config.urls.logout }}">
+            <uds-translate>Logout</uds-translate>
+          </a>
         </div>
       </li>
-      
+
     </ul>
   </div>
-</nav>
+</nav>

src/app/navbar/navbar.component.ts

@@ -7,18 +7,17 @@ import { UdsApiService, Lang } from '../uds-api.service';
   styleUrls: ['./navbar.component.css']
 })
 export class NavbarComponent implements OnInit {
-
+  lang: Lang; // Current language
-  lang: string; // Current language
   langs: Lang[]; // Available languages
   isNavbarCollapsed = true;
 
   constructor(public api: UdsApiService) {
-    const lang = api.currentLanguage;
+    const lang = api.config.language;
     // Add "non current lang" to list
     this.langs = [];
-    for (const l of api.availableLanguages) {
+    for (const l of api.config.available_languages) {
       if (l.id === lang) {
-        this.lang = l.name;
+        this.lang = l;
       } else {
         this.langs.push(l);
       }
@@ -28,4 +27,13 @@ export class NavbarComponent implements OnInit {
   ngOnInit() {
   }
 
+  changeLang(to: Lang): boolean {
+    // alert(document.getElementById('form_language'));
+    this.lang = to;
+    document.getElementById('id_language').attributes['value'].value = to.id;
+    // alert(document.getElementById('id_language').attributes['value'].value);
+    (<any>document.getElementById('form_language')).submit();
+    return false;
+  }
+
 }

src/app/services/services.component.ts

@@ -10,7 +10,7 @@ import { Router } from '@angular/router';
 export class ServicesComponent implements OnInit {
 
   constructor(private api: UdsApiService, private router: Router) {
-   }
+  }
 
   ngOnInit() {
     // Redirect, if not logged in, to login screen

src/app/translate.directive.ts

@@ -9,6 +9,7 @@ export class TranslateDirective implements OnInit {
   constructor(private el: ElementRef) { }
 
   ngOnInit() {
+    // Simply substitute outer html with translation
     this.el.nativeElement.outerHTML = django.gettext(this.el.nativeElement.innerHTML);
   }
 

src/app/uds-api.service.ts

@@ -6,6 +6,32 @@ export interface Lang {
   readonly name: string;
 }
 
+export interface Authenticator {
+  id: string;
+  name: string;
+  label: string;
+  priority: number;
+  is_custom: string;
+}
+
+// URLs related
+export interface UDSUrls {
+  readonly changeLang: string;
+  readonly login: string;
+  readonly logout: string;
+  readonly customAuth: string;
+}
+
+export interface UDSConfig {
+  language: string;
+  available_languages: Lang[];
+  authenticators: Authenticator[];
+  os: string;
+  csrf_field: string;
+  csrf: string;
+  urls: UDSUrls;
+}
+
 export interface Downloadable {
   readonly url: string;
   readonly description: string;
@@ -17,14 +43,6 @@ export interface Profile {
   readonly role: string;
 }
 
-export interface Authenticator {
-  id: string;
-  name: string;
-  label: string;
-  priority: number;
-  is_custom: string;
-}
-
 // User related
 export class User {
   readonly user: string;
@@ -44,13 +62,6 @@ export class User {
   }
 }
 
-// URLs related
-export interface UDSUrls {
-  readonly changeLang: string;
-  readonly login: string;
-  readonly logout: string;
-}
-
 @Injectable()
 export class UdsApiService {
   readonly user: User;
@@ -59,23 +70,15 @@ export class UdsApiService {
     this.user = new User(udsData.profile);
    }
 
-  get currentLanguage(): string {
+  get config(): UDSConfig {
-    return udsData.config.language;
+    return udsData.config;
-  }
-
-  get availableLanguages(): Lang[] {
-    return udsData.config.available_languages;
   }
 
   get plugins(): Downloadable[] {
     return udsData.plugins;
   }
 
-  get urls(): UDSUrls {
+  getAuthCustomHtml(authId) {
-    return udsData.config.urls;
+    return this.http.get(this.config.urls.customAuth + authId, {responseType: 'text'});
-  }
-
-  get authenticators(): Authenticator {
-    return udsData.authenticators;
   }
 }

src/server/uds.js

@@ -1,150 +1,156 @@
 var udsData = {
   "plugins": [{
+    "url": "/static/clients/UDSClientSetup-3.x.x-DEVEL.exe",
     "name": "Windows",
-    "description": "Windows plugin",
+    "description": "Windows plugin"
-    "url": "/static/clients/UDSClientSetup-3.x.x-DEVEL.exe"
   }, {
+    "url": "/static/clients/UDSClient-3.x.x-DEVEL.pkg",
     "name": "MacOS",
-    "description": "Mac OS X plugin",
+    "description": "Mac OS X plugin"
-    "url": "/static/clients/UDSClient-3.x.x-DEVEL.pkg"
   }, {
+    "url": "/static/udsclient_3.x.x-DEVEL_all.deb",
     "name": "Linux",
-    "description": "Debian based Linux (requires Python-2.7)",
+    "description": "Debian based Linux (requires Python-2.7)"
-    "url": "/static/udsclient_3.x.x-DEVEL_all.deb"
   }, {
+    "url": "/static/udsclient-3.x.x-DEVEL-1.noarch.rpm",
     "name": "Linux",
-    "description": "Red Hat based Linux (RH, Fedora, Centos, ...) (requires Python-2.7)",
+    "description": "Red Hat based Linux (RH, Fedora, Centos, ...) (requires Python-2.7)"
-    "url": "/static/udsclient-3.x.x-DEVEL-1.noarch.rpm"
   }, {
+    "url": "/static/udsclient-opensuse-3.x.x-DEVEL-1.noarch.rpm",
     "name": "Linux",
-    "description": "Suse based Linux (requires Python-2.7)",
+    "description": "Suse based Linux (requires Python-2.7)"
-    "url": "/static/udsclient-opensuse-3.x.x-DEVEL-1.noarch.rpm"
   }, {
+    "url": "/static/udsclient-3.x.x-DEVEL.tar.gz",
     "name": "Linux",
-    "description": "Generic .tar.gz Linux (requires Python-2.7)",
+    "description": "Generic .tar.gz Linux (requires Python-2.7)"
-    "url": "/static/udsclient-3.x.x-DEVEL.tar.gz"
   }],
-  "config": {
-    "urls": {
-      "login": "/login/",
-      "logout": "/logout",
-      "lang": "/i18n/setlang/"
-    },
-    "language": "en",
-    "authenticators": [{
-      "priority": 1,
-      "id": "d875c59c-7e19-5e3d-afac-f52f54789f10",
-      "label": "adregexp",
-      "is_custom": false,
-      "name": "00-AD W2012 REGEXP"
-    }, {
-      "priority": 1,
-      "id": "fbf0727a-e754-5f17-a0fd-bd8c1850b355",
-      "label": "ad",
-      "is_custom": false,
-      "name": "AD"
-    }, {
-      "priority": 2,
-      "id": "3613AA7E-E32A-5D05-BCFE-4E2C3E735EE3",
-      "label": "casa",
-      "is_custom": true,
-      "name": "Casa"
-    }, {
-      "priority": 1,
-      "id": "9EB0689D-DF66-54FF-8E7A-3C11E3F42A1A",
-      "label": "differ",
-      "is_custom": false,
-      "name": "different"
-    }, {
-      "priority": -2,
-      "id": "9803FC06-D8B3-5F11-9A6E-EEC905C017FD",
-      "label": "int",
-      "is_custom": false,
-      "name": "Interna"
-    }, {
-      "priority": 1,
-      "id": "53a53965-8a90-5e3b-96c4-91937d0042f0",
-      "label": "read",
-      "is_custom": false,
-      "name": "Ldap AD por RegEx"
-    }, {
-      "priority": 1,
-      "id": "729B2DB5-115F-5AA6-8C0A-32F3FBACF1D4",
-      "label": "sldap",
-      "is_custom": false,
-      "name": "Ldap AUTH"
-    }, {
-      "priority": 1,
-      "id": "4A574A66-65DD-5B6B-8D6F-5A53B95A0A58",
-      "label": "luca",
-      "is_custom": false,
-      "name": "LDAP UCA"
-    }, {
-      "priority": 1,
-      "id": "9f111569-d608-5426-b9f7-a9b4b928fd2d",
-      "label": "inval",
-      "is_custom": true,
-      "name": "Red invalida"
-    }, {
-      "priority": 1,
-      "id": "35698ffd-597a-5daa-9699-c87abed274f0",
-      "label": "sam",
-      "is_custom": true,
-      "name": "SAM"
-    }, {
-      "priority": 1,
-      "id": "8e2d796e-5f69-55c7-86c9-ccc1437ae8fe",
-      "label": "saml2",
-      "is_custom": true,
-      "name": "saml"
-    }, {
-      "priority": 1,
-      "id": "cd996fec-fd5a-59eb-9eb4-ec28af3cc8f7",
-      "label": "saml",
-      "is_custom": true,
-      "name": "SAMLOCAL"
-    }, {
-      "priority": 1,
-      "id": "3EAC3F30-0148-5041-986D-CE25737FEF81",
-      "label": "test",
-      "is_custom": false,
-      "name": "test"
-    }],
-    "csrf": "TX38YikWuXAmThwdOM9gbbjTnDffQQewl57xH7IVFJTEIbHdYDO0bwoI9uWuhuiI",
-    "csrf_field": "csrfmiddlewaretoken",
-    "os": "Windows",
-    "available_languages": [{
-      "id": "es",
-      "name": "Spanish"
-    }, {
-      "id": "en",
-      "name": "English"
-    }, {
-      "id": "fr",
-      "name": "French"
-    }, {
-      "id": "de",
-      "name": "German"
-    }, {
-      "id": "pt",
-      "name": "Portuguese"
-    }, {
-      "id": "it",
-      "name": "Italian"
-    }, {
-      "id": "eu",
-      "name": "Basque"
-    }, {
-      "id": "ar",
-      "name": "Arabian"
-    }, {
-      "id": "ca",
-      "name": "Catalan"
-    }]
-  },
-  "actors": [],
   "profile": {
     "user": null,
     "role": "user"
-  }
+  },
+  "urls": {
+    "customAuth": "/customAuth/"
+  },
+  "config": {
+    "authenticators": [{
+      "label": "adregexp",
+      "is_custom": false,
+      "name": "00-AD W2012 REGEXP",
+      "id": "d875c59c-7e19-5e3d-afac-f52f54789f10",
+      "priority": 1
+    }, {
+      "label": "ad",
+      "is_custom": false,
+      "name": "AD",
+      "id": "fbf0727a-e754-5f17-a0fd-bd8c1850b355",
+      "priority": 1
+    }, {
+      "label": "casa",
+      "is_custom": true,
+      "name": "Casa",
+      "id": "3613AA7E-E32A-5D05-BCFE-4E2C3E735EE3",
+      "priority": 2
+    }, {
+      "label": "differ",
+      "is_custom": false,
+      "name": "different",
+      "id": "9EB0689D-DF66-54FF-8E7A-3C11E3F42A1A",
+      "priority": 1
+    }, {
+      "label": "int",
+      "is_custom": false,
+      "name": "Interna",
+      "id": "9803FC06-D8B3-5F11-9A6E-EEC905C017FD",
+      "priority": -2
+    }, {
+      "label": "read",
+      "is_custom": false,
+      "name": "Ldap AD por RegEx",
+      "id": "53a53965-8a90-5e3b-96c4-91937d0042f0",
+      "priority": 1
+    }, {
+      "label": "sldap",
+      "is_custom": false,
+      "name": "Ldap AUTH",
+      "id": "729B2DB5-115F-5AA6-8C0A-32F3FBACF1D4",
+      "priority": 1
+    }, {
+      "label": "luca",
+      "is_custom": false,
+      "name": "LDAP UCA",
+      "id": "4A574A66-65DD-5B6B-8D6F-5A53B95A0A58",
+      "priority": 1
+    }, {
+      "label": "inval",
+      "is_custom": true,
+      "name": "Red invalida",
+      "id": "9f111569-d608-5426-b9f7-a9b4b928fd2d",
+      "priority": 1
+    }, {
+      "label": "sam",
+      "is_custom": true,
+      "name": "SAM",
+      "id": "35698ffd-597a-5daa-9699-c87abed274f0",
+      "priority": 1
+    }, {
+      "label": "saml2",
+      "is_custom": true,
+      "name": "saml",
+      "id": "8e2d796e-5f69-55c7-86c9-ccc1437ae8fe",
+      "priority": 1
+    }, {
+      "label": "saml",
+      "is_custom": true,
+      "name": "SAMLOCAL",
+      "id": "cd996fec-fd5a-59eb-9eb4-ec28af3cc8f7",
+      "priority": 1
+    }, {
+      "label": "test",
+      "is_custom": false,
+      "name": "test",
+      "id": "3EAC3F30-0148-5041-986D-CE25737FEF81",
+      "priority": 1
+    }],
+    "urls": {
+      "changeLang": "/i18n/setlang/",
+      "login": "/login/",
+      "logout": "/logout"
+    },
+    "language": "en",
+    "csrf_field": "csrfmiddlewaretoken",
+    "os": "Unknown",
+    "available_languages": [{
+      "name": "Spanish",
+      "id": "es"
+    }, {
+      "name": "English",
+      "id": "en"
+    }, {
+      "name": "French",
+      "id": "fr"
+    }, {
+      "name": "German",
+      "id": "de"
+    }, {
+      "name": "Portuguese",
+      "id": "pt"
+    }, {
+      "name": "Italian",
+      "id": "it"
+    }, {
+      "name": "Basque",
+      "id": "eu"
+    }, {
+      "name": "Arabian",
+      "id": "ar"
+    }, {
+      "name": "Russian",
+      "id": "ru"
+    }, {
+      "name": "Catalan",
+      "id": "ca"
+    }],
+    "csrf": "qXZDMXz5VCXKijMb4Olx2hyVzJL8cirNNBKtVGTivRZl8mlagGIq08ov3ScIxhUn"
+  },
+  "actors": []
 };