From 7c43f1bcd8746ea3164199915f58bf596d84f41a Mon Sep 17 00:00:00 2001
From: Piotr Gawron <piotr.gawron@uni.lu>
Date: Tue, 20 Feb 2018 15:11:45 +0100
Subject: [PATCH] login page is created using javascript
---
frontend-js/src/main/js/ConfigurationType.js | 1 +
frontend-js/src/main/js/minerva.js | 148 ++++++++++++++++++-
frontend-js/src/test/js/minerva-test.js | 9 +-
web/src/main/webapp/login.xhtml | 144 ++++--------------
4 files changed, 186 insertions(+), 116 deletions(-)
diff --git a/frontend-js/src/main/js/ConfigurationType.js b/frontend-js/src/main/js/ConfigurationType.js
index bf850e2861..85734b7568 100644
--- a/frontend-js/src/main/js/ConfigurationType.js
+++ b/frontend-js/src/main/js/ConfigurationType.js
@@ -5,6 +5,7 @@ var ConfigurationType = {
GOOGLE_ANALYTICS_IDENTIFIER: "GOOGLE_ANALYTICS_IDENTIFIER",
LOGO_IMG: "LOGO_IMG",
LOGO_LINK: "LOGO_LINK",
+ LOGO_TEXT: "LOGO_TEXT",
LEGEND_FILES: "LEGEND_FILES",
MIN_COLOR_VAL: "MIN_COLOR_VAL",
MAX_COLOR_VAL: "MAX_COLOR_VAL",
diff --git a/frontend-js/src/main/js/minerva.js b/frontend-js/src/main/js/minerva.js
index 05e30220af..09387a4e6c 100644
--- a/frontend-js/src/main/js/minerva.js
+++ b/frontend-js/src/main/js/minerva.js
@@ -9,6 +9,7 @@ var ConfigurationType = require('./ConfigurationType');
var CustomMap = require('./map/CustomMap');
var CustomMapOptions = require('./map/CustomMapOptions');
var Export = require('./Export');
+var GuiUtils = require('./gui/leftPanel/GuiUtils');
var PluginManager = require('./plugin/PluginManager');
var SearchDbOverlay = require('./map/overlay/SearchDbOverlay');
@@ -367,8 +368,153 @@ function create(params) {
}
-function createLogin(params) {
+function createFooter(params) {
+ var logoLink, logoText, logoImg;
+ return ServerConnector.getConfigurationParam(ConfigurationType.LOGO_LINK).then(function (result) {
+ logoLink = result;
+ return ServerConnector.getConfigurationParam(ConfigurationType.LOGO_TEXT);
+ }).then(function (result) {
+ logoText = result;
+ return ServerConnector.getConfigurationParam(ConfigurationType.LOGO_IMG);
+ }).then(function (result) {
+ logoImg = result;
+ return ServerConnector.getConfiguration();
+ }).then(function (configuration) {
+ var div = functions.createElement({
+ type: "div", id: "footerTable",
+ content: '<table width="100%" border="0" cellspacing="0" cellpadding="0">' +
+ '<tr>' +
+ '<td align="left"><a href="' + logoLink + '" title="' + logoText + '" target="_blank">' +
+ '<h:graphicImage library="images" name="' + logoImg + '" width="80" height="80" border="0" alt="' + logoText + '"/>' +
+ '</a></td>' +
+ '<td align="center" class="footerText">MiNERVA version ' + configuration.getVersion() + ';<br/>' +
+ 'build ' + configuration.getBuildDate() + ';<br/>' +
+ 'git: ' + configuration.getGitHash() + '</td>' +
+ '<td align="right"><a href="http://wwwen.uni.lu/lcsb/" title="LCSB - Luxembourg Centre for Systems Biomedicine" target="_blank">' +
+ '<h:graphicImage library="images" name="lcsb.png" width="80" height="80" border="0" alt="LCSB - Luxembourg Centre for Systems Biomedicine"/>' +
+ '</a></td>' +
+ '</tr>\n' +
+ '</table>', xss: false
+ });
+ return div;
+ })
+}
+
+function createLoginDiv(params) {
+ var loggedIn = false;
+ var result = functions.createElement({type: "center"});
+ var resultDiv = functions.createElement({type: "div", className: "loginPanel", style: "text-align:left"});
+ result.appendChild(resultDiv);
+ resultDiv.appendChild(functions.createElement({
+ type: "div",
+ className: "headerFormTitle",
+ content: "AUTHORIZATION FORM"
+ }));
+ var guiUtils = new GuiUtils();
+ var table = functions.createElement({
+ type: "div",
+ className: "loginDataPanelGrid",
+ style: "display: table;border-spacing:5px"
+ });
+ table.appendChild(guiUtils.createTableRow([
+ functions.createElement({type: "label", className: "labelText", content: "LOGIN:"}),
+ functions.createElement({type: "input", className: "minerva-input-text", id: "username"})]
+ ));
+ table.appendChild(guiUtils.createTableRow([
+ functions.createElement({type: "label", className: "labelText", content: "PASSWORD:"}),
+ functions.createElement({
+ type: "input",
+ inputType: "password",
+ className: "minerva-input-password",
+ id: "password"
+ })]
+ ));
+
+ table.appendChild(guiUtils.createTableRow([
+ functions.createElement({type: "label", className: "labelText"}),
+ functions.createElement({type: "button", className: "labelText", id: "login", content: "LOGIN"})]
+ ));
+
+ resultDiv.appendChild(table);
+ resultDiv.appendChild(functions.createElement({type: "br"}));
+ resultDiv.appendChild(functions.createElement({type: "br"}));
+ resultDiv.appendChild(functions.createElement({
+ type: "a",
+ href: "javascript:;",
+ id: "go_to_map_button",
+ className: "adminLink",
+ content: '<i class="fa fa-chevron-right"></i> BACK TO MAP',
+ xss: false
+ }));
+ resultDiv.appendChild(functions.createElement({type: "br"}));
+ resultDiv.appendChild(functions.createElement({
+ type: "a",
+ href: "javascript:;",
+ id: "register_button",
+ className: "adminLink",
+ content: '<i class="fa fa-chevron-right"></i> REQUEST AN ACCOUNT</a>',
+ xss: false
+ }));
+
+ var fromPage = GuiConnector.getParams["from"];
+
+ $("#login", result).on("click", function login() {
+ var loginString = document.getElementById('username').value;
+ var passwordString = document.getElementById('password').value;
+ return ServerConnector.login(loginString, passwordString).then(function () {
+ loggedIn = true;
+ if (fromPage !== undefined) {
+ window.location.href = fromPage;
+ } else {
+ window.location.href = ServerConnector.getServerBaseUrl();
+ }
+ }, function (error) {
+ if (error.constructor.name === "InvalidCredentialsError") {
+ GuiConnector.alert("invalid credentials");
+ } else {
+ GuiConnector.alert(error);
+ }
+ });
+ });
+ $('#go_to_map_button', result).click(function () {
+ return ServerConnector.getProjectId().then(function (projectId) {
+ window.location.href = ServerConnector.getServerBaseUrl() + '?id=' + projectId;
+ });
+ });
+ $('#register_button', result).click(function () {
+ return ServerConnector.getProjectId().then(function (projectId) {
+ var email, content;
+ return ServerConnector.getConfigurationParam("REQUEST_ACCOUNT_EMAIL").then(function (result) {
+ email = result;
+ return ServerConnector.getConfigurationParam("REQUEST_ACCOUNT_DEFAULT_CONTENT");
+ }).then(function (result) {
+ content = encodeURIComponent(result);
+ document.location.href = 'mailto:' + email + '?subject=MINERVA account request&body=' + content;
+ });
+ });
+ });
+
+ return result;
+}
+
+
+function createLogin(params) {
+ params = modifyParamsForTouchInterface(params);
+ if (!(params instanceof CustomMapOptions)) {
+ params = new CustomMapOptions(params);
+ }
+ initGlobals(params);
+ return ServerConnector.getToken().then(function () {
+ return ServerConnector.getConfiguration();
+ }).then(function (footer) {
+ var loginDiv = createLoginDiv(params);
+ params.getElement().appendChild(loginDiv);
+ return createFooter(params);
+ }).then(function (footer) {
+ params.getElement().appendChild(footer);
+ return insertGoogleAnalyticsCode();
+ })
}
function createExport(params) {
diff --git a/frontend-js/src/test/js/minerva-test.js b/frontend-js/src/test/js/minerva-test.js
index e9a70470e4..133dac4438 100644
--- a/frontend-js/src/test/js/minerva-test.js
+++ b/frontend-js/src/test/js/minerva-test.js
@@ -265,7 +265,7 @@ describe('minerva global', function () {
});
});
- describe('create Admin', function () {
+ describe('createAdmin', function () {
it('as admin', function () {
helper.loginAsAdmin();
var options = null;
@@ -292,6 +292,13 @@ describe('minerva global', function () {
});
});
});
+ describe('createLogin', function () {
+ it('default', function () {
+ return minerva.createLogin({element: testDiv}).then(function () {
+ assert.ok(testDiv.innerHTML.indexOf("MiNERVA") >= 0);
+ });
+ });
+ });
it('getProject', function () {
return ServerConnectorMock.getProject().then(function (project) {
var options = helper.createCustomMapOptions(project);
diff --git a/web/src/main/webapp/login.xhtml b/web/src/main/webapp/login.xhtml
index c97f8449ee..2565b6395b 100644
--- a/web/src/main/webapp/login.xhtml
+++ b/web/src/main/webapp/login.xhtml
@@ -2,135 +2,51 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
- xmlns:h="http://java.sun.com/jsf/html"
- xmlns:f="http://java.sun.com/jsf/core"
- xmlns:ui="http://java.sun.com/jsf/facelets"
->
+ xmlns:h="http://java.sun.com/jsf/html"
+ xmlns:f="http://java.sun.com/jsf/core"
+ xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
- <title>minerva - Authorization form</title>
- <link rel="shortcut icon" href="./resources/images/favicon.png" type="image/png"/>
+ <title>minerva - Authorization form</title>
+ <link rel="shortcut icon" href="./resources/images/favicon.png"
+ type="image/png" />
- <script src="https://maps.google.com/maps/api/js?libraries=drawing&v=3.26" type="text/javascript"/>
+ <script
+ src="https://maps.google.com/maps/api/js?libraries=drawing&v=3.26"
+ type="text/javascript" />
- <script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>
- <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
- <script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
+ <script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>
+ <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
+ <script
+ src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
- <h:outputScript library="js" name="minerva.js"/>
+ <h:outputScript library="js" name="minerva.js" />
- <h:outputStylesheet library="css" name="style.css"/>
- <h:outputStylesheet library="css" name="minerva.css"/>
- <h:outputStylesheet library="css" name="admin.css"/>
+ <h:outputStylesheet library="css" name="style.css" />
+ <h:outputStylesheet library="css" name="minerva.css" />
+ <h:outputStylesheet library="css" name="admin.css" />
- <script type="text/javascript">
- //<![CDATA[
-
- var loggedIn = false;
-
- minerva.GuiConnector.init();
- minerva.ServerConnector.getSessionData(null);
- minerva.ServerConnector.login().then(function () {
- return minerva.ServerConnector.getProject()
- });
-
-
- function login() {
- var loginString = document.getElementById('username').value;
- var passwordString = document.getElementById('password').value;
- minerva.GuiConnector.init();
- minerva.ServerConnector.getSessionData(null);
- return minerva.ServerConnector.login(loginString, passwordString);
- }
-
- function init() {
- var fromPage = minerva.GuiConnector.getParams["from"];
- if (fromPage !== undefined && fromPage !== null && fromPage !== "") {
- $("#from")[0].value = minerva.GuiConnector.getParams["from"];
- }
- $('#login').click(function (e) {
- if (!loggedIn) {
- e.preventDefault();
- return login().then(function () {
- loggedIn = true;
- if (fromPage!==undefined) {
- window.location.href = fromPage;
- } else {
- window.location.href = minerva.ServerConnector.getServerBaseUrl();
- }
- }, function (error) {
- if (error.constructor.name === "InvalidCredentialsError") {
- minerva.GuiConnector.alert("invalid credentials");
- } else {
- minerva.GuiConnector.alert(error);
- }
- });
- }
- });
- $('#go_to_map_button').click(function (e) {
- return minerva.ServerConnector.getProjectId().then(function(projectId){
- window.location.href='#{request.contextPath}/?id='+projectId;
- });
- });
- }
- function requestAccount() {
- var email, content;
- return minerva.ServerConnector.getConfigurationParam("REQUEST_ACCOUNT_EMAIL").then(function(result){
- email = result;
- return minerva.ServerConnector.getConfigurationParam("REQUEST_ACCOUNT_DEFAULT_CONTENT");
- }).then(function(result){
- content = encodeURIComponent(result);
- url = 'mailto:'+email+'?subject=MINERVA account request&body='+content;
- window.location.href=url;
- })
- return false;
- }
-
- //]]>
- </script>
+ <script type="text/javascript">
+ //<![CDATA[
+ function init() {
+ var element = document.getElementById('minervaAppDiv');
+ return minerva.createLogin({
+ element : element,
+ }).catch(function(rejectReason){
+ minerva.GuiConnector.alert(rejectReason, true);
+ });
+ }
+ //]]>
+ </script>
</h:head>
<h:body onload="init();">
- <center>
- <h:form name="loginForm" prependId="false" class="loginPanel" style="text-align:left">
-
- <div class="headerFormTitle">AUTHORIZATION FORM</div>
-
- <h:panelGrid columns="2" styleClass="loginDataPanelGrid">
- <label for="username" class="labelText">LOGIN: </label>
- <h:inputText id="username" name="username" class="minerva-input-text"/>
-
- <label for="password" class="labelText">PASSWORD: </label>
- <h:inputSecret id="password" name="password" type="password"
- class="minerva-input-password"/>
-
- <label class="labelText"> </label>
- <h:commandButton type="submit" id="login" ajax="false"
- value="LOGIN" styleClass="labelText" update="loginMessages"/>
- </h:panelGrid>
-
- <input type="hidden" name="from" id="from" value=""/>
-
- <br/>
- <br/>
- <a href="javascript:;" id="go_to_map_button"
- class="adminLink"><i
- class="fa fa-chevron-right"></i> BACK TO MAP</a>
- <br/>
-
- <a href="javascript:;" id="register_button"
- onClick="requestAccount(); return false"
- class="adminLink"><i class="fa fa-chevron-right"></i> REQUEST AN ACCOUNT</a>
-
- </h:form>
- </center>
-
- <ui:include src="/WEB-INF/components/admin/footer.xhtml"/>
+ <div id="minervaAppDiv" />
</h:body>
</html>
\ No newline at end of file
--
GitLab