giobyte8/simpleLogin.html

## simpleLogin.html
<!--
    La siguiente pagina, muestra de manera sencilla como permitir al usuario hacer login
    mediante su cuenta Microsoft a traves del API de Microsoft Live.

    -@author: Aguirre Alvarez J Giovanni.
    -Created on: January, 12 from 2014.
-->
<!DOCTYPE html>
<html>
<head>
    <title>Logueando usuarios mediante skydrive</title>

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="http://js.live.net/v5.0/wl.js"></script>
    <script type="text/javascript" src="simpleLogin.js"></script>
</head>

<body>
    <h1>Logueando usuarios mediante Skydrive</h1>
    <button id="login-button" onclick="loginUser()">
        Iniciar sesion
    </button>
    <button id="close-session-b" onclick="closeSession()">
        Cerrar sesion
    </button>
    <h4 style="color: red;">Resultado:</h4>
    <div id="resultado"></div>
</body>
</html>

## simpleLogin.js
/**
 * Codigo javscript para autenticar a un usuario mediante
 * el API de Microsoft Live.
 * Este codigo, complementa el codigo de la pagina:
 * simpleLogin.html
 *
 * -@author: Aguirre Alvarez J Giovanni
 * -Created on: January 12 from 2014
 */


// CONSTANTES DE CONFIGURACION DEL API DE MICROSOFT
// Reemplaza el triple '0' con tu CLIENT_ID obtenido
// al regitrar tu aplicacion.
var APP_CLIENT_ID = "000";
var REDIRECT_URL = "simpleLogin.html";


// Inicializamos el API al momento de cargar la pagina web
$(document).ready(function() {
    WL.init({
        client_id: APP_CLIENT_ID,
        redirect_uri: REDIRECT_URL
    });
})

/**
 * Esta funcion se ejecuta al hacer click en el boton
 * 'Iniciar sesion' y se encarga de autenticar a un
 * usuario mediante sus credenciales Microsoft.
 */
function loginUser() {
    WL.login ({ // Permisos solicitados
        scope: ["wl.signin", "wl.emails"]
    }).then( // Login exitoso
        function (session) {
            console.log("Ahora estas logueado");
            getEmail(session);
        }, // Login con error o incompleto
        function (sessionError) {
            console.log("Ocurrio un error al tratar de loguearte");
        }
    )
}

/**
 * Esta funcion se encarga de eliminar la sesion del usuario
 * si es que alguna esta iniciada.
 */
function closeSession() {
    WL.logout();
    console.log("Se ah cerrado tu sesion");
}

/**
 * Obtiene el email de un usuario, basado en su sesion iniciada
 * y muestra un saludo con su e-mail en nuestra pagina web
 */
function getEmail(session) {
    if(!session.error) {
        WL.api({
            path: "me",
            method: "GET"
        }).then(
            function(response) {
                $('#resultado').html(
                    "<strong>Bienvenido </strong>"+response.emails.preferred+"<br />"
                );
            },
            function(responseFailed) {
                $('#resultado').html(
                    "<span style=\"color: red\">"+responseFailed.error.message+"</span>"
                );
            }
        );
    }
    else {
        // No hay una sesion iniciada
        console.log("Error al tratar de acceder a la session del usuario");
    }
}
	<!--
	La siguiente pagina, muestra de manera sencilla como permitir al usuario hacer login
	mediante su cuenta Microsoft a traves del API de Microsoft Live.

	-@author: Aguirre Alvarez J Giovanni.
	-Created on: January, 12 from 2014.
	-->
	<!DOCTYPE html>
	<html>
	<head>
	<title>Logueando usuarios mediante skydrive</title>

	<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="http://js.live.net/v5.0/wl.js"></script>
	<script type="text/javascript" src="simpleLogin.js"></script>
	</head>

	<body>
	<h1>Logueando usuarios mediante Skydrive</h1>
	<button id="login-button" onclick="loginUser()">
	Iniciar sesion
	</button>
	<button id="close-session-b" onclick="closeSession()">
	Cerrar sesion
	</button>
	<h4 style="color: red;">Resultado:</h4>
	<div id="resultado"></div>
	</body>
	</html>
	/**
	* Codigo javscript para autenticar a un usuario mediante
	* el API de Microsoft Live.
	* Este codigo, complementa el codigo de la pagina:
	* simpleLogin.html
	*
	* -@author: Aguirre Alvarez J Giovanni
	* -Created on: January 12 from 2014
	*/


	// CONSTANTES DE CONFIGURACION DEL API DE MICROSOFT
	// Reemplaza el triple '0' con tu CLIENT_ID obtenido
	// al regitrar tu aplicacion.
	var APP_CLIENT_ID = "000";
	var REDIRECT_URL = "simpleLogin.html";


	// Inicializamos el API al momento de cargar la pagina web
	$(document).ready(function() {
	WL.init({
	client_id: APP_CLIENT_ID,
	redirect_uri: REDIRECT_URL
	});
	})

	/**
	* Esta funcion se ejecuta al hacer click en el boton
	* 'Iniciar sesion' y se encarga de autenticar a un
	* usuario mediante sus credenciales Microsoft.
	*/
	function loginUser() {
	WL.login ({ // Permisos solicitados
	scope: ["wl.signin", "wl.emails"]
	}).then( // Login exitoso
	function (session) {
	console.log("Ahora estas logueado");
	getEmail(session);
	}, // Login con error o incompleto
	function (sessionError) {
	console.log("Ocurrio un error al tratar de loguearte");
	}
	)
	}

	/**
	* Esta funcion se encarga de eliminar la sesion del usuario
	* si es que alguna esta iniciada.
	*/
	function closeSession() {
	WL.logout();
	console.log("Se ah cerrado tu sesion");
	}

	/**
	* Obtiene el email de un usuario, basado en su sesion iniciada
	* y muestra un saludo con su e-mail en nuestra pagina web
	*/
	function getEmail(session) {
	if(!session.error) {
	WL.api({
	path: "me",
	method: "GET"
	}).then(
	function(response) {
	$('#resultado').html(
	"<strong>Bienvenido </strong>"+response.emails.preferred+"<br />"
	);
	},
	function(responseFailed) {
	$('#resultado').html(
	"<span style=\"color: red\">"+responseFailed.error.message+"</span>"
	);
	}
	);
	}
	else {
	// No hay una sesion iniciada
	console.log("Error al tratar de acceder a la session del usuario");
	}
	}