[gatein-commits] gatein SVN: r7329 - in portal/branches/dom/web: eXoResources/src/main/webapp/javascript/eXo/webui and 5 other directories.

Author: phuong_vu Date: 2011-09-07 08:12:19 -0400 (Wed, 07 Sep 2011) New Revision: 7329 Modified: portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortal.js portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIDashboard.js portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIPopupWindow.js portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupMessage/Stylesheet.css portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupWindow/Stylesheet.css portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupWindow/background/PortalComposer.gif portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/portal/UIPortalComposer.gtmpl portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIConfirmation.gtmpl portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupMessages.gtmpl portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupWindow.gtmpl Log: [DOM] UIPopupWindow and UIPopupMessage optimization Modified: portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortal.js =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortal.js 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/portal/UIPortal.js 2011-09-07 12:12:19 UTC (rev 7329) @@ -645,19 +645,13 @@ UIPortal.prototype.toggleComposer = function(clickedEle) { var portalComposer = eXo.core.DOMUtil.findAncestorByClass(clickedEle, "UIPortalComposer"); - var middleBlock = eXo.core.DOMUtil.findFirstChildByClass(portalComposer, "div", "MLPortalComposer"); - var bottomBlock = eXo.core.DOMUtil.findFirstChildByClass(portalComposer, "div", "BLPortalComposer"); - var fakeBottom = eXo.core.DOMUtil.findFirstChildByClass(portalComposer, "div", "Bottom"); - if(middleBlock && middleBlock.style.display != "none") { - middleBlock.style.display = "none"; - bottomBlock.style.display = "none"; - fakeBottom.style.display = "block"; - eXo.core.DOMUtil.replaceClass(clickedEle, "ExpandIcon", "CollapseIcon"); + var content = eXo.core.DOMUtil.findFirstChildByClass(portalComposer, "div", "UIWindowContent"); + if(content && content.style.display != "none") { + content.style.display = "none"; + eXo.core.DOMUtil.replaceClass(clickedEle, "ExpandIcon", "CollapseIcon"); } else { - middleBlock.style.display = "block"; - bottomBlock.style.display = "block"; - fakeBottom.style.display = "none"; - eXo.core.DOMUtil.replaceClass(clickedEle, "CollapseIcon", "ExpandIcon"); + content.style.display = "block"; + eXo.core.DOMUtil.replaceClass(clickedEle, "CollapseIcon", "ExpandIcon"); } var requestStr = eXo.env.server.createPortalURL(portalComposer.id, "Toggle", true); ajaxAsyncGetRequest(requestStr); Modified: portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIDashboard.js =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIDashboard.js 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIDashboard.js 2011-09-07 12:12:19 UTC (rev 7329) @@ -279,7 +279,7 @@ if(eXo.core.Browser.isIE6()) gadgetContainer.style.width = "99.5%"; var selectPopup = DOMUtil.findPreviousElementByTagName(uiContainer, "div"); - var closeButton = DOMUtil.findFirstDescendantByClass(selectPopup, "div", "CloseButton"); + var closeButton = DOMUtil.findFirstDescendantByClass(selectPopup, "a", "CloseButton"); closeButton.onclick = eXo.webui.UIDashboard.showHideSelectContainer; var colsContainer = DOMUtil.findFirstChildByClass(gadgetContainer, "div", "UIColumns"); Modified: portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIPopupWindow.js =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIPopupWindow.js 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIPopupWindow.js 2011-09-07 12:12:19 UTC (rev 7329) @@ -44,7 +44,7 @@ if(contentBlock && (eXo.core.Browser.getBrowserHeight() - 100 < contentBlock.offsetHeight)) { contentBlock.style.height = (eXo.core.Browser.getBrowserHeight() - 100) + "px"; } - var popupBar = DOMUtil.findFirstDescendantByClass(popup, 'div' ,'PopupTitle') ; + var popupBar = DOMUtil.findFirstDescendantByClass(popup, 'span' ,'PopupTitle') ; popupBar.onmousedown = this.initDND ; @@ -54,7 +54,7 @@ } if(isResizable) { - var resizeBtn = DOMUtil.findFirstDescendantByClass(popup, "div", "ResizeButton"); + var resizeBtn = DOMUtil.findFirstDescendantByClass(popup, "span", "ResizeButton"); resizeBtn.style.display = 'block' ; resizeBtn.onmousedown = this.startResizeEvt ; } @@ -256,7 +256,7 @@ if(!dragObject.uiWindowContent) return; if(eXo.core.Browser.browserType == "mozilla") { dragObject.uiWindowContent.style.overflow = "hidden" ; - var elements = eXo.core.DOMUtil.findDescendantsByClass(dragObject.uiWindowContent, "div" ,"PopupMessageBox") ; + var elements = eXo.core.DOMUtil.findDescendantsByClass(dragObject.uiWindowContent, "ul" ,"PopupMessageBox") ; for(var i = 0; i < elements.length; i++) { elements[i].style.overflow = "hidden" ; } @@ -270,7 +270,7 @@ var dragObject = dndEvent.dragObject ; if(eXo.core.Browser.browserType == "mozilla" && dragObject.uiWindowContent) { dragObject.uiWindowContent.style.overflow = "auto" ; - var elements = eXo.core.DOMUtil.findDescendantsByClass(dragObject.uiWindowContent, "div" ,"PopupMessageBox") ; + var elements = eXo.core.DOMUtil.findDescendantsByClass(dragObject.uiWindowContent, "ul" ,"PopupMessageBox") ; for(var i = 0; i < elements.length; i++) { elements[i].style.overflow = "auto" ; } Modified: portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupMessage/Stylesheet.css =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupMessage/Stylesheet.css 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupMessage/Stylesheet.css 2011-09-07 12:12:19 UTC (rev 7329) @@ -17,14 +17,7 @@ * 02110-1301 USA, or see the FSF site: http://www.fsf.org. */ -.UIPopupMessages { -} -.UIPopupMessages .UIHorizontalTabs { - height: 31px; - background: url('background/MessageTabBar.gif') repeat-x bottom; -} - .UIPopupMessages .UIHorizontalTabs .TabsContainer { height: 31px; } @@ -33,10 +26,11 @@ border: none; } -.UIPopupMessages .PopupMessageBox { +.UIPopupMessages ul { padding: 5px; height: 200px; overflow: auto; + margin: 0px; } .UIPopupMessages .WarningMessage .MessageContainer { @@ -59,126 +53,41 @@ border-bottom: 1px dotted #c3c3c3; } -.UIPopupMessages .PopupMessageContainer .PopupIcon { - float: left; /* orientation=lt */ - float: right; /* orientation=rt */ - width: 16px; height: 16px; - margin-top: 5px; +.UIPopupMessages .MessageContainer .PopupIcon { + display: block; + line-height: 16px; + padding: 5px 0 5px 22px; } -.UIPopupMessages .PopupMessageContainer .InfoMessageIcon { - background: url(/eXoResources/skin/DefaultSkin/skinIcons/16x16/icons/Info.gif) no-repeat top; +.UIPopupMessages .MessageContainer .InfoMessageIcon { + background: url(/eXoResources/skin/DefaultSkin/skinIcons/16x16/icons/Info.gif) no-repeat left 7px; } -.UIPopupMessages .PopupMessageContainer .WarningMessageIcon { - background: url(/eXoResources/skin/DefaultSkin/skinIcons/16x16/icons/Warning.gif) no-repeat top; +.UIPopupMessages .MessageContainer .WarningMessageIcon { + background: url(/eXoResources/skin/DefaultSkin/skinIcons/16x16/icons/Warning.gif) no-repeat left 7px; } -.UIPopupMessages .PopupMessageContainer .ErrorMessageIcon { - background: url(/eXoResources/skin/DefaultSkin/skinIcons/16x16/icons/Error.gif) no-repeat top; +.UIPopupMessages .MessageContainer .ErrorMessageIcon { + background: url(/eXoResources/skin/DefaultSkin/skinIcons/16x16/icons/Error.gif) no-repeat left 7px; } -.UIPopupMessages .PopupMessageContainer .PopupMessage { - line-height: 16px; - vertical-align: middle; - padding: 5px 0px; - margin-left: 25px; /* orientation=lt */ - margin-right: 25px; /* orientation=rt */ +.UIPopupMessages .UIHorizontalTabs{ + background: url(background/MessageTabBar.gif) repeat-x center bottom; + height: 31px; } -.UIPopupMessages .MessageActionBar { -} - /***************************Begin PoupWindow ExoMessage**********************************/ -.UIPopupWindow .ExoMessageDecorator { - overflow: hidden;/*Fix for IE*/ -} - -.UIPopupWindow .ExoMessageDecorator .TopLeftCornerDecorator { - background: url('background/ExoMessageDecorator.png') no-repeat left top; - padding-left: 6px; - height: 31px; -} - -.UIPopupWindow .ExoMessageDecorator .TopRightCornerDecorator { - background: url('background/ExoMessageDecorator.png') no-repeat right -31px; - padding-right: 6px; - height: 31px; -} - -.UIPopupWindow .ExoMessageDecorator .TopCenterDecorator { - background: url('background/ExoMessageDecorator.png') repeat-x center -62px; - height: 26px; -} - -.UIPopupWindow .ExoMessageDecorator .PopupTitle { - background: none; - text-align: left; /* orientation=lt */ - text-align: right; /* orientation=rt */ -} - -.UIPopupWindow .ExoMessageDecorator .PopupTitleIcon { - width: 16px; height: 16px; +.ExoMessageDecorator .OverflowContainer .PopupTitleIcon { + width: 16px; + height: 16px; background: url('/eXoResources/skin/DefaultSkin/skinIcons/16x16/icons/Message.gif') no-repeat; float: left; /* orientation=lt */ float: right; /* orientation=rt */ - margin: 4px 0px 0px 4px; /* orientation=lt */ - margin: 4px 4px 0px 0px; /* orientation=rt */ + margin: 4px 0px 0px 8px; /* orientation=lt */ + margin: 4px 8px 0px 0px; /* orientation=rt */ } -.UIPopupWindow .ExoMessageDecorator .MiddleLeftSideDecorator { - background: url('background/MiddleExoMessage.png') repeat-y left; - padding-left: 4px; - height: 100%; -} - -.UIPopupWindow .ExoMessageDecorator .MiddleRightSideDecorator { - background: url('background/MiddleExoMessage.png') repeat-y right; - padding-right: 4px; -} - -.UIPopupWindow .ExoMessageDecorator .MiddleCenterDecorator { - background: #e1e1e1; - padding: 6px 7px; -} - -.UIPopupWindow .ExoMessageDecorator .UIWindowContent { - padding: 0px; margin: 0px; - border: none; -} - -.UIPopupWindow .ExoMessageDecorator .PopupContent { - background: none; -} - -.UIPopupWindow .ExoMessageDecorator .UIWindowContent .Content { - padding: 0px; margin: 0px; - border: none; -} - -.UIPopupWindow .ExoMessageDecorator .BottomLeftCornerDecorator { - background: url('background/ExoMessageDecorator.png') no-repeat left -93px; - padding-left: 6px; -} - -.UIPopupWindow .ExoMessageDecorator .BottomRightCornerDecorator { - background: url('background/ExoMessageDecorator.png') no-repeat right -99px; - padding-right: 6px; -} - -.UIPopupWindow .ExoMessageDecorator .BottomCenterDecorator { - background: url('background/ExoMessageDecorator.png') repeat-x center -105px; - height: 6px; -} - -.UIPopupWindow .ExoMessageDecorator .UITabContentContainer { +.ExoMessageDecorator .UITabContentContainer { background: white; } - -.UIPopupWindow .ExoMessageDecorator .UITabContentContainer .UITabContent { - height: auto; - background: none; - border: none; - padding: 0px; -} Modified: portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupWindow/Stylesheet.css =================================================================== --- portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupWindow/Stylesheet.css 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupWindow/Stylesheet.css 2011-09-07 12:12:19 UTC (rev 7329) @@ -17,293 +17,251 @@ * 02110-1301 USA, or see the FSF site: http://www.fsf.org. */ -.UIPopupWindow { - position: absolute; - visibility: hidden; -} - -.UIPopupWindow .PopupTitleIcon { - float: left; /* orientation=lt */ - float: right; /* orientation=rt */ - margin: 5px 0px 0px 3px; /* orientation=lt */ - margin: 5px 3px 0px 0px; /* orientation=rt */ - width: 16px; height: 16px; - background: url('background/PopupWindow.gif') no-repeat left bottom; -} - -.UIPopupWindow .PopupTitleIconRight { - float: right; - margin: 5px 3px 0px 0px; - width: 19px; height: 16px; - background: url('background/PopupWindow.gif') no-repeat left bottom; -} - -.UIPopupWindow .PopupTitle { - margin: 4px 26px 0px 26px; - line-height: 16px; - vertical-align: middle; - cursor: move; - color: #000; -} - -.UIPopupWindow .CloseButton { - float: right; /* orientation=lt */ - float: left; /* orientation=rt */ - margin: 5px 3px 0px 0px; /* orientation=lt */ - margin: 5px 0px 0px 3px; /* orientation=rt */ - cursor: pointer; - width: 23px; height: 17px; - background: url('background/CloseIcon.gif') no-repeat right top; -} - -.UIPopupWindow .BackButton { - float: right; /* orientation=lt */ - float: left; /* orientation=rt */ - margin: 5px 3px 0px 0px; /* orientation=lt */ - margin: 5px 0px 0px 3px; /* orientation=rt */ - cursor: pointer; - width: 18px; height: 18px; - background: url('background/Back.gif') no-repeat right bottom; -} - -.UIPopupWindow .TopLeftCornerDecorator { - background: url('background/TopPopup.png') no-repeat left top; - padding-left: 8px; -} - -.UIPopupWindow .TopCenterDecorator { - background: url('background/TopPopup.png') repeat-x left -66px; - height: 28px; - padding-top: 5px; -} - -.UIPopupWindow .TopRightCornerDecorator { - background: url('background/TopPopup.png') no-repeat right -33px; - padding-right: 8px; -} - -.UIPopupWindow .MiddleLeftSideDecorator { - background: url('background/MiddlePopup.png') repeat-y left top; - padding-left: 8px; -} - -.UIPopupWindow .MiddleCenterDecorator { - background: #e1e1e1; - padding: 0px 3px 5px 3px; -} - -.UIPopupWindow .MiddleRightSideDecorator { - background: url('background/MiddlePopup.png') repeat-y right top; - padding-right: 8px; - } - -.UIPopupWindow .UIWindowContent { - border: 1px solid #bdbcbd; -} - -.UIPopupWindow .PopupContent { - width: 100%; - background: #f7f7f7; - overflow: auto; -} - -.UIPopupWindow .ResizeButton { - background: url('background/ResizeBtn.gif') no-repeat right top; /* orientation=lt */ - background: url('background/ResizeBtn-rt.gif') no-repeat left top; /* orientation=rt */ - display: block; - float: right; /* orientation=lt */ - float: left; /* orientation=rt */ - cursor: nw-resize; /* orientation=lt */ - cursor: ne-resize; /* orientation=rt */ -} - -.UIPopupWindow .BottomLeftCornerDecorator { - background: url('background/BottomPopup.png') no-repeat left top; - padding-left: 7px; -} - -.UIPopupWindow .BottomCenterDecorator { - background: url('background/BottomPopup.png') repeat-x left -14px; - height: 7px; -} - -.UIPopupWindow .BottomRightCornerDecorator { - background: url('background/BottomPopup.png') no-repeat right -7px; - padding-right: 7px; -} - -.UIPopupWindow .Content .UIPageBrowser { - padding: 7px 4px 0px 8px; - width: 96%; - margin: auto; -} - -/************************** UIPortalComposer **************************/ - -.UIPortalComposer { -} - -.UIPortalComposer .TLPortalComposer { - background: transparent url(background/PortalComposer.gif) no-repeat left top; - padding-left: 7px; -} - -.UIPortalComposer .TRPortalComposer { - background: transparent url(background/PortalComposer.gif) no-repeat right top; - padding-right: 7px; -} - -.UIPortalComposer .TCPortalComposer { - background: transparent url(background/PortalComposer.gif) repeat-x left -34px; - height: 34px; -} - -.UIPortalComposer .CollapseIcon { - background: url(background/ExpandIcon.gif) no-repeat left; /* orientation=lt */ - background: url(background/ExpandIcon-rt.gif) no-repeat right; /* orientation=rt */ - width: 16px; - height: 14px; - float: left; /* orientation=lt */ - float: right; /* orientation=rt */ - margin: 8px 5px; - cursor: pointer; -} - -.UIPortalComposer .ExpandIcon { - background: url(background/GrayDownIcon.gif) no-repeat left; /* orientation=lt */ - background: url(background/GrayDownIcon.gif) no-repeat right; /* orientation=rt */ - width: 16px; - height: 14px; - float: left; /* orientation=lt */ - float: right; /* orientation=rt */ - margin: 8px 5px; - cursor: pointer; -} - -.UIPortalComposer .CloseButton { - background: url(background/CloseIcon.gif) no-repeat right bottom; /* orientation=lt */ - background: url(background/CloseIcon-rt.gif) no-repeat left bottom; /* orientation=rt */ - width: 23px; +.UIPopupWindow { + position: absolute; + visibility: hidden; + background: #E1E1E1; + border: 1px solid #CACACA; + box-shadow: 0 0 5px #AFAFAF; +} + +.UIPopupWindow .PopupTitleIcon { + float: left; /* orientation=lt */ + float: right; /* orientation=rt */ + margin: 5px 0px 0px 8px; /* orientation=lt */ + margin: 5px 8px 0px 0px; /* orientation=rt */ + width: 16px; + height: 16px; + background: url('background/PopupWindow.gif') no-repeat left bottom; +} + +.UIPopupWindow .PopupTitleIconRight { + float: right; + margin: 5px 3px 0px 0px; + width: 19px; height: 16px; + background: url('background/PopupWindow.gif') no-repeat left bottom; +} + +.UIPopupWindow .PopupTitle { + margin: 0px 30px 0px; + line-height: 26px; + vertical-align: middle; + cursor: move; + color: #000; + display: block; +} + +.UIPopupWindow .CloseButton { + float: right; /* orientation=lt */ + float: left; /* orientation=rt */ + margin: 5px 8px 0px 0px; /* orientation=lt */ + margin: 5px 0px 0px 8px; /* orientation=rt */ + cursor: pointer; + width: 23px; height: 17px; + background: url('background/CloseIcon.gif') no-repeat right top; +} + +.UIPopupWindow .BackButton { + float: right; /* orientation=lt */ + float: left; /* orientation=rt */ + margin: 5px 3px 0px 0px; /* orientation=lt */ + margin: 5px 0px 0px 3px; /* orientation=rt */ + cursor: pointer; + width: 18px; height: 18px; + background: url('background/Back.gif') no-repeat right bottom; +} + +.UIPopupWindow .UIWindowContent { + border: 1px solid #bdbcbd; + background: #EBEBEB; + -moz-border-radius: 0px; + -webkit-border-radius: 0px; + border-radius: 0px; + margin: 5px 8px 8px 8px; +} + +.UIPopupWindow .PopupContent { + width: 100%; + background: #f7f7f7; + overflow: auto; +} + +.UIPopupWindow .ResizeButton { + background: url('background/ResizeBtn.gif') no-repeat right top; /* orientation=lt */ + background: url('background/ResizeBtn-rt.gif') no-repeat left top; /* orientation=rt */ + display: block; + float: right; /* orientation=lt */ + float: left; /* orientation=rt */ + cursor: nw-resize; /* orientation=lt */ + cursor: ne-resize; /* orientation=rt */ +} + +.UIPopupWindow > .OverflowContainer{ + background: #e1e1e1; + height: 25px; +} + +.UIPopupWindow .Content .UIPageBrowser { + padding: 7px 4px 0px 8px; + width: 96%; + margin: auto; +} + +/************************** UIPortalComposer **************************/ + +.UIPortalComposer { + border: 1px solid #A2A3A9; + border-top: none; + background: #ececec; +} + +.UIPortalComposer .CollapseIcon { + background: url(background/ExpandIcon.gif) no-repeat left; /* orientation=lt */ + background: url(background/ExpandIcon-rt.gif) no-repeat right; /* orientation=rt */ + width: 16px; + height: 14px; + float: left; /* orientation=lt */ + float: right; /* orientation=rt */ + margin: 8px 5px; + cursor: pointer; +} + +.UIPortalComposer .ExpandIcon { + background: url(background/GrayDownIcon.gif) no-repeat left; /* orientation=lt */ + background: url(background/GrayDownIcon.gif) no-repeat right; /* orientation=rt */ + width: 16px; + height: 14px; + float: left; /* orientation=lt */ + float: right; /* orientation=rt */ + margin: 8px 5px; + cursor: pointer; +} + +.UIPortalComposer .CloseButton { + background: url(background/CloseIcon.gif) no-repeat right bottom; /* orientation=lt */ + background: url(background/CloseIcon-rt.gif) no-repeat left bottom; /* orientation=rt */ + width: 23px; height: 17px; float: right; /* orientation=lt */ float: left; /* orientation=rt */ - margin: 6px 0px 0px 2px; /* orientation=lt */ - margin: 6px 2px 0px 0px; /* orientation=rt */ -} - -.UIPortalComposer .SaveButton { + margin: 6px 5px 0px 2px; /* orientation=lt */ + margin: 6px 2px 0px 5px; /* orientation=rt */ +} + +.UIPortalComposer .SaveButton { background: url(background/EdittedSaveIcon.gif) no-repeat right bottom; /* orientation=lt */ background: url(background/EdittedSaveIcon-rt.gif) no-repeat left bottom; /* orientation=rt */ - cursor: pointer; - float: right; /* orientation=lt */ - float: left; /* orientation=rt */ - height: 17px; + cursor: pointer; + float: right; /* orientation=lt */ + float: left; /* orientation=rt */ + height: 17px; margin: 6px 0px 0px 2px; /* orientation=lt */ - margin: 6px 2px 0px 0px; /* orientation=rt */ - width: 23px; -} - -.UIPortalComposer .BackButton { - background: url(background/BackIcon.gif) no-repeat right bottom; /* orientation=lt */ - background: url(background/BackIcon-rt.gif) no-repeat left bottom; /* orientation=rt */ - width: 23px; + margin: 6px 2px 0px 0px; /* orientation=rt */ + width: 23px; +} + +.UIPortalComposer .BackButton { + background: url(background/BackIcon.gif) no-repeat right bottom; /* orientation=lt */ + background: url(background/BackIcon-rt.gif) no-repeat left bottom; /* orientation=rt */ + width: 23px; height: 17px; float: right; /* orientation=lt */ - float: left; /* orientation=rt */ - margin: 6px 0px 0px 0px; -} - -.UIPortalComposer .EdittedSaveButton { + float: left; /* orientation=rt */ + margin: 6px 0px 0px 0px; +} + +.UIPortalComposer .EdittedSaveButton { background: url(background/SaveIcon.gif) no-repeat right bottom; /* orientation=lt */ - background: url(background/SaveIcon-rt.gif) no-repeat left bottom; /* orientation=rt */ - cursor: pointer; - float: right; /* orientation=lt */ - float: left; /* orientation=rt */ + background: url(background/SaveIcon-rt.gif) no-repeat left bottom; /* orientation=rt */ + cursor: pointer; + float: right; /* orientation=lt */ + float: left; /* orientation=rt */ height: 17px; margin: 6px 0px 0px 2px; /* orientation=lt */ - margin: 6px 2px 0px 0px; /* orientation=rt */ - width: 23px; -} - -.UIPortalComposer .PopupTitle { - background: none; - margin: 0px 42px 0px 26px; /* orientation=lt */ - margin: 0px 26px 0px 42px; /* orientation=rt */ - text-align: left; /* orientation=lt */ - text-align: right; /* orientation=rt */ - color: #000; - font-size: 12px; - font-family: arial; - cursor: move; - line-height: 30px; - height: 30px; -} - -.UIPortalComposer .MLPortalComposer { - background: url(background/MiddlePortalComposer.gif) repeat-y left top; - padding-left: 3px; -} - -.UIPortalComposer .MRPortalComposer { - background: url(background/MiddlePortalComposer.gif) repeat-y right top; - padding-right: 3px; -} - -.UIPortalComposer .MCPortalComposer { - background: #d8dae1 url(background/CenterMiddleWindow.gif) repeat-x left top; - padding: 4px; - padding-bottom: 0px; -} - -.UIPortalComposer .BLPortalComposer { - border: 1px solid #a2a3a9; - border-top: none; - background: #d8dae1; -} - -.UIPortalComposer .BRPortalComposer { - padding: 0px 6px 6px 6px; -} - -.UIPortalComposer .BCPortalComposer { - background: #ececec; - border: 1px solid #bbbcc2; + margin: 6px 2px 0px 0px; /* orientation=rt */ + width: 23px; } - -.UIPortalComposer .Bottom { - border-bottom: 1px solid #a2a3a9; -} - -.UIPortalComposer .UIWindowContent { - border: none; -} - -.UIPortalComposer .PopupContent { - background: none; -} - -.UIPortalComposer .UITabPane { - height: auto; -} - -.UIPortalComposer .UITabPane .TabPaneContent { - padding: 0px; -} - -.UIPortalComposer .UIHorizontalTabs .TabsContainer { - background: url(background/CenterHorizontalTabs.gif) repeat-x left bottom; - height: 25px; -} - -.UIPortalComposer .UITabPane .UITabContentContainer { -} - -.UIPortalComposer .UITabPane .UITabContentContainer .UITabContent { - background: none; - border: none; -} - -.UIPortalComposer .ResizeButton { - width: 13px; height: 13px; - margin: 0; + +.UIPortalComposer .PopupTitle { + background: none; + margin: 0px 42px 0px 0px; /* orientation=lt */ + margin: 0px 0px 0px 42px; /* orientation=rt */ + text-align: left; /* orientation=lt */ + text-align: right; /* orientation=rt */ + color: #000; + font-size: 12px; + font-family: arial; + cursor: move; + line-height: 30px; + height: 30px; + display: block; +} + +.UIPortalComposer .Bottom { + border-bottom: 1px solid #a2a3a9; +} + +.UIPortalComposer .UIWindowContent{ + border: none; + margin: 5px 4px 8px; +} + +.UIPortalComposer .PopupContent { + background: none; +} + +.UIPortalComposer .UITabPane { + height: auto; +} + +.UIPortalComposer .UITabPane .TabPaneContent { + padding: 0px; +} + +.UIPortalComposer .UIHorizontalTabs .TabsContainer { + background: url(background/CenterHorizontalTabs.gif) repeat-x left bottom; + height: 25px; +} + +.UIPortalComposer .UITabPane .UITabContentContainer { +} + +.UIPortalComposer .UITabPane .UITabContentContainer .UITabContent { + background: none; + border: none; +} + +.UIPortalComposer .ResizeButton { + width: 13px; + height: 13px; + margin: 0px 0px 5px 0px; +} + +.UIPortalComposer > .OverflowContainer{ + background: url(background/PortalComposer.gif) repeat-x left -34px; + height: 30px; +} + +.ExoMessageDecorator{ + -moz-border-radius: 5px 5px 0px 0px; + -webkit-border-radius: 5px 5px 0px 0px; + border-radius: 5px 5px 0px 0px; +} + +.ExoMessageDecorator .OverflowContainer{ + background: #f3f3f3; + height: 26px; + padding-top: 5px; + -moz-border-radius: 5px 5px 0px 0px; + -webkit-border-radius: 5px 5px 0px 0px; + border-radius: 5px 5px 0px 0px; +} + +.ExoMessageDecorator .UIWindowContent{ + border: none; + background: #e1e1e1; +} + +.ExoMessageDecorator .PopupContent{ + background: none; } \ No newline at end of file Modified: portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/webui/component/UIPopup/UIPopupWindow/background/PortalComposer.gif =================================================================== (Binary files differ) Modified: portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/portal/UIPortalComposer.gtmpl =================================================================== --- portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/portal/UIPortalComposer.gtmpl 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/portal/UIPortalComposer.gtmpl 2011-09-07 12:12:19 UTC (rev 7329) @@ -8,60 +8,36 @@ rcontext.getJavascriptManager().addJavascript("eXo.webui.UIPopup.setAlign('$popupId', 2, 5, 5);"); %> <div class="UIPopupWindow UIDragObject UIPortalComposer" exo:minWidth="200" exo:minHeight="200" id="$uicomponent.id" style="width: 320px; display: block;"> - <div class="TLPortalComposer"> - <div class="TRPortalComposer"> - <div class="TCPortalComposer"> - <div class="OverflowContainer"> - <div class="<%=uicomponent.isCollapsed ? "CollapseIcon" : "ExpandIcon"%>" onclick="eXo.portal.UIPortal.toggleComposer(this)"><span></span></div> - <% if(uicomponent.isShowControl) { %> - <a class="CloseButton" title="<%=_ctx.appRes("word.abort")%>" href="<%=uicomponent.event("CloseComposer")%>"><span></span></a> - <% if (uicomponent.isUsedInWizard()) { %> - <a class="<%= isEditted ? "EdittedSaveButton" : "SaveButton" %>" title="<%=_ctx.appRes("word.finish")%>" href="<%=uicomponent.url("Finish")%>" onclick="eXo.core.DOMUtil.disableOnClick(this);" ><span></span></a> - <a class="BackButton" title="<%=_ctx.appRes("word.back")%>" href="<%=uicomponent.event("Back")%>"> - - </a> - <% } else {%> - <a class="<%= isEditted ? "EdittedSaveButton" : "SaveButton" %>" title="<%=_ctx.appRes("word.finish")%>" href="<%=uicomponent.event("Finish")%>"><span></span></a> - <% } - } %> - <div class="PopupTitle"><%=_ctx.appRes(popupId + ".title."+ popupId)%></div> - </div> - </div> - </div> + <div class="OverflowContainer ClearFix"> + <span class="<%=uicomponent.isCollapsed ? "CollapseIcon" : "ExpandIcon"%>" onclick="eXo.portal.UIPortal.toggleComposer(this)"></span> + <% if(uicomponent.isShowControl) { %> + <a class="CloseButton" title="<%=_ctx.appRes("word.abort")%>" href="<%=uicomponent.event("CloseComposer")%>"><span></span></a> + <% if (uicomponent.isUsedInWizard()) { %> + <a class="<%= isEditted ? "EdittedSaveButton" : "SaveButton" %>" title="<%=_ctx.appRes("word.finish")%>" href="<%=uicomponent.url("Finish")%>" onclick="eXo.core.DOMUtil.disableOnClick(this);" ></a> + <a class="BackButton" title="<%=_ctx.appRes("word.back")%>" href="<%=uicomponent.event("Back")%>"></a> + <% } else {%> + <a class="<%= isEditted ? "EdittedSaveButton" : "SaveButton" %>" title="<%=_ctx.appRes("word.finish")%>" href="<%=uicomponent.event("Finish")%>"></a> + <% } + } %> + <span class="PopupTitle"><%=_ctx.appRes(popupId + ".title."+ popupId)%></span> </div> - - <div class="MLPortalComposer" style="display: <%=uicomponent.isCollapsed ? "none": "block"%>"> - <div class="MRPortalComposer"> - <div class="MCPortalComposer"> - <div class="UIWindowContent"> - <div style="width: 100%;"> - <div class="PopupContent" style="height: 390px"> - <div class="Component"><% uicomponent.renderChildren(); %></div> - </div> - </div> - </div> - </div> + + <div class="UIWindowContent" style="display: <%=uicomponent.isCollapsed ? "none": "block"%>" > + <div class="PopupContent Component" style="height: 390px"> + <% uicomponent.renderChildren(); %> </div> - </div> - - <div class="BLPortalComposer" style="display: <%=uicomponent.isCollapsed ? "none": "block"%>"> - <div class="BRPortalComposer"> - <div class="BCPortalComposer ClearFix"> - <div class="UIAction"> - <span onclick="<%= uicomponent.event("ViewProperties") %>;eXo.portal.UIPortal.changeComposerSaveButton()" class="ActionButton SimpleStyle1"> - <a href="javascript:void(0);" class="PageProfileIcon"><%=_ctx.appRes(popupId + ".action.ViewProperties")%></a> - </span> - <% String changeEditMode = uicomponent.event("SwitchMode", null, null); %> - <span onclick="$changeEditMode" class="ActionButton SimpleStyle1" onmouseover="this.style.color = '#058ee6'" onmouseout="this.style.color='black'"> - <a href="javascript:void(0);" class="ViewAsBlockIcon"><%=_ctx.appRes(popupId + ".action.SwitchMode")%></a> - </span> - </div> - <div class="ResizeButton"><span></span></div> - </div> + + <div class="UIAction" style="display: <%=uicomponent.isCollapsed ? "none": "block"%>"> + <span onclick="<%= uicomponent.event("ViewProperties") %>;eXo.portal.UIPortal.changeComposerSaveButton()" class="ActionButton SimpleStyle1"> + <a href="javascript:void(0);" class="PageProfileIcon"><%=_ctx.appRes(popupId + ".action.ViewProperties")%></a> + </span> + <% String changeEditMode = uicomponent.event("SwitchMode", null, null); %> + <span onclick="$changeEditMode" class="ActionButton SimpleStyle1" onmouseover="this.style.color = '#058ee6'" onmouseout="this.style.color='black'"> + <a href="javascript:void(0);" class="ViewAsBlockIcon"><%=_ctx.appRes(popupId + ".action.SwitchMode")%></a> + </span> </div> + <span class="ResizeButton"></span> </div> - <div class="Bottom" style="display: none;"><span></span></div> - </div> <script language="javascript"> eXo.portal.portalMode = <%=uicomponent.getPortalMode();%>; Modified: portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIConfirmation.gtmpl =================================================================== --- portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIConfirmation.gtmpl 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIConfirmation.gtmpl 2011-09-07 12:12:19 UTC (rev 7329) @@ -41,22 +41,14 @@ void printMessage(String message, String messageType) { - println "<div class=\"UITabContent\">"; - println " <div class=\"PopupMessageBox\">"; - println " <div class=\"$messageType\">"; - println " <div class=\"PopupMessageContainer\">"; - println " <div class=\"MessageContainer\">"; - println " <div class=\"PopupIcon ${messageType}Icon\"><span></span></div>"; - println " <div class=\"PopupMessage\">"; + println " <ul class=\"UITabContent PopupMessageBox $messageType\">"; + println " <li class=\"MessageContainer\">"; + println " <span class=\"PopupIcon ${messageType}Icon\">"; println message; - println " </div>"; - println " <div style=\"clear:left\"><span></span></div>"; - println " </div>"; - println " </div>"; - println " </div>"; - println " </div>"; - println "</div>"; - } + println " </span>"; + println " </li>"; + println " </ul>"; + } void printAction(List actions) { @@ -66,56 +58,32 @@ } } %> - <div class="UIPopupWindow UIDragObject" id="$popupId" style="width: 550px; display: none;"> - <div class="ExoMessageDecorator"> - <div class="TopLeftCornerDecorator"> - <div class="TopRightCornerDecorator"> - <div class="TopCenterDecorator"> - <div class="OverflowContainer"> - <div class="PopupTitleIcon"><span></span></div> - <div class="CloseButton" title="<%=_ctx.appRes("UIConfirmation.Close")%>" onclick="<%=uicomponent.event("Close")%>"><span></span></div> - <div class="PopupTitle"><%= _ctx.appRes("UIConfirmation.title.exoMessages") %></div> - </div> + <div class="UIPopupWindow UIDragObject ExoMessageDecorator" id="$popupId" style="width: 550px; display: none;"> + <div class="OverflowContainer ClearFix"> + <span class="PopupTitleIcon"></span> + <a class="CloseButton" title="<%=_ctx.appRes("UIConfirmation.Close")%>" onclick="<%=uicomponent.event("Close")%>"></a> + <span class="PopupTitle"><%= _ctx.appRes("UIConfirmation.title.exoMessages") %></span> + </div> + + <div class="UIWindowContent"> + <div class="PopupContent UIPopupMessages"> + <div class="UIHorizontalTabs"> + <div class="TabsContainer"> + <% + boolean flag = true + flag = printTab(message, "Warning", flag); + %> </div> </div> - </div> - - <div class="MiddleLeftSideDecorator"> - <div class="MiddleRightSideDecorator"> - <div class="MiddleCenterDecorator"> - <div class="UIWindowContent"> - <div class="PopupContent"> - <div class="UIPopupMessages"> - <div class="UIHorizontalTabs"> - <div class="TabsContainer"> - <% - boolean flag = true - flag = printTab(message, "Warning", flag); - %> - </div> - </div> - <div class="UITabContentContainer"> - <% - printMessage(message, "ErrorMessage"); - %> - </div> - <div class="MessageActionBar"> - <div class="UIAction"> - <% - printAction(actions); - %> - </div> - </div> - </div> - </div> - </div> - </div> + <div class="UITabContentContainer"> + <% + printMessage(message, "ErrorMessage"); + %> </div> - </div> - <div><span></span></div> - <div class="BottomLeftCornerDecorator"> - <div class="BottomRightCornerDecorator"> - <div class="BottomCenterDecorator"><span></span></div> + <div class="UIAction MessageActionBar"> + <% + printAction(actions); + %> </div> </div> </div> Modified: portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupMessages.gtmpl =================================================================== --- portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupMessages.gtmpl 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupMessages.gtmpl 2011-09-07 12:12:19 UTC (rev 7329) @@ -48,15 +48,11 @@ style = ""; isSelected = true; } - println "<div class=\"UITabContent\" $style>"; - println " <div class=\"PopupMessageBox\">"; - println " <div class=\"$messType\">"; - println " <div class=\"PopupMessageContainer\">"; + println " <ul class=\"UITabContent PopupMessageBox $messType\" $style>"; for(mess in messages) { if(mess.messageKey == null) continue; - println " <div class=\"MessageContainer\">"; - println " <div class=\"PopupIcon ${messType}Icon\"><span></span></div>"; - println " <div class=\"PopupMessage\">"; + println " <li class=\"MessageContainer\">"; + println " <span class=\"PopupIcon ${messType}Icon\">"; String msgValue = _ctx.appRes(mess.messageKey); Object[] msgArguments = mess.getMessageAruments(); if(msgArguments != null && msgArguments.length > 0) { @@ -72,82 +68,49 @@ } EntityEncoder encoder = EntityEncoder.FULL; msgValue = encoder.encode(msgValue); - println msgValue; - println " </div>"; - println " <div style=\"clear:left\"><span></span></div>"; - println " </div>"; - } - println " </div>"; - println " </div>"; - println " </div>"; - println " </div>"; - return isSelected; + println msgValue; + + println " </span>"; + println " </li>"; + } + println " </ul>"; + return isSelected; } %> - <div class="UIPopupWindow UIDragObject" id="$popupId" style="width: 550px; display: none;"> - <div class="ExoMessageDecorator"> - <div class="TopLeftCornerDecorator"> - <div class="TopRightCornerDecorator"> - <div class="TopCenterDecorator"> - <div class="OverflowContainer"> - <div class="PopupTitleIcon"><span></span></div> - <div class="CloseButton" title="<%=_ctx.appRes("UIPopupMessages.Close")%>" onclick="<%=uicomponent.event("Close")%>"><span></span></div> - <div class="PopupTitle"><%=_ctx.appRes("UIPopupMessages.title.exoMessages")%></div> - </div> - </div> - </div> + <div class="UIPopupWindow UIDragObject ExoMessageDecorator" id="$popupId" style="width: 550px; display: none;"> + <div class="OverflowContainer ClearFix"> + <span class="PopupTitleIcon"></span> + <a class="CloseButton" title="<%=_ctx.appRes("UIPopupMessages.Close")%>" onclick="<%=uicomponent.event("Close")%>"></a> + <span class="PopupTitle"><%=_ctx.appRes("UIPopupMessages.title.exoMessages")%></span> </div> - <div class="MiddleLeftSideDecorator"> - <div class="MiddleRightSideDecorator"> - <div class="MiddleCenterDecorator"> - - <div class="UIWindowContent"> - <div class="PopupContent"> - <div class="UIPopupMessages"> - - <div class="UIHorizontalTabs"> - <div class="TabsContainer"> - <% - boolean flag = false; - flag = printTab(errors, "Error", flag); - flag = printTab(warnings, "Warning", flag); - flag = printTab(infos, "Info", flag); - %> - </div> - </div> - - <div class="UITabContentContainer"> - <% - flag = false; - flag = printMessages(errors, "ErrorMessage", flag); - flag = printMessages(warnings, "WarningMessage", flag); - flag = printMessages(infos, "InfoMessage", flag); - %> - </div> - <div class="MessageActionBar"> - - <div class="UIAction"> - <a href="javascript:void(0);" onclick="<%=uicomponent.event("Close")%>" class="ActionButton LightBlueStyle"><%=_ctx.appRes("UIPopupMessages.button.ok")%></a> - </div> - - </div> - - </div> - </div> + <div class="UIWindowContent"> + <div class="PopupContent UIPopupMessages"> + <div class="UIHorizontalTabs"> + <div class="TabsContainer"> + <% + boolean flag = false; + flag = printTab(errors, "Error", flag); + flag = printTab(warnings, "Warning", flag); + flag = printTab(infos, "Info", flag); + %> </div> - </div> - </div> + + <div class="UITabContentContainer"> + <% + flag = false; + flag = printMessages(errors, "ErrorMessage", flag); + flag = printMessages(warnings, "WarningMessage", flag); + flag = printMessages(infos, "InfoMessage", flag); + %> + </div> + <div class="UIAction MessageActionBar"> + <a href="javascript:void(0);" onclick="<%=uicomponent.event("Close")%>" class="ActionButton LightBlueStyle"><%=_ctx.appRes("UIPopupMessages.button.ok")%></a> + </div> + </div> </div> - <div><span></span></div> - <div class="BottomLeftCornerDecorator"> - <div class="BottomRightCornerDecorator"> - <div class="BottomCenterDecorator"><span></span></div> - </div> - </div> - </div> </div> <% rcontext.getJavascriptManager().addJavascript("eXo.webui.UIPopupWindow.init('$popupId', false, null, null, $uicomponent.showMask);"); Modified: portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupWindow.gtmpl =================================================================== --- portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupWindow.gtmpl 2011-09-07 11:23:24 UTC (rev 7328) +++ portal/branches/dom/web/portal/src/main/webapp/groovy/webui/core/UIPopupWindow.gtmpl 2011-09-07 12:12:19 UTC (rev 7329) @@ -32,40 +32,17 @@ if(uicomponent.isShow()) show = "block"; %> -<div class="UIPopupWindow UIDragObject" exo:minWidth="200" exo:minHeight="200" id="$popupId" style="$widthStyle display: $show;"> - <div class="NormalStyle"> - <div class="TopLeftCornerDecorator"> - <div class="TopRightCornerDecorator"> - <div class="TopCenterDecorator"> - <div class="OverflowContainer"> - <div class="PopupTitleIcon"><span></span></div> - <%if (showCloseButton) {%> - <!-- <div class="CloseButton" title="Close Window" onclick="<%=uicomponent.event("ClosePopup")%>"><span></span></div> --> - <div class="CloseButton" title="<%=_ctx.appRes("UIPopupWindow.Close")%>" onclick="<%=uicomponent.event(uicomponent.getCloseEvent())%>"><span></span></div> - <% } else { %> - <div class="PopupTitleIconRight"><span></span></div> - <% } %> - <div class="PopupTitle"><%=_ctx.appRes(rsId + ".title."+ title)%></div> - </div> - </div> - </div> - </div> - <div class="MiddleLeftSideDecorator"> - <div class="MiddleRightSideDecorator"> - <div class="MiddleCenterDecorator"> - <div class="UIWindowContent"> - <div style="width: 100%;"><div class="PopupContent" style="$heightStyle"><% uicomponent.renderChildren(); %></div></div> - </div> - </div> - </div> - </div> - <div><span></span></div> - <div class="BottomLeftCornerDecorator"> - <div class="BottomRightCornerDecorator"> - <div class="BottomCenterDecorator"> - <div class="ResizeButton"><span></span></div> - </div> - </div> - </div> +<div class="UIPopupWindow UIDragObject NormalStyle" exo:minWidth="200" exo:minHeight="200" id="$popupId" style="$widthStyle display: $show;"> + <div class="OverflowContainer ClearFix"> + <span class="PopupTitleIcon"></span> + <%if (showCloseButton) {%> + <a class="CloseButton" title="<%=_ctx.appRes("UIPopupWindow.Close")%>" onclick="<%=uicomponent.event(uicomponent.getCloseEvent())%>"></a> + <% } else { %> + <div class="PopupTitleIconRight"><span></span></div> + <% } %> + <span class="PopupTitle"><%=_ctx.appRes(rsId + ".title."+ title)%></span> </div> + <div class="UIWindowContent"> + <div class="PopupContent" style="$heightStyle"><% uicomponent.renderChildren(); %></div> + </div> </div> \ No newline at end of file