From 48e587119a4a4bd6c654dc35f74f5d02b3e301aa Mon Sep 17 00:00:00 2001 From: Jouni Koivuviita Date: Fri, 3 Oct 2008 10:51:37 +0000 Subject: [PATCH] New default theme for sub window. Shadow implementation much simplified, now we can have different kind of shadows in classes extending IToolkitOverlay. IWindow now extends IToolkitOverlay. svn changeset:5591/svn branch:trunk --- .../ITMILL/themes/default/shadow/shadow.css | 106 ++---- WebContent/ITMILL/themes/default/styles.css | 331 ++++++++---------- .../themes/default/window/img/bottom-left.png | Bin 1011 -> 245 bytes .../default/window/img/bottom-right.png | Bin 1626 -> 342 bytes .../themes/default/window/img/close.png | Bin 393 -> 548 bytes .../themes/default/window/img/resize.png | Bin 267 -> 209 bytes .../default/window/img/shadow/bottom-left.png | Bin 0 -> 683 bytes .../window/img/shadow/bottom-right.png | Bin 0 -> 583 bytes .../default/window/img/shadow/bottom.png | Bin 0 -> 150 bytes .../default/window/img/shadow/center.png | Bin 0 -> 109 bytes .../themes/default/window/img/shadow/left.png | Bin 0 -> 144 bytes .../default/window/img/shadow/right.png | Bin 0 -> 146 bytes .../default/window/img/shadow/top-left.png | Bin 0 -> 510 bytes .../default/window/img/shadow/top-right.png | Bin 0 -> 654 bytes .../themes/default/window/img/shadow/top.png | Bin 0 -> 148 bytes .../themes/default/window/img/top-left.png | Bin 626 -> 282 bytes .../themes/default/window/img/top-right.png | Bin 1048 -> 808 bytes .../ITMILL/themes/default/window/window.css | 225 +++++++----- .../gwt/client/ui/IToolkitOverlay.java | 271 +++++++++----- .../terminal/gwt/client/ui/IWindow.java | 45 ++- 20 files changed, 510 insertions(+), 468 deletions(-) create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/bottom-left.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/bottom-right.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/bottom.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/center.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/left.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/right.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/top-left.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/top-right.png create mode 100644 WebContent/ITMILL/themes/default/window/img/shadow/top.png diff --git a/WebContent/ITMILL/themes/default/shadow/shadow.css b/WebContent/ITMILL/themes/default/shadow/shadow.css index f4c1392755..dbe1a7858a 100644 --- a/WebContent/ITMILL/themes/default/shadow/shadow.css +++ b/WebContent/ITMILL/themes/default/shadow/shadow.css @@ -1,70 +1,68 @@ .i-shadow { position: absolute; - overflow: auto; } .i-shadow .top-left { position: absolute; overflow: hidden; - top: 0; left: 0; + top: -3px; left: -4px; width: 8px; height: 8px; background: transparent url(img/top-left.png); } .i-shadow .top { position: absolute; overflow: hidden; - top: 0; left: 8px; - height: 8px; - right: 8px; + top: -3px; left: 4px; + height: 8px; right: 4px; background: transparent url(img/top.png); } .i-shadow .top-right { position: absolute; overflow: hidden; - top: 0; right: 0; + top: -3px; right: -4px; width: 8px; height: 8px; background: transparent url(img/top-right.png); } .i-shadow .left { position: absolute; overflow: hidden; - top: 8px; left: 0; + top: 5px; left: -4px; width: 8px; - bottom: 8px; + bottom: 3px; background: transparent url(img/left.png); } .i-shadow .center { position: absolute; overflow: hidden; - top: 8px; left: 8px; - bottom: 8px; right: 8px; + top: 5px; left: 4px; + bottom: 3px; right: 4px; background: transparent url(img/center.png); } .i-shadow .right { position: absolute; overflow: hidden; - top: 8px; right: 0; + top: 5px; right: -4px; width: 8px; - bottom: 8px; + bottom: 3px; background: transparent url(img/right.png); } .i-shadow .bottom-left { position: absolute; overflow: hidden; - bottom: 0; left: 0; + bottom: -5px; left: -4px; width: 8px; height: 8px; background: transparent url(img/bottom-left.png); } .i-shadow .bottom { position: absolute; overflow: hidden; - bottom: 0; left: 8px; - right: 8px; height: 8px; + bottom: -5px; left: 4px; + right: 4px; height: 8px; background: transparent url(img/bottom.png); } .i-shadow .bottom-right { position: absolute; overflow: hidden; - bottom: 0; right: 0; + bottom: -5px; right: -4px; width: 8px; height: 8px; background: transparent url(img/bottom-right.png); } @@ -73,73 +71,15 @@ -/* And all the same for IE6 (transparent png's) */ +/* For IE6 (no transparent png's, we use a blur filter) */ -* html .i-shadow .top-left { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); +* html .i-shadow * { + display: none; } -* html .i-shadow .top { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); - width: expression((this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth) + "px"); -} - -* html .i-shadow .top-right { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); -} - -* html .i-shadow .left { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); - height: expression((this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight) + "px"); -} - -* html .i-shadow .center { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); - height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); - width: expression((this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth) + "px"); -} - -* html .i-shadow .right { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); - height: expression((this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight) + "px"); -} - -* html .i-shadow .bottom-left { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); -} - -* html .i-shadow .bottom { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); - width: expression((this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth) + "px"); -} - -* html .i-shadow .bottom-right { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); -} \ No newline at end of file +* html .i-shadow { + background: #000; + filter: progid:DXImageTransform.Microsoft.Blur(pixelRadius=2) alpha(opacity=20); + margin-top: -3px; + margin-left: -4px; +} \ No newline at end of file diff --git a/WebContent/ITMILL/themes/default/styles.css b/WebContent/ITMILL/themes/default/styles.css index d7cd928e8c..7d0a8b6857 100644 --- a/WebContent/ITMILL/themes/default/styles.css +++ b/WebContent/ITMILL/themes/default/styles.css @@ -1343,71 +1343,69 @@ input.i-modified, .i-shadow { position: absolute; - overflow: auto; } .i-shadow .top-left { position: absolute; overflow: hidden; - top: 0; left: 0; + top: -3px; left: -4px; width: 8px; height: 8px; background: transparent url(shadow/img/top-left.png); } .i-shadow .top { position: absolute; overflow: hidden; - top: 0; left: 8px; - height: 8px; - right: 8px; + top: -3px; left: 4px; + height: 8px; right: 4px; background: transparent url(shadow/img/top.png); } .i-shadow .top-right { position: absolute; overflow: hidden; - top: 0; right: 0; + top: -3px; right: -4px; width: 8px; height: 8px; background: transparent url(shadow/img/top-right.png); } .i-shadow .left { position: absolute; overflow: hidden; - top: 8px; left: 0; + top: 5px; left: -4px; width: 8px; - bottom: 8px; + bottom: 3px; background: transparent url(shadow/img/left.png); } .i-shadow .center { position: absolute; overflow: hidden; - top: 8px; left: 8px; - bottom: 8px; right: 8px; + top: 5px; left: 4px; + bottom: 3px; right: 4px; background: transparent url(shadow/img/center.png); } .i-shadow .right { position: absolute; overflow: hidden; - top: 8px; right: 0; + top: 5px; right: -4px; width: 8px; - bottom: 8px; + bottom: 3px; background: transparent url(shadow/img/right.png); } .i-shadow .bottom-left { position: absolute; overflow: hidden; - bottom: 0; left: 0; + bottom: -5px; left: -4px; width: 8px; height: 8px; background: transparent url(shadow/img/bottom-left.png); } .i-shadow .bottom { position: absolute; overflow: hidden; - bottom: 0; left: 8px; - right: 8px; height: 8px; + bottom: -5px; left: 4px; + right: 4px; height: 8px; background: transparent url(shadow/img/bottom.png); } .i-shadow .bottom-right { position: absolute; overflow: hidden; - bottom: 0; right: 0; + bottom: -5px; right: -4px; width: 8px; height: 8px; background: transparent url(shadow/img/bottom-right.png); } @@ -1416,76 +1414,18 @@ input.i-modified, -/* And all the same for IE6 (transparent png's) */ - -* html .i-shadow .top-left { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-left.png", sizingMethod='crop'); -} - -* html .i-shadow .top { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top.png", sizingMethod='scale'); - width: expression((this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth) + "px"); -} - -* html .i-shadow .top-right { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/top-right.png", sizingMethod='crop'); -} - -* html .i-shadow .left { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/left.png", sizingMethod='scale'); - height: expression((this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight) + "px"); -} - -* html .i-shadow .center { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/center.png", sizingMethod='scale'); - height: expression(this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight); - width: expression((this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth) + "px"); -} - -* html .i-shadow .right { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/right.png", sizingMethod='scale'); - height: expression((this.parentNode.offsetHeight - this.parentNode.firstChild.offsetHeight - this.parentNode.childNodes[6].offsetHeight) + "px"); -} - -* html .i-shadow .bottom-left { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-left.png", sizingMethod='crop'); -} +/* For IE6 (no transparent png's, we use a blur filter) */ -* html .i-shadow .bottom { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom.png", sizingMethod='scale'); - width: expression((this.parentNode.offsetWidth - this.previousSibling.offsetWidth - this.nextSibling.offsetWidth) + "px"); +* html .i-shadow * { + display: none; } -* html .i-shadow .bottom-right { - background: transparent; - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); - filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/shadow/img/bottom-right.png", sizingMethod='crop'); -} +* html .i-shadow { + background: #000; + filter: progid:DXImageTransform.Microsoft.Blur(pixelRadius=2) alpha(opacity=20); + margin-top: -3px; + margin-left: -4px; +} /*-------------------------- Default (horizontal) styles --------------------------*/ @@ -2255,45 +2195,39 @@ input.i-modified, color: #464f52; font-size: 13px; line-height: 18px; - background: transparent url(window/img/top-left.png) no-repeat top left; -} - -.i-window:before { - display: block; - content: ""; - background: transparent url(window/img/top-right.png) repeat-x right top; - height: 21px; - margin-left: 21px; + background: transparent url(window/img/bottom-left.png) no-repeat left bottom; } .i-window-wrap { - padding-left: 20px; - background: transparent url(window/img/left-bg.png) repeat-y; - /* somehow this won't inherit from .i-window */ + background: transparent url(window/img/top-left.png) no-repeat; + /* Somehow this won't inherit from .i-window */ font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif; + zoom: 1; /* For IE, otherwise it won't render properly (width will be out of control) */ } .i-window-wrap2 { - padding-right: 20px; - background: transparent url(window/img/right-bg.png) repeat-y top right; + zoom: 1; /* For IE, otherwise it won't render properly (width will be out of control) */ } .i-window-outerheader { - height: 18px; - padding: 8px 34px 14px 12px; - background: #fff; + height: 22px; + margin-left: 9px; + padding: 15px 34px 11px 12px; + background: transparent url(window/img/top-right.png) no-repeat right top; + cursor: move; } .i-window-header { font-size: 18px; - line-height: 18px; + line-height: 1.2; font-weight: normal; letter-spacing: -0.03em; color: #f14c1a; white-space: nowrap; - cursor: move; - text-overflow:ellipsis; - overflow:hidden; + text-overflow: ellipsis; + overflow: hidden; + width: 100%; + text-shadow: 0 1px 0 #fff; } .i-window-header .i-icon { @@ -2302,9 +2236,9 @@ input.i-modified, .i-window-contents { background: #fff; - border: 1px solid #babfc0; - font-size: 13px; - line-height: 18px; + border: 2px solid #acb2b3; + border-top-width: 1px; + border-bottom: none; } /* Partial fix for bug #1106 */ @@ -2312,43 +2246,26 @@ input.i-modified, .i-window-contents, x:-moz-any-link { overflow: hidden; } -/* Target Firefox 3 (it doesn't need any trickery) */ +/* Target Firefox 3 (it doesn't need any trickery, so revert the previous) */ .i-window-contents, x:-moz-any-link, x:default { overflow: visible; } .i-window-footer { - height: 0; - font-size: 0px; - /* Occupy more height to prevent scrollbars in Mac FF */ - margin-bottom: 46px; -} - -.i-window-footer:before { - display: block; - content: ""; - width: 21px; - height: 46px; - background: transparent url(window/img/bottom-left.png); - margin-left: -20px; -} - -.i-window-footer:after { - display: block; - content: ""; - height: 46px; - background: transparent url(window/img/bottom-right.png) no-repeat top right; - margin: -46px -20px 0 1px; + height: 8px; + margin-left: 9px; + background: transparent url(window/img/bottom-right.png) no-repeat right top; } .i-window-resizebox { - position:absolute; - bottom: 24px; - right: 0; - width: 25px; - height: 21px; + position: absolute; + bottom: 4px; + right: 4px; + width: 10px; + height: 10px; cursor: se-resize; background: transparent url(window/img/resize.png); + overflow: hidden; } .i-window-resizebox-disabled { @@ -2357,27 +2274,27 @@ input.i-modified, } .i-window-closebox { - position:absolute; - top: 33px; - right: 36px; + position: absolute; + top: 21px; + right: 24px; width: 12px; - height: 11px; + height: 12px; background: transparent url(window/img/close.png); cursor: pointer; overflow: hidden; } .i-window-closebox:hover { - background-position: 0 -11px; + background-position: 0 -12px; } .i-window-modalitycurtain { - top:0; - left:0; - background:white; + top: 0; + left: 0; + background: white; opacity: 0.5; - position:fixed; - width:100%; - height:100%; + position: fixed; + width: 100%; + height: 100%; filter: alpha(opacity=50); } @@ -2390,51 +2307,107 @@ input.i-modified, /* IE specific styles */ * html .i-window { - width: 0; + width: 0; /* min-size for IE6 */ + overflow: hidden; + zoom: 1; } -* html .i-window-wrap { - padding: 12px; - border: 1px solid #e8e9e9; - background: #d8dee0; - /*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/widgetsets/com.itmill.toolkit.terminal.gwt.DefaultWidgetSet/default/window/img/bg-color.png", sizingMethod="scale");*/ - /*zoom: 1; to gain hasLayout, IE won't apply filter otherwise */ + + + + + + + + + + + + + + +/* Shadow for window */ + +.i-shadow-window { + position: absolute; } -*+html .i-window-wrap { - padding: 12px; - border: 1px solid #e8e9e9; - background: transparent url(window/img/bg-color.png) repeat; + +.i-shadow-window .top-left { + position: absolute; overflow: hidden; + top: -13px; left: -20px; + width: 39px; height: 39px; + background: transparent url(window/img/shadow/top-left.png); } -* html .i-window-wrap2 { - padding: 6px; - border: 1px solid #babfc0; - background: #fff; +.i-shadow-window .top { + position: absolute; overflow: hidden; + top: -13px; left: 19px; + height: 39px; + right: 19px; + background: transparent url(window/img/shadow/top.png); } -*+html .i-window-wrap2 { - padding: 6px; - border: 1px solid #babfc0; - background: #fff; + +.i-shadow-window .top-right { + position: absolute; overflow: hidden; + top: -13px; right: -20px; + width: 39px; height: 39px; + background: transparent url(window/img/shadow/top-right.png); } -* html .i-window-footer { - margin-bottom: 0; +.i-shadow-window .left { + position: absolute; overflow: hidden; + top: 26px; left: -20px; + width: 39px; + bottom: 12px; + background: transparent url(window/img/shadow/left.png); } -*+html .i-window-footer { - margin-bottom: 0; + +.i-shadow-window .center { + position: absolute; overflow: hidden; + top: 26px; left: 19px; + bottom: 12px; right: 19px; + background: transparent url(window/img/shadow/center.png); } -* html .i-window-resizebox { - bottom: 1px; - right: 1px; - width: 15px; - height: 12px; - background: url(window/img/resize.png); +.i-shadow-window .right { + position: absolute; overflow: hidden; + top: 26px; right: -20px; + width: 39px; + bottom: 12px; + background: transparent url(window/img/shadow/right.png); } -* html .i-window-resizebox-disabled { - background: transparent; + +.i-shadow-window .bottom-left { + position: absolute; overflow: hidden; + bottom: -27px; left: -20px; + width: 39px; height: 39px; + background: transparent url(window/img/shadow/bottom-left.png); } -*+html .i-window-resizebox { - bottom: 0; - background-position: 3px 3px; + +.i-shadow-window .bottom { + position: absolute; overflow: hidden; + bottom: -27px; left: 19px; + right: 19px; height: 39px; + background: transparent url(window/img/shadow/bottom.png); +} + +.i-shadow-window .bottom-right { + position: absolute; overflow: hidden; + bottom: -27px; right: -20px; + width: 39px; height: 39px; + background: transparent url(window/img/shadow/bottom-right.png); +} + + +/* For IE6 (no transparent png's, we use a blur filter) */ + +* html .i-shadow-window * { + display: none; +} + +* html .i-shadow-window { + background: #000; + filter: progid:DXImageTransform.Microsoft.Blur(pixelRadius=6) alpha(opacity=20); + margin-top: -4px; + margin-left: -6px; } diff --git a/WebContent/ITMILL/themes/default/window/img/bottom-left.png b/WebContent/ITMILL/themes/default/window/img/bottom-left.png index 14808c98eac0d281278445109b23b6c0a7b4a684..e7728b51721c3029f414662dff0d532fdd85ac10 100644 GIT binary patch delta 216 zcmV;}04M+R2lW9ViBL{Q4GJ0x0000DNk~Le00009000082nGNE04vSawUIF=e*l+B zL_t(|+G1R@Y4dyr28IL~NeKoK5fKJ#fCY$mfE0cD{Dr~H*qDKlkr6`?6A-Ti;v=8F zd||lz;67H9n4t6&5OMk1b%qzOUg1;(GHvd^fBzYdo;<~H@#yu!oUdhE*-k*Wz@+$TtOw>5(BPe*=X{L_t(|+N_n&Pt#x+$KSVW*LGdEmHlF%L|{e|1|Bq#tICBK zJ$T_@IQcgiiG=WHc<_vgi3Z}qi{3HD1O5mxL;?sFnCu6v-AdQ>wO!iz+O%6Yc#?W`}}$b-@X5^JekYgmTStHqN*zJVaNHS;i;Q9s1VD#f1VSDf0L_KnG1y&;M0OM zEfJQk2R^V&eB7o3aVlb^YI&4V7eBjz%Ip z02RqEm|Q8FA&0R%4^1>NHqF~;kcc>gTvD2 z^)F{ls8QElV**|u7YfCM5Q~8xj3g=5gvXPqU0W$I=6>}kpDz#u5nyOK2+m#V0qFS$OQ9jI_ zTd7rs^_rr*__enuvJAr}`vl?KP}82x&%ey)^UE6>8$T6AQTvmLL?A#AzQ@eI6vij7 zL+nH5dth;CX_{e}2csh+chad;ys9X*Q%RP3fkF#xI{9dBZXlb@&JGR^%w8V6lr}y> z<%^|be`76Cx6r0i%gt2|K6(1|VIm%XJTx?vN+y#r!dRucrm0f3RyCTc`h^l0)Vyoy znVFd@;}aA2GMUW%Xf(?49LI*kVV0(8(p=Yuu4_h#s-2(&1~s>gHvQJr)bQBYSWXax zYg{;-HNY9;GGdLLp?RKXaHtIg4yCOU*iiF=f5P5_Bcr2<@m%g|e>y!H6NKS*Q0M}s zT)-4|){G@POb5bT$DXD)4A-oTG%OyFK4uv?V7djdv#4VkHsi@QAg5A!9rV-dhLv#c6QVSf@&{9nLROnQzV=Ia<#o#}=X*vd65uE9s%2(lcmY`wU|=A7-51BcWL_VfQsPTP@nE0KSi=2u3bi6Fq5 zb=xfNzL|4npscT&852a%q43wf{?Jv&zdgI)1rcG;xad9iQSo-^Q}vbSt}x0%L>nIE z%u-_hbco=LqT5cCO{-v26 Oq`}kG&t;ucLK6TUX>tSr literal 1626 zcmYjReLT~79RCTU2}x1Pa7X0vdR?)rUBk;_Vajt}i*{{B4p>b#nHfM6U@kW-R`x9MLdN*Q0%f@@> zR1rn@McX%RmQ%{aQ^Z||l5S5XtEB1MWa%NcGs3R5{H|o)V-{u8OSBe|br8RrUDAd< zK;AszVEBGnS*sJ>nfG#NU6hb*kg2l4>GM?y4CkXFd4jxIdz!dDMbC*o%( zTUz+xt!kT5e-{nHq3Tsk^o3EeRhn}Xhd>z^+i_oc^Ka$$7R^E7E_Zemrr2KSFyxUN zZhueUn4~37t_!dRwKii8XSeSwm}rQl9jtI<9dMLk8;e@XM_5C{U~n4sed8GRdE}!p zp%Ljw{(M*B$82e8rp_iz(q9JKK zZH5A-DB93AElbW>x-S^yR2mhYu!gau8Wi9t@wPc5aOgvoQ%UP3tWTWwEt?s4EHJwv zp;gQ)7+kU5^@V_ZSMNvtG-gn_{qa6HM6fb%MJMyZls1E*Ubgfz^^1{-()&Xf*T?nY zaS5bP)`CD;aj4fk6K$W5vZETo28H5SBiAkku{^5_`gUjwz1z!sGg_W9DuTH;3pBdr zxDLV0sFjx|%KgWz^x$=(i5ylYOINv0qBSmkiE`kF7{(l+5Fl^q$pj z9T`OBRK;U@xlP8!OA*2=_1v+>Xz_cN`GC5-L|~x1`}87JEEfBhafY~DZW(8WmAH`M zFj`pauV|QaeO-N3P#Zs|V`6^&&C(K{OIXe(jgnWp*nPEvW=X8l5t&vEvwT!Za8O9Y zTfr4d6L+|g!3b!qWiqb{NWy0U+d@^(}urL*(KR{|vryQaafGE4dn_*qf&S10D*2r@Dv7>rs7 zh%!=R1oBE*klbKI7=e6-nI+^!-T--8ZV$Jt@w44Vp1jL216MY0E*?f{ULedJa-)nQ zF0}IQ0&7dJ>5wz2G|#w9y-kWqse1yb%jbAd`_{5fe#H1XRyJ9HTh_xrVBl`b{#o-8 zhPKzpckxwQ6|#J<9kX#UdNDcvi)f#sBgma;|E;}S@t+mh&-Ua_-ZefWZ>!@DgvnLd zA-Gn7c8^y%jG{1wTTx8eQaF1BD`qCj-Bx*Lzw+W~li0?2w5p=n=HNE-ltoE(xL^c- zeVPY66Qbp9%8j|b6r=hPySn5fO@QdgVeYu}ZCO0c;s5;AmlWNWnp#20^=XAOvMj)_ zXg`#~q)vj7*5~H;WC|U#JU~-@rCoTx0xwODVunml!K@3T4N2$C>H$O92AbYVo|lMW z9RBxPz(sIjZrvGIbM8GPy!PZ_W=vZygG=;exbsiXcErq#|1#<`HZ!rc!P z6X{kJ{^ttP+SB{;Njhqf}EnI+q<*s%f;pB=%cEu}?MCiu8+lO=9zPH|9LG0$`_ww&~H$-qnT)<%uoWU(_wi3S$9N>tE=7>bhL83HP8J7|a+XjU-=2}RNEp(4wM4MJ? zLv-wd^{f+xAyNIQZMhQ}PPt!OU#0(RTQ5`=YnAMUC1`S|(O%<`s``~3X; z{r&Knh4Q45P_Vw7?-1*nf?(gsDWkrw!6Il|Nr?{NofFo005dvL_t(|+FVZ64#PkUOPQIuJ@Eg3;&Q5{cJoW*BnCp( z6ByKIpvuzn0xqeoiV~@H5XXVmG9g?JPu@5e_}}w2!}nkaIzu|(|MJ%SxMfdHMyQXw z!BMkjZbw7Lb_VT@5+`s9)$Fthr9#^dl@c4_bb0c|JxypDDMpks-gPEJrn}Dj^41KG p+d#|u%~=;hUKXZ7QResvFaQHR9TS44T|oc<002ovPDHLkV1f$Zz<&S$ diff --git a/WebContent/ITMILL/themes/default/window/img/resize.png b/WebContent/ITMILL/themes/default/window/img/resize.png index 8c4c00a11c133ee5994302407fa89c5686f6ec06..e04087e5253819fd68628557616e76ab09569d1d 100644 GIT binary patch delta 179 zcmV;k08Iaj0?`2>iBL{Q4GJ0x0000DNk~Le0000A0000A2m=5B0J`iykC8Dbe=1N+ zR7Lvx`^C%7?(p%rzr(P(yxrmA`~3XK&e5W*u)4v;=jrRYz{LIi{r~^}qPoLM0000z zNkl?k&PDHLkV1i4ZR0041 delta 237 zcmcb}*v(|v8Q|y6%O%Cdz`(%k>ERLtq$Pn^l!FaOZq{~{08%XJj=qiz4C_yrvv$3l zsHjmt*VDx@q~cc6pa1{unb$H3Gs`l>>Leaidog*Ed(Y#Zh957dSx%mJ`H;E+x5EQf z-6rmvO~np>`fp8}kjkhzt>KC!v!U`8CPsy8OO~mEl;~Vx5>9&DEa6=cS-{qDUr<`e zM$QQ|ue&@`z6*oK;{yF!k_AF+7 jvO;z7GyxU{MmB~oYt_QGP34{pbUK5ltDnm{r-UW|t=v*h diff --git a/WebContent/ITMILL/themes/default/window/img/shadow/bottom-left.png b/WebContent/ITMILL/themes/default/window/img/shadow/bottom-left.png new file mode 100644 index 0000000000000000000000000000000000000000..1ffd763fafac605f06ccdfe69a15975d80163e9e GIT binary patch literal 683 zcmV;c0#yBpP)(%=PY{a~gTs?y<6Pc7L4P;^LkXULTGR=o`-bqrVrFm zow7lz#?EH-z#`K|igqeXs$f^SNI}N;B&ihcd|9~l18hLS48$0&lG+tAVzY|Mi=g@W5?BP+S+F``EI~1Fs~dGcFCXM|pe_aK!u=QM<#3mQL~t+JXr+A$FaWq_ VN~R3z$IAc!002ovPDHLkV1h9B_r3rC literal 0 HcmV?d00001 diff --git a/WebContent/ITMILL/themes/default/window/img/shadow/bottom.png b/WebContent/ITMILL/themes/default/window/img/shadow/bottom.png new file mode 100644 index 0000000000000000000000000000000000000000..ed24b667051b7b1c7e47d850f41549f06c84448b GIT binary patch literal 150 zcmeAS@N?(olHy`uVBq!ia0vp^j6kf;!3HGHJy2Q%q$EpRBT9nv(@M${i&7aJQ}UBi z6+Ckj(^G>|6H_V+Po~-c67^gCvUfsRuCQypO)78&qol`;+ E04i1-W&i*H literal 0 HcmV?d00001 diff --git a/WebContent/ITMILL/themes/default/window/img/shadow/left.png b/WebContent/ITMILL/themes/default/window/img/shadow/left.png new file mode 100644 index 0000000000000000000000000000000000000000..4c0b430f22e7ced4393260828653ecc4a24da890 GIT binary patch literal 144 zcmeAS@N?(olHy`uVBq!ia0vp^>OjoM!3HE_!?w!-DajJoh?3y^w370~qErUQl>DSr z1<%~X^wgl##FWaylc_d9MMj=3jv*Ddl0pK4l2RHN+%(dh7A4M*>~hQz)0oZ5yIJYt pnv9||5eC9iZ8tf~xg8o98Di8J&b-?mF%_tr!PC{xWt~$(697eqDUARC literal 0 HcmV?d00001 diff --git a/WebContent/ITMILL/themes/default/window/img/shadow/right.png b/WebContent/ITMILL/themes/default/window/img/shadow/right.png new file mode 100644 index 0000000000000000000000000000000000000000..f81cfa0ce4dbec90ffe29ba092f4a3569b864bbc GIT binary patch literal 146 zcmeAS@N?(olHy`uVBq!ia0vp^>OjoM!3HE_!?w!-DajJoh?3y^w370~qErUQl>DSr z1<%~X^wgl##FWaylc_d9MJApujv*Ddl0pK4ypj_Ve()bv_`rYaUwhmCq=WSnKICis sYj#mio>7&udBWNM{VvUSnFJCTKE75-->;RK3)Iix>FVdQ&MBb@0M%eIr2qf` literal 0 HcmV?d00001 diff --git a/WebContent/ITMILL/themes/default/window/img/shadow/top-left.png b/WebContent/ITMILL/themes/default/window/img/shadow/top-left.png new file mode 100644 index 0000000000000000000000000000000000000000..7f793893988356a2cfec7932e8cba912d71b144f GIT binary patch literal 510 zcmVPs6ejL&SkSANU#y)?5gMDIxR{knbSvbQ}8`nTcfG~l91;@r6~qS$*fs@ zg>X*dgR8vvH7>N zb-FE<`_$k`eNItIS$ryqwxyi1(PE7gM9oV+X9csX0TaQ?d5(4G9rcv)(n?tETUi?j z26Vi}l|5UrOH;>AFOS9+n2{|pr4d(NU_1pF0Mc{?efo-by8r+H07*qoM6N<$f^=Eh AL;wH) literal 0 HcmV?d00001 diff --git a/WebContent/ITMILL/themes/default/window/img/shadow/top-right.png b/WebContent/ITMILL/themes/default/window/img/shadow/top-right.png new file mode 100644 index 0000000000000000000000000000000000000000..feb490d565dde0d7e4218d222cadb0c33f9c4707 GIT binary patch literal 654 zcmV;90&)F`P)3ui6Xcc(4(GOLr>s%2kS)v(Cf$Ed#XORmxH>%a{k8uti`3EoP|{si;}2 zVYWt42={ERqETr{`d!(CGsRG;_5Rsd*+lkQx0NtEeQvyB5mZ!E1A3x1RyQRaLMcEg zfwBN*5Q{I_8dV$SObake)_7XXx4-*-`tk=uFfE`CXuuk5gDmZ-l3qE#+OPmDyDjt= zHHdn?fZB`A1HhChz@Ux*j;W`Kaw%MNFJMJ4vtYSY0ajpdO?U+MOfqj~P&3F_)*H3D zWklsHnb4&uoV97g(yg0nECy?UO=967RW1aO7RU+JH4-?ShN7Hh8H;Q!t5u;8yedMb zp-x5aSQ}!!P_6$#V9#nR~cAzp_h2&2wxIuCeDJV^t4q!_;AqSR?aLbi; ok>zj@ur6ekE!IL>7w{v%08fRU8&xNCNB{r;07*qoM6N<$f~Lw7^#A|> literal 0 HcmV?d00001 diff --git a/WebContent/ITMILL/themes/default/window/img/shadow/top.png b/WebContent/ITMILL/themes/default/window/img/shadow/top.png new file mode 100644 index 0000000000000000000000000000000000000000..10bcc450eefe0dfd18ebc8cb442b7d293d0b75e0 GIT binary patch literal 148 zcmeAS@N?(olHy`uVBq!ia0vp^j6kf;!3HGHJy2Q%q$EpRBT9nv(@M${i&7aJQ}UBi z6+Ckj(^G>|6H_V+Po~-c6`6UuIEGZ*N(u-FN=iv$U=ldUp*|xZlA}q|uVJT7fgZP5 tljzi=U9OzQdQF_%jRgXeiW!-B82WxNif3?mw*yUJ@O1TaS?83{1OVqiC_(@L literal 0 HcmV?d00001 diff --git a/WebContent/ITMILL/themes/default/window/img/top-left.png b/WebContent/ITMILL/themes/default/window/img/top-left.png index 0a46a98d4d3417378b2b9a2a9b0432fa327dca91..fb0744b5ea611f0e342db679053431c495e82809 100644 GIT binary patch delta 253 zcmVDQ#t@C@&Ga9WMnW*KvrY}Vz9BZ;R-LXA|(*xKNf3{ z6|oYdh#(kMG^%J+(Ws(PMW_`JGZPcAwqV4n2q3@!IG-lqp)p1800000NkvXXu0mjf Dhx}lu delta 600 zcmV-e0;m0&0`degiBL{Q4GJ0x0000DNk~Le0000L0000L2nGNE0I3(HmH+?%1ZP1_ zK>z@+$TtOw>5(BPe*y$aL_t(|+N71sPTN2fhHZChu*dh1#+Nv$p-8BZz@|@7b)7C+ z1gcoKQWt%Zinrhyx@o060OB=(7N;b>Ux<4K$tVaJ?DUsL$CmAH&TWqAq9`b$?cwgN z9goLUQ=OijX<&x124o>>2?4|cvs*$~mhDTThy_95F$gt;e|5pU=T=t_B}o!)Av})( z%97_d^Z7goqX;zseqC9Vv7uA4uz#IbSsB4-A@#@l@ zOu(t4>KpU~@GY1Tc=zr_yWI}sIClSBxlcKQ9sz#idH&#KuV;eAzbBKwH;}YCsX`UN zPnxP8tvgOXe+SZe4euU>0&ou@^u_LWEeJQ6dVbKf<(S2r@5jevlabT!8_z+@03Sd> zpAB9AAj`7SG~`9m$t<7uC_v0iEAK+b~z)Ksv z+=r9Wy0~(e3Omm;HVi^JOB1fF{u@P>MRHN5qpsk6f7+YP))=Z#ZNs2cMZRmPAsG&F znl=hMjv^rnL)qxG@hiunU^d+A(*c<_Q@?%-k#N1)wYj&mLqXc^7Yg!e!6?(A;ZX`> zr!F)M0%dc3;{mX&{!o-8+$8KQ%T}Jzv|?LkWlIf2jCnE}>q4V2kSr()%+zWq`2~<+ mTNj!p9tmz~YUT5P0t^8Bs?bZ?Hc%b_0000b`tlJHPv9&aasKueUbvL4*&4 zz22o4wz~Ary}L(0Jxsh~H~0K9`Qxr%fB%ehV23D4SREQF`qiLRw%_0XF-Q1p`*8M-<8$pXDxv$=`yY1 z{=2>t<^hL|X8)Og?SpX{Y+)W|aDsWDK?P>31KiCMSYYOHz%@*Q8=?r;Aanuh5e2vg z54h7>;2J#Pb_u{WaKgez0Iop=Zr6}=Tz>lUOdD2M99${AyZ^O46A#0rWg*vto-P&x ONqD;YxvXzf@DD#QL@ z=i}UGy2d9{f@Yia)^<({$eF14$dCK&u~2hX@uQ`&9C@tU^}NgK+VofomoE7Fl$nQl z?UW{wu4TD7mwjfP`JH0*cy7id&iv&=zx(WHFK&qH0~(&{lRInd?2V%}&hQzBUrUdEoy z;w#?2x#IQo)76Y$ucsz`e77OJ?Qh2=CWsybuUBW&vM&a)0=kcseV}3QT=vHJv)qGHuzQTjjOMHd@;@Z)f|hmH!rfgyQeRHc^>GZo#JnW7cfH| zGHu)Ht-lU?rM|w}%+5bADsJBdzvcG&Q%}$TbG?eu3Tk!o>ywk?@(ZMEl_q)s)zsCh z&Huk4L@)l=_N`1MP&LQyxuw1?TzoZ4U(RxqK-)w2rA0s2KEKX!0UD?`#M$PT*b7+J zeR)x1vZo-m)U@W?UItl+?uOdr50>9ou3Y)@=gyto7e9R3{GR0n)ZjPT(biXAJ^cA| zXNXqm%TupjeO&$-ZtJ(HVY~0X{QCRvPUm*6iysbM{`p|{{JMAA{7}t{Rd^0xYwUC} zp6i+4{;=`f>39513TEcf8h7@TzP_He`RBpk&(E)IeSW_>JQWuEnpdNAcYdv~uFS8s zz2D6meKY1=pa6?=yu$nM|D&vIO{eCX&CYkfyR~4#DrhJk&^Vd8xjMJ-VZobkbFF`V zWtSFSSyE*^)9Y%R?c%F1OVrfWF9&}2xw7vQKP6MyY$lMitXO=X+^NOe8pvKywTiG=cv@zUtcy + * .i-shadow[-stylename] + * ---------------------------------------------- + * | .top-left | .top | .top-right | + * |---------------|-----------|----------------| + * | | | | + * | .left | .center | .right | + * | | | | + * |---------------|-----------|----------------| + * | .bottom-left | .bottom | .bottom-right | + * ---------------------------------------------- + * + * + * See default theme 'shadow.css' for implementation example. + */ + private static final String SHADOW_HTML = "
"; public IToolkitOverlay() { super(); @@ -42,20 +76,54 @@ public class IToolkitOverlay extends PopupPanel { public IToolkitOverlay(boolean autoHide, boolean modal, boolean showShadow) { super(autoHide, modal); if (showShadow) { - shadow = new Shadow(); + shadow = DOM.createDiv(); + shadow.setClassName(CLASSNAME_SHADOW); + shadow.setInnerHTML(SHADOW_HTML); + DOM.setStyleAttribute(shadow, "position", "absolute"); + + addPopupListener(new PopupListener() { + public void onPopupClosed(PopupPanel sender, boolean autoClosed) { + DOM.removeChild(RootPanel.get().getElement(), shadow); + } + }); } adjustZIndex(); } private void adjustZIndex() { - DOM.setStyleAttribute(getElement(), "zIndex", "" + Z_INDEX); + setZIndex(Z_INDEX); + } + + /** + * Set the z-index (visual stack position) for this overlay. + * + * @param zIndex + * The new z-index + */ + protected void setZIndex(int zIndex) { + DOM.setStyleAttribute(getElement(), "zIndex", "" + zIndex); + if (shadow != null) { + DOM.setStyleAttribute(shadow, "zIndex", "" + zIndex); + } + if (BrowserInfo.get().isIE6()) { + adjustIE6Frame(getElement(), zIndex - 1); + } + } + + /** + * Get the z-index (visual stack position) of this overlay. + * + * @return The z-index for this overlay. + */ + private int getZIndex() { + return Integer.parseInt(DOM.getStyleAttribute(getElement(), "zIndex")); } @Override public void setPopupPosition(int left, int top) { super.setPopupPosition(left, top); if (shadow != null) { - shadow.updateSizeAndPosition(isAnimationEnabled() ? 0 : 1); + updateShadowSizeAndPosition(isAnimationEnabled() ? 0 : 1); } } @@ -63,127 +131,142 @@ public class IToolkitOverlay extends PopupPanel { public void show() { super.show(); if (shadow != null) { - DOM.appendChild(RootPanel.get().getElement(), shadow.getElement()); + DOM + .insertBefore(RootPanel.get().getElement(), shadow, + getElement()); if (isAnimationEnabled()) { ShadowAnimation sa = new ShadowAnimation(); sa.run(200); } else { - shadow.updateSizeAndPosition(1.0); + updateShadowSizeAndPosition(1.0); } } if (BrowserInfo.get().isIE6()) { - adjustIE6Frame(getElement(), Z_INDEX - 1); + adjustIE6Frame(getElement(), getZIndex()); } } + /* + * Needed to position overlays on top of native SELECT elements in IE6. See + * bug #2004 + */ private native void adjustIE6Frame(Element popup, int zindex) /*-{ // relies on PopupImplIE6 - popup.__frame.style.zIndex = zindex; + if(popup.__frame) + popup.__frame.style.zIndex = zindex; }-*/; - public void setShadowOffset(int top, int right, int bottom, int left) { + @Override + public void setWidth(String width) { + super.setWidth(width); if (shadow != null) { - shadow.setOffset(top, right, bottom, left); + updateShadowSizeAndPosition(1.0); } } - private class Shadow extends HTML { - - private static final String CLASSNAME = "i-shadow"; - - private static final String HTML = "
"; + @Override + public void setHeight(String height) { + super.setHeight(height); + if (shadow != null) { + updateShadowSizeAndPosition(1.0); + } + } - // Amount of shadow on each side. - private int top = 2; - private int right = 5; - private int bottom = 6; - private int left = 5; + /** + * Sets the shadow style for this overlay. Will override any previous style + * for the shadow. The default style name is defined by CLASSNAME_SHADOW. + * The given style will be prefixed with CLASSNAME_SHADOW. + * + * @param style + * The new style name for the shadow element. Will be prefixed by + * CLASSNAME_SHADOW, e.g. style=='foobar' -> actual style + * name=='i-shadow-foobar'. + */ + protected void setShadowStyle(String style) { + if (shadow != null) { + shadow.setClassName(CLASSNAME_SHADOW + "-" + style); + } + } - public Shadow() { - super(HTML); - setStyleName(CLASSNAME); - DOM.setStyleAttribute(getElement(), "position", "absolute"); + /* + * Extending classes should always call this method after they change the + * size of overlay without using normal 'setWidth(String)' and + * 'setHeight(String)' methods. + */ + protected void updateShadowSizeAndPosition() { + updateShadowSizeAndPosition(1.0); + } - addPopupListener(new PopupListener() { - public void onPopupClosed(PopupPanel sender, boolean autoClosed) { - DOM.removeChild(RootPanel.get().getElement(), shadow - .getElement()); - } - }); + /** + * Recalculates proper position and dimensions for the shadow element. Can + * be used to animate the shadow, using the 'progress' parameter (used to + * animate the shadow in sync with GWT PopupPanel's default animation + * 'PopupPanel.AnimationType.CENTER'). + * + * @param progress + * A value between 0.0 and 1.0, indicating the progress of the + * animation (0=start, 1=end). + */ + private void updateShadowSizeAndPosition(double progress) { + // Don't do anything if overlay element is not attached + if (!isAttached()) { + return; } - public void updateSizeAndPosition(double phase) { - // Calculate proper z-index - String zIndex = null; - if (IToolkitOverlay.this.isAttached()) { - // Odd behaviour with Windows Hosted Mode forces us to use a - // redundant try/catch block (See dev.itmill.com #2011) - try { - zIndex = DOM.getStyleAttribute(IToolkitOverlay.this - .getElement(), "zIndex"); - } catch (Exception ignore) { - // Ignored, will cause no harm, other than a little - // eye-candy missing - } - } - if (zIndex == null) { - zIndex = "" + Z_INDEX; - } + // Calculate proper z-index + String zIndex = null; + try { + // Odd behaviour with Windows Hosted Mode forces us to use this + // redundant try/catch block (See dev.itmill.com #2011) + zIndex = DOM.getStyleAttribute(getElement(), "zIndex"); + } catch (Exception ignore) { + // Ignored, will cause no harm, other than a little eye-candy + // missing + } + if (zIndex == null) { + zIndex = "" + Z_INDEX; + } + // Calculate position and size + if (BrowserInfo.get().isIE()) { + // Shake IE + getOffsetHeight(); + getOffsetWidth(); + } - // Calculate position and size - if (BrowserInfo.get().isIE()) { - // Shake IE - IToolkitOverlay.this.getOffsetHeight(); - IToolkitOverlay.this.getOffsetWidth(); - } - int x = IToolkitOverlay.this.getAbsoluteLeft() - left; - int y = IToolkitOverlay.this.getAbsoluteTop() - top; - int width = IToolkitOverlay.this.getOffsetWidth() + left + right; - int height = IToolkitOverlay.this.getOffsetHeight() + top + bottom; - if (width < 0) { - width = 0; - } - if (height < 0) { - height = 0; - } + int x = getAbsoluteLeft(); + int y = getAbsoluteTop(); + int width = getOffsetWidth(); + int height = getOffsetHeight(); - // Animate the shadow size - x += (int) (width * (1.0 - phase) / 2.0); - y += (int) (height * (1.0 - phase) / 2.0); - width = (int) (width * phase); - height = (int) (height * phase); - - // Update correct values - DOM.setStyleAttribute(getElement(), "display", phase < 0.9 ? "none" - : ""); - DOM.setStyleAttribute(shadow.getElement(), "zIndex", "" - + (Integer.parseInt(zIndex) - 1)); - DOM.setStyleAttribute(getElement(), "width", width + "px"); - DOM.setStyleAttribute(getElement(), "height", height + "px"); - DOM.setStyleAttribute(getElement(), "top", y + "px"); - DOM.setStyleAttribute(getElement(), "left", x + "px"); - } - - public void setOffset(int top, int right, int bottom, int left) { - this.top = top; - this.right = right; - this.bottom = bottom; - this.left = left; - if (IToolkitOverlay.this.isAttached()) { - updateSizeAndPosition(1.0); - } + if (width < 0) { + width = 0; + } + if (height < 0) { + height = 0; } - } + // Animate the shadow size + x += (int) (width * (1.0 - progress) / 2.0); + y += (int) (height * (1.0 - progress) / 2.0); + width = (int) (width * progress); + height = (int) (height * progress); - class ShadowAnimation extends Animation { + // Update correct values + DOM.setStyleAttribute(shadow, "display", progress < 0.9 ? "none" : ""); + DOM.setStyleAttribute(shadow, "zIndex", zIndex); + DOM.setStyleAttribute(shadow, "width", width + "px"); + DOM.setStyleAttribute(shadow, "height", height + "px"); + DOM.setStyleAttribute(shadow, "top", y + "px"); + DOM.setStyleAttribute(shadow, "left", x + "px"); + } + protected class ShadowAnimation extends Animation { + @Override protected void onUpdate(double progress) { if (shadow != null) { - shadow.updateSizeAndPosition(progress); + updateShadowSizeAndPosition(progress); } } - } } diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/IWindow.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/IWindow.java index 5aca69c3a8..8de7a9e366 100644 --- a/src/com/itmill/toolkit/terminal/gwt/client/ui/IWindow.java +++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/IWindow.java @@ -14,7 +14,6 @@ import com.google.gwt.user.client.Element; import com.google.gwt.user.client.Event; import com.google.gwt.user.client.Window; import com.google.gwt.user.client.ui.Frame; -import com.google.gwt.user.client.ui.PopupPanel; import com.google.gwt.user.client.ui.RootPanel; import com.google.gwt.user.client.ui.ScrollListener; import com.google.gwt.user.client.ui.ScrollPanel; @@ -28,17 +27,18 @@ import com.itmill.toolkit.terminal.gwt.client.Util; /** * "Sub window" component. * - * TODO update position / scrollposition / size to client + * TODO update position / scroll position / size to client * * @author IT Mill Ltd */ -public class IWindow extends PopupPanel implements Paintable, ScrollListener { +public class IWindow extends IToolkitOverlay implements Paintable, + ScrollListener { private static final int MIN_HEIGHT = 60; private static final int MIN_WIDTH = 80; - private static Vector windowOrder = new Vector(); + private static Vector windowOrder = new Vector(); public static final String CLASSNAME = "i-window"; @@ -50,7 +50,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { private static final int STACKING_OFFSET_PIXELS = 15; - private static final int Z_INDEX_BASE = 10000; + public static final int Z_INDEX = 10000; private Paintable layout; @@ -106,7 +106,10 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { private boolean readonly; public IWindow() { - super(); + super(false, false, true); // no autohide, not modal, shadow + // Different style of shadow for windows + setShadowStyle("window"); + final int order = windowOrder.size(); setWindowOrder(order); windowOrder.add(this); @@ -122,7 +125,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { windowOrder.remove(this); windowOrder.add(this); for (; curIndex < windowOrder.size(); curIndex++) { - ((IWindow) windowOrder.get(curIndex)).setWindowOrder(curIndex); + windowOrder.get(curIndex).setWindowOrder(curIndex); } } } @@ -137,11 +140,15 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { } public void setWindowOrder(int order) { - int zIndex = (order + Z_INDEX_BASE); + setZIndex(order + Z_INDEX); + } + + @Override + protected void setZIndex(int zIndex) { + super.setZIndex(zIndex); if (modal) { DOM.setStyleAttribute(modalityCurtain, "zIndex", "" + zIndex); } - DOM.setStyleAttribute(getElement(), "zIndex", "" + zIndex); } protected void constructDOM() { @@ -272,7 +279,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { "offsetHeight") - DOM.getElementPropertyInt(contents, "offsetHeight")); // FIXME hardcoded contents elements border size - contentPixels -= 2; + contentPixels -= 1; setHeight(contentPixels + "px"); } else { @@ -385,6 +392,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { center(); } + updateShadowSizeAndPosition(); } private void setReadOnly(boolean readonly) { @@ -488,7 +496,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { DOM.setStyleAttribute(modalityCurtain, "position", "absolute"); } DOM.setStyleAttribute(modalityCurtain, "zIndex", "" - + (windowOrder.indexOf(this) + Z_INDEX_BASE)); + + (windowOrder.indexOf(this) + Z_INDEX)); DOM.appendChild(RootPanel.getBodyElement(), modalityCurtain); } @@ -573,7 +581,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { @Override public void onBrowserEvent(final Event event) { - final int type = DOM.eventGetType(event); + final int type = event.getTypeInt(); if (type == Event.ONKEYDOWN && shortcutHandler != null) { shortcutHandler.handleKeyboardEvent(event); @@ -587,10 +595,10 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { client.handleTooltipEvent(event, this); } - if (resizing || DOM.compare(resizeBox, target)) { + if (resizing || resizeBox == target) { onResizeEvent(event); DOM.eventCancelBubble(event, true); - } else if (DOM.compare(target, closeBox)) { + } else if (target == closeBox) { if (type == Event.ONCLICK) { onCloseClick(); DOM.eventCancelBubble(event, true); @@ -664,8 +672,12 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { client.updateVariable(id, "width", w, false); client.updateVariable(id, "height", h, false); } + // Update shadow size & position + // Update child widget dimensions - client.runDescendentsLayout(this); + if (client != null) { + client.runDescendentsLayout(this); + } } @Override @@ -679,6 +691,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { width.length() - 2)) + borderWidthHorizontal) + "px"); } + updateShadowSizeAndPosition(); } private void onDragEvent(Event event) { @@ -728,7 +741,7 @@ public class IWindow extends PopupPanel implements Paintable, ScrollListener { return false; } else if (modal) { // return false when modal and outside window - final Element target = DOM.eventGetTarget(event); + final Element target = event.getTarget().cast(); if (!DOM.isOrHasChild(getElement(), target)) { return false; } -- 2.39.5