WIP javascript client

tempjpwNow/IndivLendHome.html

@@ -340,7 +340,7 @@
 <script id="clientSearchTabTemplate" type="text/x-jquery-tmpl">
 <form method="post" id="viewClient" name="viewClient" action="switchToClient">
 	<label for="client">Choose client:</label>
-	<select name="client" id="client">
+	<select name="client" id="client" onChange="showILClient(baseApiUrl, options[selectedIndex].value);">
 		<option value="0">--Select Client--</option>
 		{{#each clients}}
 			<option value="{{=id}}">{{=displayName}}&nbsp;-&nbsp;({{=officeName}})</option>
@@ -867,6 +867,15 @@
 
 <!-- differences in layout and javascript below here -->
 
+<style type="text/css">
+
+#container {
+	display: none;
+}
+
+</style>
+
+<div id="logonDiv"></div>
 <div id="container">
 	<div id="logowrapper">
 		<span style="float: left">
@@ -875,7 +884,7 @@
 	</div>
 	<div id="navwrapper">
 	<ul id="nav" class="floatleft">
-		<li><a href="home">Clients</a></li>
+		<li><a href="#" onclick="showILClientListing(baseApiUrl) ;">Clients</a></li>
 		<li><a href="org/admin/user">User Administration</a></li>
 		<li><a href="org/admin">Organisation Administration</a></li>
 		<li><a href="reporting/flexireport">Reports</a></li>
@@ -908,8 +917,7 @@
 	<br class="clear">
 	</div><div style="float:none; clear:both;">
 		<div id="spacer" style="line-height: 15px;">&nbsp;</div>
-		<div id="content">
-		</div>
+		<div id="content"></div>
 	</div>
 </div>
 
@@ -922,11 +930,8 @@
 $(document).ready(function() {
 
 
-	// basic auth details
-	base64 = "bWlmb3M6cGFzc3dvcmQ=";
 	baseApiUrl = "https://localhost:8443/mifosng-provider/api/v1/";
 
-	$("#content").html(getClientListingContent());
 
     	// default to 'en' culture - no need to import extra javascript files for globalize.js or datapicker
     	Globalize.culture('en');
@@ -945,8 +950,7 @@ $(document).ready(function() {
 	
 	jsViewsRegisterHelpers();
 	
-	showILClientListing(baseApiUrl);
-
+	showILLogon(baseApiUrl, "logonDiv");
 });
 </script>
 

tempjpwNow/resources/jsrenderExtra.js

@@ -1,34 +1,70 @@
 
-	queryParam = (function(){
-    				var query = {}, pair, search = location.search.substring(1).split("&"), i = search.length;
-    				while (i--) {
-        				pair = search[i].split("=");
-        				query[pair[0]] = decodeURIComponent(pair[1]);
-    				}
-    				return query;
-				})();
+queryParam = (function(){
+    			var query = {}, pair, search = location.search.substring(1).split("&"), i = search.length;
+    			while (i--) {
+        			pair = search[i].split("=");
+        			query[pair[0]] = decodeURIComponent(pair[1]);
+    			}
+    			return query;
+			})();
 
 
+function showILLogon(apiUrl, logonDivName) {
 
+	var htmlVar = '<form name = "logonform"><table><tr><td>User Name:</td><td><input type="text" name="username"></td></tr>';
+	htmlVar += '<tr><td>Password: </td><td><input type="password" name="password"></td></tr>';
+	htmlVar += '<tr><td><input type="button" value="Logon" name="Submit" ';
+	htmlVar += 'onclick= "setBasicAuthKey(' + "'" + apiUrl + "', '" + logonDivName + "'" + ', document.logonform.username.value, document.logonform.password.value )"></td><td></td></tr></table></form>';
 
-
-
-function getClientContent(baseApiUrl, clientId) {
-	var content = '<div id="newtabs">	<ul><li><a href="' + baseApiUrl + 'clients/' + clientId + '"'; 
-	content += ' title="clienttab" class="topleveltab"><span id="clienttabname">Loading...</span></a></li></ul><div id="clienttab"></div></div>';
-	return content;
+	$("#" + logonDivName).html(htmlVar);
 }
 
 
-function getClientListingContent() {
-	var content = '<button id="addclient" style="clear: both;">Add a new client</button>';
-	content += '<div id="tabs"><ul><li><a href="#searchtab" title="searchtab">Search</a></li></ul><div id="searchtab"></div></div>';
-	return content;
+function setBasicAuthKey(apiUrl, logonDivName, username, password) 
+{ 
+	base64 = "";
+	var jqxhr = $.ajax({ 
+		url : apiUrl +  "authentication?username=" + username + "&password=" + password, 
+		type : 'POST', 
+		contentType : "application/json; charset=utf-8", 
+		dataType : 'json', 
+		data : "{}", 
+		cache : false, 
+		success : function(data, textStatus, jqXHR) { 
+				base64 = data.base64EncodedAuthenticationKey; 
+				$("#" + logonDivName).hide();
+				$("#container").show();
+				showILClientListing(apiUrl);
+				return false;
+			},
+		error : function(jqXHR, textStatus, errorThrown) {
+				alert("Invalid Username/Password"); 
+				return true;
+		} 
+	});
 }
 
 
 
 
+function setClientListingContent(divName) {
+	var htmlVar = '<button id="addclient" style="clear: both;">Add a new client</button>';
+	htmlVar += '<div id="tabs"><ul><li><a href="#searchtab" title="searchtab">Search</a></li></ul><div id="searchtab"></div></div>';
+
+	$("#" + divName).html(htmlVar);
+}
+
+function setClientContent(baseApiUrl, clientId, divName) {
+	var htmlVar = '<div id="newtabs">	<ul><li><a href="' + baseApiUrl + 'clients/' + clientId + '"'; 
+	htmlVar += ' title="clienttab" class="topleveltab"><span id="clienttabname">Loading...</span></a></li></ul><div id="clienttab"></div></div>';
+
+	$("#" + divName).html(htmlVar);
+}
+
+
+
+
+
 
 
 
@@ -331,6 +367,9 @@ function jsViewsRegisterHelpers() {
 //all the code for the various functions
 
 function showILClientListing(baseApiUrl) {
+
+setClientListingContent("content");
+
 //HOME list clients functionality
 	$("#tabs").tabs({
 		"ajaxOptions": {
@@ -372,10 +411,8 @@ function showILClientListing(baseApiUrl) {
 			        	console.log(clientObject);
 			        	
 				    	var tableHtml = $("#clientSearchTabTemplate").render(clientObject);
-						$("#searchtab").html(tableHtml);
+					$("#searchtab").html(tableHtml);
 						
-						$('#client').change(function() {
-				        	$('#viewClient').submit();
 				    	});
 				  },
 				  error: function(jqXHR, textStatus, errorThrown) {
@@ -387,7 +424,7 @@ function showILClientListing(baseApiUrl) {
 	
 	var addClientSuccessFunction = function(data, textStatus, jqXHR) {
 		  $('#dialog-form').dialog("close");
-		  window.location.href = 'IndivLendClient.html?clientId=' + data.entityId;
+		  showILClient(baseApiUrl, data.entityId);
 	}
 	
 	$("#addclient").button().click(function(e) {
@@ -410,6 +447,8 @@ function showILClientListing(baseApiUrl) {
 
 function showILClient(baseApiUrl, clientId) {
 
+	setClientContent(baseApiUrl, clientId, "content");
+
 	var tab_counter = 1;
 	var $newtabs = $("#newtabs").tabs({