[portal-commits] JBoss Portal SVN: r9068 - in branches/JBoss_Portal_Branch_2_6/core/src: bin/portal-core-war/css and 11 other directories.

Author: wesleyhales Date: 2007-11-21 13:32:50 -0500 (Wed, 21 Nov 2007) New Revision: 9068 Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/login.css branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/modal.css branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/login-content-bg.gif branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/login-header-bg.gif branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-black.png branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-gray.png branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-white-grad.png branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-white.png branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/js/ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/js/modal.js branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/common/ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/common/modal.jsp Modified: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/1column/index.jsp branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/3columns/index.jsp branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/generic/index.jsp branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-core-war/WEB-INF/jsp/header/header.jsp branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/WEB-INF/web.xml branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/error.jsp branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/login.jsp Log: JBPORTAL-1789 :Improve login page of jboss-portal to match JBP LnF Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/login.css =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/login.css (rev 0) +++ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/login.css 2007-11-21 18:32:50 UTC (rev 9068) @@ -0,0 +1,66 @@ +div.login-container { + font-family: Verdana, Arial, Helvetica, Sans-Serif, sans-serif; + font-size: 11px; + width: 255px; + height: 155px; + border: 1px solid #436999; + position: relative; + margin: 0 auto 0 auto; + background-color:white; +} + +input.login-button { + background-color: #5078AA; + border-color: #97B7C6 rgb( 37, 72, 105 ) rgb( 37, 72, 105 ) rgb( 151, 183, 198 ); + border-style: solid; + border-width: 1px; + color: #FFFFFF; + font-size: 10px; + font-weight: bold; + position: absolute; + bottom: 20px; + right: 10px; + width: 70px; +} + +div.login-container div.login-header { + background-image: url( ../images/modal/login-header-bg.gif ); + background-position: top left; + background-repeat: repeat-x; + width: 255px; + height: 27px; + text-align: left; +} + +div.login-container div.login-header h2 { + color: #fff; + font-weight: bold; + padding: 7px 0 0 5px; + margin: 0; + font-size: 11px; + text-align: left; +} + +div.login-container div.login-content { + background-image: url( ../images/modal/login-content-bg.gif ); + background-position: top left; + background-repeat: repeat-x; + width: 255px; + height: 116px; + font-weight: bold; + padding: 10px 0 0 0; + text-align: right; +} + +div.login-container div.login-content div.form-field { + height: 25px; + padding-right: 7px; +} + +div.error-message { + color: red; + margin: 0 auto 0 auto; + width: 300px; + font-family: Verdana, Arial, Helvetica, Sans-Serif, sans-serif; + font-size: 11px; +} \ No newline at end of file Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/modal.css =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/modal.css (rev 0) +++ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/css/modal.css 2007-11-21 18:32:50 UTC (rev 9068) @@ -0,0 +1,50 @@ + +/*Modal Window*/ + +.modal { + background-color: #eee; + padding: 0; + border: 0; +} +.modal p { + margin: 8px 0; +} + +.modal-details { + font-size: 8px; + padding-top: 4px; +} + +.modal-caption { + float: left; +} + +.loadingMsg { + float: right; +} + +.modal img { + border: none; + clear: both; +} + +.overlay img { + border: none; +} + +.overlay { + background-image: url(../images/modal/overlay-black.png); +} + +* html .overlay { + background-color: transparent; + background-image: url(blank.gif); + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/modal/overlay-black.png", sizingMethod="scale"); +} + +iframe.login-content{ + padding:0; + margin:0; + border:0; +} + Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/login-content-bg.gif =================================================================== (Binary files differ) Property changes on: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/login-content-bg.gif ___________________________________________________________________ Name: svn:mime-type + application/octet-stream Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/login-header-bg.gif =================================================================== (Binary files differ) Property changes on: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/login-header-bg.gif ___________________________________________________________________ Name: svn:mime-type + application/octet-stream Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-black.png =================================================================== (Binary files differ) Property changes on: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-black.png ___________________________________________________________________ Name: svn:mime-type + application/octet-stream Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-gray.png =================================================================== (Binary files differ) Property changes on: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-gray.png ___________________________________________________________________ Name: svn:mime-type + application/octet-stream Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-white-grad.png =================================================================== (Binary files differ) Property changes on: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-white-grad.png ___________________________________________________________________ Name: svn:mime-type + application/octet-stream Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-white.png =================================================================== (Binary files differ) Property changes on: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/images/modal/overlay-white.png ___________________________________________________________________ Name: svn:mime-type + application/octet-stream Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/js/modal.js =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/js/modal.js (rev 0) +++ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/js/modal.js 2007-11-21 18:32:50 UTC (rev 9068) @@ -0,0 +1,657 @@ + + +var loadingImage = 'loading.gif'; +var closeButton = 'close.gif'; + +// +// getPageScroll() +// Returns array with x,y page scroll values. +// Core code from - quirksmode.org +// +function getPageScroll(){ + + var yScroll; + + if (self.pageYOffset) { + yScroll = self.pageYOffset; + } else if (document.documentElement && document.documentElement.scrollTop){ // Explorer 6 Strict + yScroll = document.documentElement.scrollTop; + } else if (document.body) {// all other Explorers + yScroll = document.body.scrollTop; + } + + arrayPageScroll = new Array('',yScroll) + return arrayPageScroll; +} + + +// +// getPageSize() +// Returns array with page width, height and window width, height +// Core code from - quirksmode.org +// +function getPageSize(){ + + var xScroll, yScroll; + + if (window.innerHeight && window.scrollMaxY) { + xScroll = document.body.scrollWidth; + yScroll = window.innerHeight + window.scrollMaxY; + } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac + xScroll = document.body.scrollWidth; + yScroll = document.body.scrollHeight; + } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari + xScroll = document.body.offsetWidth; + yScroll = document.body.offsetHeight; + } + + var windowWidth, windowHeight; + if (self.innerHeight) { // all except Explorer + windowWidth = self.innerWidth; + windowHeight = self.innerHeight; + } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode + windowWidth = document.documentElement.clientWidth; + windowHeight = document.documentElement.clientHeight; + } else if (document.body) { // other Explorers + windowWidth = document.body.clientWidth; + windowHeight = document.body.clientHeight; + } + + // for small pages with total height less then height of the viewport + if(yScroll < windowHeight){ + pageHeight = windowHeight; + } else { + pageHeight = yScroll; + } + + // for small pages with total width less then width of the viewport + if(xScroll < windowWidth){ + pageWidth = windowWidth; + } else { + pageWidth = xScroll; + } + + + arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) + return arrayPageSize; +} + + +// +// pause(numberMillis) +// Pauses code execution for specified time. Uses busy code, not good. +// Code from http://www.faqts.com/knowledge_base/view.phtml/aid/1602 +// +function pause(numberMillis) { + var now = new Date(); + var exitTime = now.getTime() + numberMillis; + while (true) { + now = new Date(); + if (now.getTime() > exitTime) + return; + } +} + +// +// getKey(key) +// Gets keycode. If 'x' is pressed then it hides the Modal. +// + +function getKey(e){ + if (e == null) { // ie + keycode = event.keyCode; + } else { // mozilla + keycode = e.which; + } + key = String.fromCharCode(keycode).toLowerCase(); + + if(key == 'x'){ hideContentModal(); } +} + + +// +// listenKey() +// +function listenKey () { + document.onkeypress = getKey; +} + + +// +// showModal() +// Preloads images. Pleaces new image in Modal then centers and displays. +// +function showModal(objLink) { + try{ + // prep objects + var objOverlay = document.getElementById('overlay'); + var objModal = document.getElementById('modal'); + var objCaption = document.getElementById('modal-caption'); + var objImage = document.getElementById('modal-image'); + var objLoadingImage = document.getElementById('loadingImage'); + var objModalDetails = document.getElementById('modal-details'); + + var arrayPageSize = getPageSize(); + var arrayPageScroll = getPageScroll(); + + // center loadingImage if it exists + if (objLoadingImage) { + objLoadingImage.style.top = (arrayPageScroll[1] + ((arrayPageSize[3] - 35 - objLoadingImage.height) / 2) + 'px'); + objLoadingImage.style.left = (((arrayPageSize[0] - 20 - objLoadingImage.width) / 2) + 'px'); + objLoadingImage.style.display = 'block'; + } + + // set height and width of Overlay to take up whole page and show + objOverlay.style.height = (arrayPageSize[1] + 'px'); + objOverlay.style.width = (arrayPageSize[2] + 'px'); + objOverlay.style.display = 'block'; + + // preload image + imgPreload = new Image(); + + imgPreload.onload=function(){ + objImage.src = objLink; + + // center Modal and make sure that the top and left values are not negative + // and the image placed outside the viewport + var ModalTop = arrayPageScroll[1] + ((arrayPageSize[3] - 35 - imgPreload.height) / 2); + var ModalLeft = ((arrayPageSize[0] - 20 - imgPreload.width) / 2); + + objModal.style.top = (ModalTop < 0) ? "0px" : ModalTop + "px"; + objModal.style.left = (ModalLeft < 0) ? "0px" : ModalLeft + "px"; + + + objModalDetails.style.width = imgPreload.width + 'px'; + + //objCaption.innerHTML = "Loading..."; + + + // A small pause between the image loading and displaying is required with IE, + // this prevents the previous image displaying for a short burst causing flicker. + if (navigator.appVersion.indexOf("MSIE")!=-1){ + pause(250); + } + + if (objLoadingImage) { + objLoadingImage.style.display = 'none'; + } + + // Hide select boxes as they will 'peek' through the image in IE + //TODO - Need to add a condition form ajax submit so these are hidden during modal showing + //TODO - For now I will comment out + selects = document.getElementsByTagName("select"); + //for (i = 0; i != selects.length; i++) { + //selects[i].style.visibility = "hidden"; + //} + + objModal.style.display = 'block'; + + // After image is loaded, update the overlay height as the new image might have + // increased the overall page height. + arrayPageSize = getPageSize(); + objOverlay.style.height = (arrayPageSize[1] + 'px'); + + // Check for 'x' keypress + listenKey(); + + return false; + } + + imgPreload.src = objLink; + + }catch(Exception){ + + } +} + +// +// hideModal() +// +function hideModal() +{ + // get objects + objOverlay = document.getElementById('overlay'); + objModal = document.getElementById('modal'); + + // hide Modal and overlay + objOverlay.style.display = 'none'; + objModal.style.display = 'none'; + + // make select boxes visible + selects = document.getElementsByTagName("select"); + for (i = 0; i != selects.length; i++) { + selects[i].style.visibility = "visible"; + } + + // disable keypress listener + document.onkeypress = ''; + +} + +function hideContentModal(modalId) +{ + // get objects + objModal = document.getElementById(modalId + '-modal'); + + document.getElementById(modalId + "-overlay").style.display = 'none'; + + // hide Modal and overlay + objModal.style.display = 'none'; + + // make select boxes visible + selects = document.getElementsByTagName("select"); + for (i = 0; i != selects.length; i++) { + selects[i].style.visibility = "visible"; + } + + // disable keypress listener + //document.onkeypress = ''; + +} + +// +// initLoadingModal() +// +function initModal() +{ + try{ + var objBody = document.getElementById("loading-modal"); + + // create overlay div and hardcode some functional styles (aesthetic styles are in CSS file) + var objOverlay = document.createElement("div"); + objOverlay.setAttribute('id','overlay'); + objOverlay.className = 'overlay'; + //objOverlay.onclick = function () {hideModal(); return false;} + objOverlay.style.display = 'none'; + objOverlay.style.position = 'absolute'; + objOverlay.style.top = '0'; + objOverlay.style.left = '0'; + objOverlay.style.zIndex = '90'; + objOverlay.style.width = '100%'; + objBody.insertBefore(objOverlay, objBody.firstChild); + var arrayPageSize = getPageSize(); + var arrayPageScroll = getPageScroll(); + + // preload and create loader image + var imgPreloader = new Image(); + + // if loader image found, create link to hide Modal and create loadingimage + imgPreloader.onload=function(){ + + var objLoadingImageLink = document.createElement("a"); + objLoadingImageLink.setAttribute('href','#'); + objLoadingImageLink.onclick = function () {hideModal(); return false;} + objOverlay.appendChild(objLoadingImageLink); + + var objLoadingImage = document.createElement("img"); + objLoadingImage.src = loadingImage; + objLoadingImage.setAttribute('id','loading-image'); + objLoadingImage.style.position = 'absolute'; + objLoadingImage.style.zIndex = '150'; + objLoadingImageLink.appendChild(objLoadingImage); + + imgPreloader.onload=function(){}; // clear onLoad, as IE will flip out w/animated gifs + + return false; + } + + imgPreloader.src = loadingImage; + + // create Modal div, same note about styles as above + var objModal = document.createElement("div"); + objModal.setAttribute('id','modal'); + objModal.className = 'modal'; + objModal.style.display = 'none'; + objModal.style.position = 'absolute'; + objModal.style.zIndex = '100'; + objBody.insertBefore(objModal, objOverlay.nextSibling); + + // create link + var objLink = document.createElement("a"); + objLink.setAttribute('href','#'); + objLink.setAttribute('title','Click to close'); + objLink.onclick = function () {hideModal(); return false;} + objModal.appendChild(objLink); + + // preload and create close button image + var imgPreloadCloseButton = new Image(); + + // if close button image found, + imgPreloadCloseButton.onload=function(){ + + var objCloseButton = document.createElement("img"); + objCloseButton.src = closeButton; + objCloseButton.setAttribute('id','close-button'); + objCloseButton.style.position = 'absolute'; + objCloseButton.style.zIndex = '200'; + objLink.appendChild(objCloseButton); + + return false; + } + + imgPreloadCloseButton.src = closeButton; + + // create image + var objImage = document.createElement("img"); + objImage.setAttribute('id','modal-image'); + objLink.appendChild(objImage); + + // create details div, a container for the caption and keyboard message + var objModalDetails = document.createElement("div"); + objModalDetails.setAttribute('id','modal-details'); + objModalDetails.className = 'modal-details'; + objModal.appendChild(objModalDetails); + + // create caption + var objCaption = document.createElement("div"); + objCaption.setAttribute('id','modal-caption'); + objCaption.className = 'modal-caption'; + objCaption.style.display = 'none'; + objModalDetails.appendChild(objCaption); + + // create keyboard message +/* + var objLoadingMsg = document.createElement("div"); + objLoadingMsg.setAttribute('id','loadingMsg'); + objLoadingMsg.className = 'loadingMsg'; + objLoadingMsg.innerHTML = 'Loading...'; + objModalDetails.appendChild(objLoadingMsg); +*/ + showModal('/portal/images/modal/loading.gif'); + + }catch(Exception){ + + } +} + +//#######################ContentModal + +function alertModal(modalId,msgContainer){ + if (modalId == null){ + modalId = 'content-modal'; + } + if (msgContainer == null) { + msgContainer = 'message-container'; + } + initContentModal(modalId); + showContentModal(modalId,msgContainer); +} +// +// showModal() +// Preloads images. Pleaces new image in Modal then centers and displays. +// +function showContentModal(modalId,msgContainer) { + try{ + var messageContainer = (msgContainer ? msgContainer : 'message-container'); + + // prep objects + var objModalContainer = document.getElementById(modalId); + var objOverlay = document.getElementById(modalId + '-overlay'); + var objModal = document.getElementById(modalId + '-modal'); + var objCaption = document.getElementById(modalId + '-modal-caption'); + var objImage = document.getElementById(modalId + '-modal-image'); + var objLoadingImage = document.getElementById(modalId + '-loadingImage'); + //var objModalDetails = document.getElementById('modal-details'); + var contentBody = document.getElementById(messageContainer); + var contentWidth = contentBody.style.width.substring(0,contentBody.style.width.indexOf("px")); + var contentHeight = contentBody.style.height.substring(0,contentBody.style.width.indexOf("px")); + + var arrayPageSize = getPageSize(); + var arrayPageScroll = getPageScroll(); + + // center loadingImage if it exists + if (objLoadingImage) { + objLoadingImage.style.top = (arrayPageScroll[1] + ((arrayPageSize[3] - 35 - objLoadingImage.height) / 2) + 'px'); + objLoadingImage.style.left = (((arrayPageSize[0] - 20 - objLoadingImage.width) / 2) + 'px'); + objLoadingImage.style.display = 'block'; + } + // set height and width of Overlay to take up whole page and show + objOverlay.style.height = (arrayPageSize[1] + 'px'); + objOverlay.style.width = (arrayPageSize[2] + 'px'); + objOverlay.style.display = 'block'; + + + + // center Modal and make sure that the top and left values are not negative + // and the image placed outside the viewport + var ModalTop = arrayPageScroll[1] + ((arrayPageSize[3] - 35 - contentHeight) / 2); + var ModalLeft = ((arrayPageSize[0] - 20 - contentWidth) / 2); + + objModal.style.top = (ModalTop < 0) ? "0px" : ModalTop + "px"; + objModal.style.left = (ModalLeft < 0) ? "0px" : ModalLeft + "px"; + + + objModal.style.width = contentWidth + 'px'; + + //objCaption.innerHTML = document.getElementById("errorMessages").innerHTML; + + + // A small pause between the image loading and displaying is required with IE, + // this prevents the previous image displaying for a short burst causing flicker. + if (navigator.appVersion.indexOf("MSIE")!=-1){ + pause(250); + } + + if (objLoadingImage) { + objLoadingImage.style.display = 'none'; + } + + // Hide select boxes as they will 'peek' through the image in IE + + selects = document.getElementsByTagName("select"); + //had to hard-code a check to see if we are forcing this to be hidden. + //if so, then do not hide selectboxes; because the modal is not being shown + //alert(document.getElementById("content-modal").style.display == 'none'); + var hideSelects = true; + try{ + if (!document.getElementById(modalId).style.display == 'none'){ + hideSelects = false; + } + }catch(Exception){ + //alert(Exception); + } + + if (hideSelects || !document.getElementById(modalId).style.display == 'none'){ + //alert("test"); + for (i = 0; i != selects.length; i++) { + selects[i].style.visibility = "hidden"; + } + } + + objModal.style.display = 'block'; + objModalContainer.style.display = 'block'; + // After image is loaded, update the overlay height as the new image might have + // increased the overall page height. + arrayPageSize = getPageSize(); + objOverlay.style.height = (arrayPageSize[1] + 'px'); + + // Check for 'x' keypress + listenKey(); + + }catch(Exception){ + + } +} + +// +// initLoadingModal() +// +function initContentModal(modalId) +{ + + try{ + if (modalId == null){ + modalId = 'content-modal'; + } + + var objBody = document.getElementById(modalId); + //get the first div - which is message-container + var contentBody = objBody.getElementsByTagName('div')[0]; + + var contentWidth = contentBody.style.width.substring(0,contentBody.style.width.indexOf("px")); + var contentHeight = contentBody.style.height.substring(0,contentBody.style.width.indexOf("px")); + + var hasObjOverlay = document.getElementById(modalId + '-overlay'); + + if(!hasObjOverlay) { //don't create if already exist. + // create overlay div and hardcode some functional styles (aesthetic styles are in CSS file) + var objOverlay = document.createElement("div"); + objOverlay.setAttribute('id',modalId + '-overlay'); + objOverlay.className = 'overlay'; + + objOverlay.style.display = 'none'; + objOverlay.style.position = 'absolute'; + objOverlay.style.top = '0'; + objOverlay.style.left = '0'; + objOverlay.style.zIndex = '90'; + objOverlay.style.width = '100%'; + objOverlay.onclick = function (){hideContentModal(modalId); return false}; + + objBody.insertBefore(objOverlay, objBody.firstChild); + + var arrayPageSize = getPageSize(); + var arrayPageScroll = getPageScroll(); + + // create Modal div, same note about styles as above + var objModal = document.createElement("div"); + objModal.setAttribute('id',modalId + '-modal'); + objModal.className = 'modal'; + objModal.style.display = 'none'; + objModal.style.position = 'absolute'; + objModal.style.zIndex = '100'; + objModal.style.width = contentWidth + 'px'; + objModal.style.height = contentHeight + 'px'; + objModal.innerHTML = contentBody.innerHTML; + objBody.insertBefore(objModal, objOverlay.nextSibling); + } + }catch(Exception){ + + } +} + +function getComponentSize(componentId){ + + var componentWidth; + var componentHeight; + var componentTop; + var componentLeft; + + var component = document.getElementById(componentId); + + componentWidth = component.clientWidth; + componentHeight = component.clientHeight; + componentLeft = component.offsetLeft; + componentTop = component.offsetTop; + + return new Array(componentWidth,componentHeight,componentLeft,componentTop); + +} + +//This creates a modal window per component. +//currently used during ajax calls only in the a4j:status tag +function createComponentModal(componentId){ + try{ + var loadingModal = document.getElementById("loading-modal"); + + var loadingImage = "/portal/images/modal/loading.gif" + + var arrayComponentSize = getComponentSize(componentId); + var overlayTop = (arrayComponentSize[3]); + var overlayLeft = (arrayComponentSize[2]); + var overlayHeight = (arrayComponentSize[1]); + var overlayWidth = (arrayComponentSize[0]); + + // create overlay div and hardcode some functional styles (aesthetic styles are in CSS file) + var objOverlay = document.getElementById(componentId + 'overlay'); + + if (!objOverlay){ + objOverlay = document.createElement("div"); + objOverlay.setAttribute('id',componentId + 'overlay'); + objOverlay.className = 'overlay'; + objOverlay.style.position = 'absolute'; + objOverlay.style.display = 'block'; + } + + objOverlay.style.height = (overlayHeight + 'px'); + objOverlay.style.width = (overlayWidth + 'px'); + + + loadingModal.insertBefore(objOverlay, loadingModal.firstChild); + + // create Modal div, same note about styles as above + var objModal = document.getElementById(componentId + 'modal'); + + if (!objModal){ + objModal = document.createElement("div"); + objModal.setAttribute('id',componentId + 'modal'); + objModal.className = 'modal'; + objOverlay.appendChild(objModal); + } + + // preload and create loader image + var imgPreloader = new Image(); + + // if loader image found, create link to hide Modal and create loadingimage + //imgPreloader.onload=function(){ + + /*var objLoadingImageLink = document.getElementById(componentId + 'ImageLink'); + + if (!objLoadingImageLink){ + objLoadingImageLink.setAttribute('href','#'); + objLoadingImageLink.onclick = function () {hideModal(); return false;} + objLoadingImageLink.setAttribute('id',componentId + 'ImageLink'); + objModal.appendChild(objLoadingImageLink); + }*/ + + var objLoadingImageWidth = "100"; + var objLoadingImage = document.getElementById(componentId + 'loading-image') + + if(!objLoadingImage){ + objLoadingImage = document.createElement("img"); + objLoadingImage.src = loadingImage; + objLoadingImage.setAttribute('id',componentId + 'loading-image'); + objLoadingImage.style.position = 'relative'; + objLoadingImage.style.width = objLoadingImageWidth + 'px'; + objModal.appendChild(objLoadingImage); + } + + imgPreloader.onload=function(){}; // clear onLoad, as IE will flip out w/animated gifs + + if (objLoadingImage) { + objLoadingImage.style.display = 'block'; + } + + var ModalTop = ((overlayHeight - 35 - imgPreloader.height) / 2); + var ModalLeft = ((overlayWidth - 20 - objLoadingImageWidth) / 2); + + objModal.style.top = (ModalTop < 0) ? "0px" : ModalTop + "px"; + objModal.style.left = (ModalLeft < 0) ? "0px" : ModalLeft + "px"; + objModal.style.width = objLoadingImageWidth + 'px'; + objModal.style.display = 'block'; + objModal.style.position = 'relative'; + + + + if (navigator.appVersion.indexOf("MSIE")!=-1){ + pause(250); + } + + objOverlay.style.top = (arrayComponentSize[3] + 'px'); + objOverlay.style.left = (arrayComponentSize[2] + 'px'); + objOverlay.style.height = (arrayComponentSize[1] + 'px'); + objOverlay.style.width = (arrayComponentSize[0] + 'px'); + objOverlay.style.zIndex = 0; + objOverlay.style.position = 'absolute'; + + return false; + //} + + imgPreloader.src = loadingImage; + + + }catch(Exception){ + + } + +} + Modified: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/1column/index.jsp =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/1column/index.jsp 2007-11-21 17:32:46 UTC (rev 9067) +++ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/1column/index.jsp 2007-11-21 18:32:50 UTC (rev 9068) @@ -16,6 +16,7 @@ <body id="body"> <p:region regionName='AJAXScripts' regionID='AJAXScripts'/> +<%@ include file="../common/modal.jsp" %> <div id="portal-container"> <div id="sizer"> <div id="expander"> Modified: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/3columns/index.jsp =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/3columns/index.jsp 2007-11-21 17:32:46 UTC (rev 9067) +++ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/3columns/index.jsp 2007-11-21 18:32:50 UTC (rev 9068) @@ -16,6 +16,7 @@ <body id="body"> <p:region regionName='AJAXScripts' regionID='AJAXScripts'/> +<%@ include file="../common/modal.jsp" %> <div id="portal-container"> <div id="sizer"> <div id="expander"> @@ -52,8 +53,7 @@ </table> <hr class="cleaner"/> </div> - </div> - </div> + </div> <!-- TODO: Fix the auto jump in this tag --> Added: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/common/modal.jsp =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/common/modal.jsp (rev 0) +++ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/common/modal.jsp 2007-11-21 18:32:50 UTC (rev 9068) @@ -0,0 +1,8 @@ +<script src="/portal-core/js/modal.js" type="text/javascript"></script> +<link rel="stylesheet" href="/portal-core/css/modal.css" type="text/css" /> +<div id="login-modal" style="display:none"> + <div id="login-modal-msg" style="display:none;width:257px;height:157px"> + <% String loginHeight = "100%"; %> + <iframe src="/portal/auth/?loginheight=0" frameborder="0" width="257" height="157" scrolling="no" marginheight="0" marginwidth="0" name="login-content" class="login-content"></iframe> + </div> +</div> \ No newline at end of file Modified: branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/generic/index.jsp =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/generic/index.jsp 2007-11-21 17:32:46 UTC (rev 9067) +++ branches/JBoss_Portal_Branch_2_6/core/src/bin/portal-core-war/layouts/generic/index.jsp 2007-11-21 18:32:50 UTC (rev 9068) @@ -16,12 +16,13 @@ <body id="body"> <p:region regionName='AJAXScripts' regionID='AJAXScripts'/> +<%@ include file="../common/modal.jsp" %> <div id="portal-container"> <div id="sizer"> <div id="expander"> <div id="logoName"></div> <table border="0" cellpadding="0" cellspacing="0" id="header-container"> - <tr> + <tr> <td align="center" valign="top" id="header"> <!-- Utility controls --> Modified: branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-core-war/WEB-INF/jsp/header/header.jsp =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-core-war/WEB-INF/jsp/header/header.jsp 2007-11-21 17:32:46 UTC (rev 9067) +++ branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-core-war/WEB-INF/jsp/header/header.jsp 2007-11-21 18:32:50 UTC (rev 9068) @@ -16,7 +16,15 @@ if (user == null) { %> -<a href="<%= loginURL %>">Login</a> + + <script type="text/javascript"> + document.write('<a href=\"#\" onclick=\"alertModal(\'login-modal\',\'login-modal-msg\');return false;\">Login</a>'); + </script> + +<noscript> + <a href="<%= loginURL %>">Login</a> +</noscript> + <% } else Modified: branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/WEB-INF/web.xml =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/WEB-INF/web.xml 2007-11-21 17:32:46 UTC (rev 9067) +++ branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/WEB-INF/web.xml 2007-11-21 18:32:50 UTC (rev 9068) @@ -108,10 +108,6 @@ <url-pattern>/login.jsp</url-pattern> </servlet-mapping> <servlet-mapping> - <servlet-name>jsp</servlet-name> - <url-pattern>/error.jsp</url-pattern> - </servlet-mapping> - <servlet-mapping> <servlet-name>default</servlet-name> <url-pattern>/images/login_bottom.png</url-pattern> </servlet-mapping> @@ -215,7 +211,7 @@ <realm-name>JBoss Portal</realm-name> <form-login-config> <form-login-page>/login.jsp</form-login-page> - <form-error-page>/error.jsp</form-error-page> + <form-error-page>/login.jsp</form-error-page> </form-login-config> </login-config> Modified: branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/error.jsp =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/error.jsp 2007-11-21 17:32:46 UTC (rev 9067) +++ branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/error.jsp 2007-11-21 18:32:50 UTC (rev 9068) @@ -20,99 +20,13 @@ ~ Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA ~ ~ 02110-1301 USA, or see the FSF site: http://www.fsf.org. ~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~--%> - <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> - -<!-- -| Uncomment to enable JOSSO server based SSO authentication. -| Redirects the user to the propper login page. Configured as the login url the web.xml for this application. ---> - -<% - /* response.sendRedirect(request.getContextPath() + "/josso_login/"); */ -%> - -<html> +<html xmlns="http://www.w3.org/1999/xhtml"> <head> - <style> - body { - background-color: #FFFFFF; - } - td { - color: #000000; - font-family: verdana, arial, sans-serif; - font-size: 12px; - line-height: 130%; - } - </style> </head> - -<body OnLoad="document.loginform.j_username.focus();"> - -<table width="100%" height="600" cellpadding="0" cellspacing="1"> - <tr> - <td valign="middle" align="center"> - <form method="POST" action="<%= response.encodeURL("j_security_check") %>" name="loginform" id="loginForm"> - - <% String prefix = request.getContextPath(); %> - - <table cellspacing="0" cellpadding="0"> - <tr> - <td><img src="<%= prefix %>/images/login_top_left.png"/></td> - <td style="background-image:url('<%= prefix %>/images/login_top.png')"></td> - <td><img src="<%= prefix %>/images/login_top_right.png"/></td> - </tr> - <tr> - <td style="background-image:url('<%= prefix %>/images/login_left.png')"></td> - <!-- REAL CONTENT CELL : begin --> - <td style="background-color:#b4b4b4" align="center"> - <b>JBoss Portal Login</b><br/><br/> - - <p style="color:red"><%= request.getAttribute("org.jboss.portal.loginError") %> - </p> - <table> - <tr> - <td align="right" width="50"> - Username:&nbsp; - </td> - <td align="left"> - <input type="text" name="j_username" value=""/> - </td> - </tr> - <tr> - <td align="right" width="50"> - Password:&nbsp; - </td> - <td align="left"> - <input type="password" name="j_password" value=""/> - </td> - </tr> - <tr> - <td colspan="2" align="right"> - <input type="submit" name="login" value="Login"/> - </td> - </tr> - </table> - - </td> - <!-- REAL CONTENT CELL : end --> - <td style="background-image:url('<%= prefix %>/images/login_right.png')"></td> - </tr> - <tr> - <td><img src="<%= prefix %>/images/login_bottom_left.png"/></td> - <td style="background-image:url('<%= prefix %>/images/login_bottom.png')"></td> - <td><img src="<%= prefix %>/images/login_bottom_right.png"/></td> - </tr> - </table> - - - </form> - - </td> - </tr> -</table> - +<body> + <!--Leaving as stub until release--> </body> </html> Modified: branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/login.jsp =================================================================== --- branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/login.jsp 2007-11-21 17:32:46 UTC (rev 9067) +++ branches/JBoss_Portal_Branch_2_6/core/src/resources/portal-server-war/login.jsp 2007-11-21 18:32:50 UTC (rev 9068) @@ -20,97 +20,47 @@ ~ Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA ~ ~ 02110-1301 USA, or see the FSF site: http://www.fsf.org. ~ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~--%> - <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> - -<!-- -| Uncomment to enable JOSSO server based SSO authentication. -| Redirects the user to the propper login page. Configured as the login url the web.xml for this application. ---> - -<% - /* response.sendRedirect(request.getContextPath() + "/josso_login/"); */ -%> - - -<html> +<html xmlns="http://www.w3.org/1999/xhtml"> <head> - <style> + <style type="text/css"> body { - background-color: #FFFFFF; + margin: 0; + padding: 0; + border: 0; + padding-top: <%=(request.getParameter("loginheight") != null ? request.getParameter("loginheight") : "300px")%>; } - td { - color: #000000; - font-family: verdana, arial, sans-serif; - font-size: 12px; - line-height: 130%; - } </style> + <link rel="stylesheet" href="/portal-core/css/login.css" type="text/css" /> </head> - <body OnLoad="document.loginform.j_username.focus();"> +<div class="error-message" + style="display:<%=(request.getAttribute("org.jboss.portal.loginError") != null ? "" : "none")%>;"><%=request.getAttribute("org.jboss.portal.loginError") %> +</div> +<div class="login-container"> -<table width="100%" height="600" cellpadding="0" cellspacing="1"> - <tr> - <td valign="middle" align="center"> - <form method="POST" action="<%= response.encodeURL("j_security_check") %>" name="loginform" id="loginForm"> + <div class="login-header"> + <h2>JBoss Portal Login</h2> + </div> + <div class="login-content"> - <% String prefix = request.getContextPath(); %> + <form method="POST" action="<%= response.encodeURL("j_security_check") %>" name="loginform" id="loginForm" + target="_parent"> + <label for="j_username"> + <div class="form-field">Username: + <input type="text" name="j_username" id="j_username" value=""/></div> + </label> + <label for="j_password"> + <div class="form-field">Password: + <input type="password" name="j_password" id="j_password" value=""/></div> + </label> - <table cellspacing="0" cellpadding="0"> - <tr> - <td><img src="<%= prefix %>/images/login_top_left.png"/></td> - <td style="background-image:url('<%= prefix %>/images/login_top.png')"></td> - <td><img src="<%= prefix %>/images/login_top_right.png"/></td> - </tr> - <tr> - <td style="background-image:url('<%= prefix %>/images/login_left.png')"></td> - <!-- REAL CONTENT CELL : begin --> - <td style="background-color:#b4b4b4" align="center"> - <b>JBoss Portal Login</b><br/><br/> - <table> - <tr> - <td align="right" width="50"> - Username:&nbsp; - </td> - <td align="left"> - <input type="text" name="j_username" value=""/> - </td> - </tr> - <tr> - <td align="right" width="50"> - Password:&nbsp; - </td> - <td align="left"> - <input type="password" name="j_password" value=""/> - </td> - </tr> - <tr> - <td colspan="2" align="right"> - <input type="submit" name="login" value="Login"/> - </td> - </tr> - </table> + <input type="submit" name="login" value="Login" class="login-button"/> + </form> - </td> - <!-- REAL CONTENT CELL : end --> - <td style="background-image:url('<%= prefix %>/images/login_right.png')"></td> - </tr> - <tr> - <td><img src="<%= prefix %>/images/login_bottom_left.png"/></td> - <td style="background-image:url('<%= prefix %>/images/login_bottom.png')"></td> - <td><img src="<%= prefix %>/images/login_bottom_right.png"/></td> - </tr> - </table> - - - </form> - - </td> - </tr> -</table> - + </div> +</div> </body> </html>