Interfaz Cliente Administrador

platforms/desktop/src/clients/admin/main.js

@@ -1,50 +1,89 @@
-var app = require('app');  // Module to control application life.
-var ipc = require('ipc');
+/// <reference path="../../../../../typings/node/node.d.ts"/>
 
-var BrowserWindow = require('browser-window');  // Module to create native browser window.
-var APP_DIR = 'file://' + __dirname;
-var STATIC_DIR = APP_DIR + '/static/';
+var app = require('app');  // Módulo para controlar la app.
+var ipc = require('ipc');  // Un intercomunicador del proceso principal (app.js) con el renderer
+// var dialog = require('dialog'); // Mostrar diálogos del Sistema.
+var BrowserWindow = require('browser-window'); // Módulo para crear ventanas
 
-// Report crashes to our server.
+var APP_DIR = 'file://' + __dirname; // Ruta base de la app.
+var STATIC_DIR = APP_DIR + '/static/'; // Ruta base de archivos estáticos.
+
+var Cache = (function(){ // Caché para almacenar datos compartidos entre ventanas de la app.
+	var data = {};
+	return {
+		save:  function(key, value){ data[key] = value; }, /// FIXME: Si existe, sobreescribe.
+		get: function(key){ return data[key]; }
+	};
+})();
+
+// Un proxy de los errores a Electron
 require('crash-reporter').start();
 
-// Keep a global reference of the window object, if you don't, the window will
-// be closed automatically when the javascript object is GCed.
+// Referencia global al objeto Window, para evitar que la aplicación
+// sea cerrada por el GarbageCollection de Javascript.
 var mainWindow = null;
 
-// Quit when all windows are closed.
+// Cerrar la aplicación cuando todas las ventanas estén cerradas
 app.on('window-all-closed', function() {
 	if (process.platform != 'darwin'){
 		app.quit();
 	}
 });
 
