<?xml version="1.0" encoding="UTF-8" ?>
<Module>
  <ModulePrefs title="OneLogin" scrolling="true" height="400"
	author="OneLogin LLC"
	author_email="support@onelogin.com"
	description="This gadget provides secure access to your login dashboard and allows you to login to your apps with your OneLogin account from iGoogle"
	screenshot="http://app.onelogin.com/images/gadget/screenshot.png"
	thumbnail="http://app.onelogin.com/images/gadget/thumbnail.png"
   >
  	<Require feature="osapi"/>
	<Require feature="locked-domain" />
  </ModulePrefs>
<Content type="html">
    <![CDATA[
	  <link rel="stylesheet" href="http://app.onelogin.com/stylesheets/onelogin.css"/>
	  <link rel="stylesheet" href="http://app.onelogin.com/stylesheets/form.css"/>
	
	 <style type="text/css"> 
	  	body {
			background:none;
		}
		.appgroup {
			width:100%;
		}
		a.app {
			width:190px;
		}
		a.app:hover {
			background-image:none;
		}
		a.app p {
		 padding:8px 0;
		}
		div#welcome {
			left:40%;
			position:absolute;
			top:40%;
		}
		div#welcome h1 {
			text-indent:-9999px;
			background-image:url(http://app.onelogin.com/images/logo.png);
			width:155px;
			height:44px;
			margin:0 auto 5px;
		}
		
		div#welcome ul {
			width:147px;
		}
		
		div#welcome ul li {
			float:left;
			list-style:none outside none;
			padding-left:5px;
		}
		
		div#main #login-view {
			position:absolute; /* so it can be centered in relation to the gadget size */
			width:361px;
		}
		
		div#welcome ul li span {
			margin-left:3px;
			margin-right:-9px;
		}
		
	  </style>
	
      <script type="text/javascript">
	
	    //local,staging,production
	
		var ENV = 'production';
		var ONELOGIN_HOST = "";
		var ACCOUNT_NAME = "";
		var LOGIN_PARAMS = "";

		switch(ENV) 
		{
			case "staging":
			    ONELOGIN_HOST = 'https://staging.onelogin.com';
				break;
			case "local":
				ONELOGIN_HOST = 'http://fullofcaffeine.dyndns.org:3000';
				break;
			case "production":
				ONELOGIN_HOST = 'https://app.onelogin.com';
				break;

		}
	
		
		var SESSION_ID = null;
		var OPENSOCIAL_OWNER_ID = null;

		function triggerSelect(login_id) {
				showSpin();
				var _callback = function(data) {
					hideSpin();
					return true;
				}
				//this will set a one-time session too
				osapi.http.post({
					'href': ONELOGIN_HOST + '/embedding/login',
					'format': 'json',	
					'authz': 'signed',
					'proxy': 'true'
				}).execute(_callback);
				
				
		}
		
		function setHeader(parent,id,value) {
			h = document.getElementById(id);
			if (!h) {
				parent.innerHTML += "<h1 id=\""+id+"\"style=\"margin-bottom: 10px;\">"+value+"</h1>"				
			}
		}
		
		function resolveServiceURL(login_id) {
			return (ENV == 'local' ? 'http://app.localhost:3000' : ONELOGIN_HOST) + '/client/apps?opensocial_owner_id='+OPENSOCIAL_OWNER_ID + '&login_id='+login_id
		}
		
		function createAppsList(logins,title,cols) {
				var main_div = document.getElementById('main');
				var account_apps_list = document.getElementById('account-apps');
				var personal_apps_list = document.getElementById('personal-apps');
				var size = logins.length;
				//var cols = 3;
			
				//if (size < 4) cols = 1;
				//if (size < 5) cols = 2;
				
				var rows = Math.floor((size+cols) / cols);

				
				setHeader(main_div,title.replace(" ","_"),title);
	
				for(i=0;i<=rows;i++) {
					var app_group = document.createElement('div');
					main_div.appendChild(app_group);
					app_group.className = 'appgroup';
					
					for(j=0;j<=cols;j++) {
						var login = null;
	
						if (login = logins[i + j*rows]) {
							var html = "<a href='"+resolveServiceURL(login.id)+"' onclick='return triggerSelect("+login.id+")' class='app' target='_blank'><img src='http://app.onelogin.com"+ login.connector.icon_url +"'/><p>"+login.app_name+"</p></a>";
							app_group.innerHTML += html;
						} else {
							//main_div.innerHTML += "<div class=\"filler\"></div>";
						}
			
					   }
				  }
				main_div.innerHTML += "<div class=\"spacer\"></div>";
			}

		function parseApps(data) {
			var cols = Math.floor((document.getElementsByTagName('body')[0].clientWidth / 190));
			var personal_logins = data.content.personal;
			var account_logins = data.content.account;
			createAppsList(account_logins,ACCOUNT_NAME,cols);
			createAppsList(personal_logins,"Personal Logins",cols);
			document.getElementById('main').style.display = 'block';
		}
		
		function showLoginView() {
			var welcome = document.getElementById('welcome');
			welcome.style.display = 'none';
			var login_view = document.getElementById('login-view');
			centerElementInGadget(login_view,500,100);
			login_view.style.display = 'block';
		}
		
		function loginCallback(data) {
			hideSpin();
			document.getElementById('login').style.display = 'inline';
			
			if (data.content.error) { alert(data.error_message); return }
			
			if (!data.content.logged_in) {
				if (data.content.popup_params) LOGIN_PARAMS = data.content.popup_params;
				
				if (typeof(data.content) == 'string') {
					if (data.content.match(/Element.+\("errors", "(.*)"\);/)) {
						document.getElementById('errors').innerHTML = RegExp.$1;
					} else if(data.content.match(/window.close/)) {
						document.getElementById('login-view').style.display = 'none';
						init();
						return;
					}
					
				} else {
					var welcome = document.getElementById('welcome');
					centerElementInGadget(welcome,165,100);
					welcome.style.display = 'block';
				}
			} else {
				document.getElementById('welcome').style.display = 'none';
				//logged in, let's get the lsit of apps and build the dashboard
				osapi.http.get({
					'href': ONELOGIN_HOST + '/client/apps/embed',
					'format': 'json',
					'authz': 'signed'
				}).execute(parseApps);
				
				OPENSOCIAL_OWNER_ID = data.content.opensocial_owner_id;
				ACCOUNT_NAME = data.content.account_name;
				
			}
			
		}

		 //entry point
		 function init() {
			//first thing we need to do is try to login:
			// Hit the server, passing in a signed request (and OpenSocial ID), to see if we know who the user is.
 		   osapi.http.get({
		        'href' : ONELOGIN_HOST + '/embedding/login',
		        'format' : 'json',
		        'authz' : 'signed'
		      }).execute(loginCallback);
	     }
	
		function centerElementInGadget(el,xoffset,yoffset) {
			el.style.top = ((document.getElementsByTagName('body')[0].clientHeight-yoffset)/2) + "px";
			el.style.left = ((document.getElementsByTagName('body')[0].clientWidth-xoffset)/2) + "px";
		
		}

		function submitLogin(form) {
			showSpin();
			document.getElementById('login').style.display = 'none';
			var email = form.elements.email.value;
			var password = form.elements.password.value;
			osapi.http.post({
				'href' : ONELOGIN_HOST + '/sessions/create' + LOGIN_PARAMS + '&email='+escape(email)+'&password='+escape(password),
				'format' : 'html',
			}).execute(loginCallback);
			
			return false; //cancels the form submit 
		
		}
		
		function showSpin() {
			var spin = document.getElementById('spinnerbox');
			centerElementInGadget(spin,150,0);
			spin.style.visibility = 'visible';
		}
		
		function hideSpin() {
			var spin = document.getElementById('spinnerbox');
			spin.style.visibility = 'hidden';
		}
		
	

       gadgets.util.registerOnLoadHandler(init);

	


      </script>
	
	  <div id="spinnerbox" class="spinnerbox" style="position:absolue;left:44%;top:40%">
			<div class="spinner"></div>
	   </div>
      <div id='main' style="background-image:none">

		<div id="login-view" class="formbox2" style="display:none;">
		<form onsubmit="return submitLogin(this)">
			<fieldset>
				<label></label>
				<div id="errors"></div>
			</fieldset>
			<fieldset>
				<label>Email</label>
				<input id="email" type="text" name="email"/>
			</fieldset>
			<fieldset>
				<label>Password</label>
				<input id="password" type="password" name="password"/>
			</fieldset>
			<div>
				<input type="image" src="http://app.onelogin.com/images/login.png" id="login" style="float:right">
			</div>
		</form>
		</div>
		<div id='welcome' style="display:none">
			<h1>OneLogin</h1>
			<ul id="main_menu">
				<li><a href="javascript:showLoginView()">Login</a>&nbsp;|</li>
				<li><a href="https://app.onelogin.com/signup" target="_blank">Signup</a>&nbsp;|</li>
				<li><a href="http://support.onelogin.com/entries/175736-google-gadget-preview" target="_blank">Help</a></li>
			</ul>
			<div class="spacer"></div>
		</div>
		
      </div>
    ]]>
  </Content>

</Module>