-// This method will be called when Electron has done everything
-// initialization and ready for creating browser windows.
+// Éste método se llamará cuando Electron acabe su incialización
+// y esté listo para crear ventanas.
 app.on('ready', function() {
-	// Create the browser window.
-	mainWindow = new BrowserWindow({width: 640, height: 380, frame:false, show:false});
 
-	// and load the index.html of the app.
-	mainWindow.loadUrl(STATIC_DIR + 'login.html');
+	var SCREEN = require('screen');
+	var APP_ICON_PATH = '/home/rc/webapps/citasalud/platforms/desktop/src/clients/admin/static/assets/img/icon.png';
+	var SCREEN_SIZE = SCREEN.getPrimaryDisplay().workAreaSize;
 
-	mainWindow.webContents.on('did-finish-load', function() {
-		mainWindow.show();
-		mainWindow.webContents.send('ping', 'whoooooooh!');
+	var w_login_options = { // Opciones para la ventana de login.
+		width: 515,        // Ancho
+		height: 365,       // Alto
+		frame: false,      // Ventana sin borde
+		show: false,       // No mostrar ventana al crear.
+		resizable: false,  // No se podrá cambiar el tamaño.
+		icon:APP_ICON_PATH // Ícono de la ventana.
+	}
+	// Crear una ventana de navegador con las opciones w_login_options
+	mainWindow = new BrowserWindow(w_login_options);
+	mainWindow.loadUrl(STATIC_DIR + 'login.html'); // Carga login.html en la ventana.
+	mainWindow.webContents.on('did-finish-load', function() { 
+		mainWindow.show(); // Mostrar la ventana sólamente cuando se haya cargado login.html
 	});
 
-	mainWindow.openDevTools();
-
-	// Emitted when the window is closed.
 	mainWindow.on('closed', function() {
-		// Dereference the window object, usually you would store windows
-		// in an array if your app supports multi windows, this is the time
-		// when you should delete the corresponding element.
-		mainWindow = null;
+		mainWindow = null; // Al cerrar la ventana, vacía la referencia.
+	});
+
+	ipc.on('window-evt', function(event, action) { // Intercomunicador 
+		mainWindow[action](); // Al cerrar, maximizar o minimzar.
 	});
 
-	ipc.on('window-evt', function(event, action) {
-		mainWindow[action]();
+	ipc.on('login', function(event, authorized) { // Intercomunicador
+		if (authorized){ // Al iniciar sesión, si está autorizado
+			Cache.save('access_token', authorized);
+			mainWindow.close();
+			var delta = Number.parseInt(SCREEN_SIZE.height*0.2);
+
+			var rec_s = {
+				width : SCREEN_SIZE.width - delta,
+				height : SCREEN_SIZE.height - delta
+			}
+//			rec_s.width = 1600;
+//			rec_s.height = 900;
+			rec_s.title = 'citaSalud - Administración';
+			rec_s.fullscreen = false;
+			console.log(SCREEN_SIZE);
+			console.log(rec_s);
+			mainWindow = new BrowserWindow(rec_s);		
+
+		} else {
+			// Código para manejar cuando las credenciales son incorrectas.
+			/// OJO: Ya existe manejo de error en la ventana interna.
+			dialog.showErrorBox('xD', 'WHYYYYY');
+		}
 	});
 
 });

platforms/desktop/src/clients/admin/static/assets/css/app.css

@@ -4,6 +4,12 @@ html, body {
   height:100%;
   margin: 0px;
   padding: 0px;
+  overflow: hidden;
+}
+
+#internalw{
+  box-sizing:border-box;
+  border: solid 1px rgba(200,200,200,1);
 }
 
 body#login md-input-container.md-icon-float > md-icon {

platforms/desktop/src/clients/admin/static/assets/js/app.js

@@ -1,5 +1,6 @@
- var app = angular.module('citaSalud', ['ngMaterial', 'users'])
- .config(function($mdThemingProvider, $mdIconProvider){
+ var app = angular.module('citaSalud', ['ngMaterial', 'users']);
+
+ app.config(function($mdThemingProvider, $mdIconProvider){
 	$mdIconProvider
 		.iconSet("action", "assets/components/svg-material-icons/svg-sprite-action.svg", 24)
 		.iconSet("alert", "assets/components/svg-material-icons/svg-sprite-alert.svg", 24)
@@ -18,59 +19,27 @@
 		.iconSet("toggle", "assets/components/svg-material-icons/svg-sprite-toggle.svg", 24);
 
 	$mdThemingProvider.theme('default')
-		.primaryPalette('blue')
-    	.accentPalette('blue-grey');
+		.primaryPalette('indigo')
+    	.accentPalette('blue');
 });
 
-app.controller('mainCtrl', function($scope, $mdDialog){
-
-	var ipc = require('ipc');
-	var messenger = {
-		send : function(event, action) {
-			ipc.send(event, action);
-		}
-	};
-
-	$scope.loginData = {
-		'username' : 'admin',
-		'password' : 'admin',
-		'remember_pwd' : true
-	};
-
-	$scope.closeW = function(){
-		messenger.send('window-evt', 'close');
-	};
-	$scope.minW = function(){
-		messenger.send('window-evt', 'minimize');
-		$scope.hide();
-	};
-
-	$scope.doLogin = function(){
-		$scope.loading();
-	};
-
-	$scope.loading = function() {
-		var parentEl = angular.element(document.querySelector('#internalw'));
-	    $mdDialog.show({
-		  parent : parentEl,
-	      controller: DialogController,
-	      template: '<md-progress-circular class="md-accent" md-mode="indeterminate"></md-progress-circular>',
-	    })
-	    .then(function(answer) {
-	      $scope.alert = 'You said the information was "' + answer + '".';
-	    }, function() {
-	      $scope.alert = 'You cancelled the dialog.';
-	    });
-
-	};
-
-	function DialogController(scope, $mdDialog) {
-	    scope.closeDialog = function() {
-	      $mdDialog.hide();
-	    }
-	  }
-
-	$scope.hide = function(){
-		$mdDialog.cancel();
+//app.config(['$httpProvider', function ($httpProvider) {
+//    // Intercept POST requests, convert to standard form encoding
+//    $httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
+//    $httpProvider.defaults.transformRequest.unshift(function (data, headersGetter) {
+//        var key, result = [];
+//        for (key in data) {
+//            if (data.hasOwnProperty(key)) {
+//                result.push(encodeURIComponent(key) + "=" + encodeURIComponent(data[key]));
+//            }
+//        }
+//        return result.join("&");
+//    });
+//}])
+
+var ipc = require('ipc');
+var messenger = {
+	send : function(event, action) {
+		ipc.send(event, action);
 	}
-});
+};

platforms/desktop/src/clients/admin/static/assets/js/controllers/login.js

@@ -0,0 +1,61 @@
+app.controller('loginCtrl', function($scope, $mdDialog, Auth, $storage, $timeout){
+
+	$scope.loginData = {
+		'username' : 'admin',
+		'password' : 'admin',
+		'remember_pwd' : true
+	};
+
+	$scope.closeW = function(){
+		messenger.send('window-evt', 'close');
+	};
+	$scope.minW = function(){
+		messenger.send('window-evt', 'minimize');
+		$scope.hide();
+	};
+
+	$scope.doLogin = function(){
+		$scope.loading();
+	};
+
+	$scope.loading = function() {
+	    $mdDialog.show({
+			clickOutsideToClose: true,
+			escapeToClose: true,
+			scope: $scope,
+          	preserveScope: true,
+			template: '<md-dialog aria-label="Iniciando Sesión">' +
+           		'<md-dialog-content layout="row" layout-align="center center">'+
+				'<md-progress-circular class="md-accent" md-mode="indeterminate"></md-progress-circular>' +
+				'&nbsp;&nbsp;<span>Iniciando Sesión...</span>'+ 
+				'</md-dialog-content></md-dialog>',
+			controller : function($scope, $mdDialog){
+				Auth.login($scope.loginData, function(token){
+					$timeout(function() { /// simular carga servidor
+						messenger.send('login', token);
+						console.log(token);
+					}, 500);
+				}, function(error){
+					$mdDialog.cancel();
+
+					$timeout(function() { /// simular carga servidor
+						console.log(Object.keys(error));
+						messenger.send('login', false);
+
+						var alert = $mdDialog.alert({
+				        	title: 'Error',
+				        	content: 'Los credenciales ingresados son incorrectos.',
+				        	ok: 'Cerrar'
+				     	});
+
+				     	$mdDialog.show(alert)
+				        .finally(function() {
+				        	// finally what?
+				        });
+					}, 500);
+				});
+			}
+	    });
+	};
+
+});

platforms/desktop/src/clients/admin/static/assets/js/services/auth.js

@@ -0,0 +1,50 @@
+app.factory('Auth', function($http, $q, $window, $storage){
+	var getTokenURL = 'http://localhost:8000/api-auth-token/';
+	var accessToken;
+
+	var doLogin = function(loginData){
+		var deferred = $q.defer();
+
+		var req = {
+			method: 'POST',
+			url: getTokenURL,
+			data: loginData
+		};
+
+		$http(req).then(function(result){
+			accessToken = result.data.token;
+	      	deferred.resolve(accessToken);
+
+		}, function(error){
+			deferred.reject(error);
+		});
+
+		return deferred.promise;
+
+	}
+
+	var login = function(credentials, success_handler, error_handler){
+		doLogin(credentials).then(function (response_token){
+			$storage.set('accessToken', response_token);
+			return success_handler(response_token);
+		}, function (e){
+			if (typeof error_handler == 'function'){
+				if (e.status == 401 || e.status == 400){
+					return error_handler({
+						invalid : true
+					});
+				} else {
+					return e;
+				}
+			}
+		});
+	};
+
+	return {
+		login : login,
+		getToken : function(){
+			return $storage.get('accessToken');
+		}
+	}
+
+})