7:49 a.m.
Author: phuong_vu
Date: 2011-09-05 08:49:25 -0400 (Mon, 05 Sep 2011)
New Revision: 7304
Modified:
portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/gadget/UIGadget.js
portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIDashboard.js
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIDashboard/Stylesheet.css
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIGadget/Stylesheet.css
portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/application/UIGadget.gtmpl
Log:
[DOM] UIGadget optimization
Modified:
portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/gadget/UIGadget.js
===================================================================
---
portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/gadget/UIGadget.js 2011-09-05
12:46:25 UTC (rev 7303)
+++
portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/gadget/UIGadget.js 2011-09-05
12:49:25 UTC (rev 7304)
@@ -99,7 +99,7 @@
} else {
var gadgetControl = eXo.core.DOMUtil.findFirstDescendantByClass(uiGadget,
"div", "GadgetControl");
gadgetControl.style.display = "block";
- var gadgetTitle = eXo.core.DOMUtil.findFirstDescendantByClass(gadgetControl,
"div", "GadgetTitle") ;
+ var gadgetTitle = eXo.core.DOMUtil.findFirstDescendantByClass(gadgetControl,
"span", "GadgetTitle") ;
gadgetTitle.style.display = "block";
if (metadata && metadata.modulePrefs.title != null &&
metadata.modulePrefs.title.length > 0) gadgetTitle.innerHTML =
metadata.modulePrefs.title;
}
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-05
12:46:25 UTC (rev 7303)
+++
portal/branches/dom/web/eXoResources/src/main/webapp/javascript/eXo/webui/UIDashboard.js 2011-09-05
12:49:25 UTC (rev 7304)
@@ -310,7 +310,7 @@
if (iframe) {
iframe.style.width = "99.9%" ;
}
- var minimizeButton = DOMUtil.findFirstDescendantByClass(gadgetControls[j],
"div", "MinimizeAction") ;
+ var minimizeButton = DOMUtil.findFirstDescendantByClass(gadgetControls[j],
"span", "MinimizeAction") ;
if(canEdit) {
eXo.webui.UIDashboard.init(gadgetControls[j], uiGadget);
Modified:
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIDashboard/Stylesheet.css
===================================================================
---
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIDashboard/Stylesheet.css 2011-09-05
12:46:25 UTC (rev 7303)
+++
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIDashboard/Stylesheet.css 2011-09-05
12:49:25 UTC (rev 7304)
@@ -43,20 +43,6 @@
height: 100%;
}
-.UIDashboard .GadgetTitle {
- float: left; /* orientation=lt */
- float: right; /* orientation=rt */
- padding: 0px 5px;
- color: #5b5b5b;
- font-weight: normal;
- cursor: move;
- overflow: hidden;
- white-space: nowrap;
- width: 195px;
- margin-right: 75px !important; /* orientation=lt */
- margin: 0px 0px 0px 75px !important; /* orientation=rt */
-}
-
.UIDashboard .UIDashboardEditForm {
background: white;
padding: 10px;
@@ -89,11 +75,11 @@
margin: 4px 0px 0px 2px;/* orientation=rt */
}
-.UITabPaneDashboard .NormalTab {
+.UITabPaneDashboard .NormalTab {
background-color:#E6E6E6;
}
-.UITabPaneDashboard .SelectedTab {
+.UITabPaneDashboard .SelectedTab {
background-color:#fff;
}
@@ -107,13 +93,13 @@
}
-.UITabPaneDashboard .UITab .Tablabel ,.UITabPaneDashboard span {
+.UITabPaneDashboard .UITab .Tablabel, .UITabPaneDashboard span {
font-weight:normal;
line-height: 14px;
}
-.UITabPaneDashboard .UITab .CloseIcon {
+.UITabPaneDashboard .UITab .CloseIcon {
background: url('background/IconClose.gif') no-repeat center top;
width: 14px;
height: 13px;
@@ -124,11 +110,11 @@
vertical-align: middle;
}
-.UITabPaneDashboard .SelectedTab .CloseIcon {
+.UITabPaneDashboard .SelectedTab .CloseIcon {
margin:0;
}
-.UITabPaneDashboard .AddDashboard {
+.UITabPaneDashboard .AddDashboard {
background: url('background/AddDashboard.gif') no-repeat center center;
width: 34px;
height: 32px;
@@ -167,9 +153,6 @@
width: 20px;
}
-.UIDashboardSelectContainer .DashboardItemContainer {
-}
-
.UIDashboardSelectContainer .DashboardItemContainer .InputContainer {
padding: 4px 0px 4px 10px;
_padding: 0px 10px;
@@ -241,10 +224,6 @@
border: 1px solid #b8babf;
}
-.UIDashboardSelectContainer .GadgetCategory .GadgetTab .RightCategoryTitleBar {
-
-}
-
.UIDashboardSelectContainer .GadgetCategory .GadgetTab .MiddleCategoryTitleBar {
height: 23px;
padding: 0px 8px;
@@ -297,60 +276,6 @@
padding: 5px; color: #111;
}
-.UIDashboard .UIGadget {
- padding: 5px 0px;
-}
-
-.UIDashboard .UIGadget .GadgetControl {
- float: none;
- padding: 0px;
- height: auto; width: auto;
-}
-
-.UIDashboard .UIGadget .GadgetControl .LeftControlBar {
- background: none;
- padding: 0px;
-}
-
-.UIDashboard .UIGadget .GadgetControl .RightControlBar {
- background: none;
- padding: 0px;
-}
-
-.UIDashboard .UIGadget .GadgetControl .CenterControlBar {
- background: url('background/BgTitleGadget.gif') repeat-x left top;
- height: 23px;
- line-height: 23px;
- padding: 0 9px;
- border: 1px solid #dbdbdb;
- border-top: none;
- cursor: move;
-}
-
-.UIDashboard .UIGadget .GadgetControl .GadgetDragHandleArea {
- display: none;
-}
-
-.UIDashboard .UIGadget .TLGadget {
- display: none;
-}
-
-.UIDashboard .UIGadget .MLGadget {
- background: #f2f2f3;
- border: 1px solid #c3c3c3;
- border-top: none;
- padding: 3px;
-}
-
-.UIDashboard .UIGadget .MRGadget {
- background: white;
- padding: 0 0 1px;
-}
-
-.UIDashboard .UIGadget .BLGadget {
- display: none;
-}
-
/*------------------UIDashboardContainer----------------*/
.UIDashboardContainer {
@@ -361,8 +286,8 @@
.UIDashboardContainer .GadgetContainer {
overflow: auto;
height: 100%;
- min-height: 400px;
- _height: 400px;
+ min-height: 400px;
+ _height: 400px;
}
.UIDashboardContainer .GadgetContainer .ContainerControlBarL {
@@ -393,19 +318,13 @@
text-decoration: none;
}
-.GadgetContainer .UIColumns {
-}
-
-.GadgetContainer .UIColumn {
+.UIDashboardContainer .GadgetContainer .UIColumn {
float: left; /* orientation=lt */
float: right; /* orientation=rt */
width: 325px;
padding: 2px;
}
-.UIDashboardContainer .UIGadget {
- width: 320px;
-}
.UIDashboardContainer .UIGadget .GadgetMenuBar{
text-align: left; /* orientation=lt */
text-align: right; /* orientation=rt */
@@ -509,6 +428,7 @@
#UIAddGadgetPopup .PopupTitle {
margin-left: 22px;
}
+
/*----------------------Maximized-------------------*/
.Maximized .UIGadget {
@@ -516,59 +436,7 @@
margin: 0px;
}
-.Maximized .UIGadget .GadgetControl {
- float: none;
- padding: 0px;
- height: auto; width: auto;
-}
-
-.Maximized .UIGadget .GadgetControl .LeftControlBar {
- background: none;
- padding: 0px;
-}
-
-.Maximized .UIGadget .GadgetControl .RightControlBar {
- background: none;
- padding: 0px;
-}
-
-.Maximized .UIGadget .GadgetControl .CenterControlBar {
- background: url('background/BgTitleGadget.gif') repeat-x left top;
- height: 23px;
- line-height: 23px;
- padding: 0 9px;
- border: 1px solid #dbdbdb;
- border-top: none;
-}
-
-.Maximized .UIGadget .GadgetControl .GadgetDragHandleArea {
- display: none;
-}
-
-.Maximized .UIGadget .TLGadget {
- display: none;
-}
-
-.Maximized .UIGadget .MLGadget {
- background: #f2f2f3;
- border: 1px solid #c3c3c3;
- border-top: none;
- padding: 3px;
-}
-
-.Maximized .UIGadget .MRGadget {
- background: white;
- padding: 0 0 1px;
-}
-
-.Maximized .UIGadget .BLGadget {
- display: none;
-}
-
.Maximized .GadgetTitle {
- float: left; /* orientation=lt */
- float: right; /* orientation=rt */
- padding: 0px 5px;
color: #5b5b5b;
font-weight: bold;
cursor: move;
Modified:
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIGadget/Stylesheet.css
===================================================================
---
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIGadget/Stylesheet.css 2011-09-05
12:46:25 UTC (rev 7303)
+++
portal/branches/dom/web/eXoResources/src/main/webapp/skin/DefaultSkin/portal/webui/component/view/UIGadget/Stylesheet.css 2011-09-05
12:49:25 UTC (rev 7304)
@@ -36,38 +36,30 @@
}
.UIGadget .GadgetControl {
- float: right; /* orientation=lt */
- float: left; /* orientation=rt */
- width: 100px; height: 20px;
- padding-right: 6px; /* orientation=lt */
- padding-left: 6px; /* orientation=rt */
+ background:
url('/eXoResources/skin/DefaultSkin/portal/webui/component/view/UIDashboard/background/BgTitleGadget.gif')
repeat-x left top;
+ height: 23px;
+ line-height: 23px;
+ padding: 0 9px;
+ border: 1px solid #dbdbdb;
+ border-top: none;
+ cursor: move;
+ text-align: left;
}
-.UIGadget .GadgetControl .LeftControlBar {
- background: url('background/Gadget.png') no-repeat left top; /* orientation=lt
*/
- background: url('background/Gadget-rt.png') no-repeat right top; /*
orientation=rt */
- padding-left: 23px; /* orientation=lt */
- padding-right: 23px; /* orientation=rt */
+.UIGadget .GadgetTitle {
+ padding: 0px 5px;
+ color: #5b5b5b;
+ font-weight: normal;
+ cursor: move;
+ overflow: hidden;
+ white-space: nowrap;
+ width: auto;
+ margin-right: 75px !important; /* orientation=lt */
+ margin: 0px 0px 0px 75px !important; /* orientation=rt */
}
-.UIGadget .GadgetControl .RightControlBar{
- background: url('background/Gadget.png') no-repeat right top; /* orientation=lt
*/
- background: url('background/Gadget-rt.png') no-repeat left top; /*
orientation=rt */
- padding-right: 4px; /* orientation=lt */
- padding-left: 4px; /* orientation=rt */
-}
-
-.UIGadget .GadgetControl .CenterControlBar {
- height: 19px;
- background: url('background/Gadget.png') repeat-x center -19px;
-}
-
.UIGadget .GadgetControl .GadgetDragHandleArea {
- float: right; /* orientation=lt */
- float: left; /* orientation=rt */
- width: 13px; height: 13px;
cursor: move;
- margin: 3px 3px 0px 3px;
background: url('background/Gadget.png') left -78px;
}
@@ -102,50 +94,13 @@
background-position: 65px top;
}
-.UIGadget .TLGadget {
- background: url('background/Gadget.png') no-repeat left -38px;
- padding-left: 8px;
+.UIGadget .GadgetApplication {
+ background: #f2f2f3;
+ border: 1px solid #c3c3c3;
+ border-top: none;
+ padding: 3px;
}
-.UIGadget .TRGadget {
- background: url('background/Gadget.png') no-repeat right -38px;
- padding-right: 8px;
-}
-
-.UIGadget .TCGadget {
- background: url('background/Gadget.png') repeat-x center -43px;
- height: 5px;
-}
-
-.UIGadget .MLGadget {
- background: url('background/MiddleGadget.png') repeat-y left;
- padding-left: 6px;
-}
-
-.UIGadget .MRGadget {
- background: url('background/MiddleGadget.png') repeat-y right;
- padding-right: 6px;
-}
-
-.UIGadget .MCGadget {
- background: white;
-}
-
-.UIGadget .BLGadget {
- background: url('background/Gadget.png') no-repeat left -58px;
- padding-left: 9px;
-}
-
-.UIGadget .BRGadget {
- background: url('background/Gadget.png') no-repeat right -68px;
- padding-right: 9px;
-}
-
-.UIGadget .BCGadget {
- background: url('background/Gadget.png') repeat-x center -48px;
- height: 10px;
-}
-
.UIGadget iframe {
width: 299px;
}
Modified:
portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/application/UIGadget.gtmpl
===================================================================
---
portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/application/UIGadget.gtmpl 2011-09-05
12:46:25 UTC (rev 7303)
+++
portal/branches/dom/web/portal/src/main/webapp/groovy/portal/webui/application/UIGadget.gtmpl 2011-09-05
12:49:25 UTC (rev 7304)
@@ -35,47 +35,24 @@
String unmaxiTitle = _ctx.appRes("UIGadget.tooltip.Unmaximize");
%>
<div class="UIGadget" id="$id" style="left: $posX; top:
$posY; z-Index: $zIndex; width: 100%" >
- <div class="GadgetControl" style="visibility: visible;">
- <div class="LeftControlBar">
- <div class="RightControlBar">
- <div class="CenterControlBar ClearFix">
- <div class="CloseGadget IconControl"
onclick="eXo.gadget.UIGadget.deleteGadget(this)"
onmousedown="event.cancelBubble=true;"
title="<%=_ctx.appRes("UIGadget.tooltip.deleteGadget")%>"><span></span></div>
- <div class="<%=view.equals(uicomponent.HOME_VIEW) ?
"MaximizeGadget" : "RestoreGadget";%> IconControl"
-
onclick="eXo.gadget.UIGadget.maximizeGadget(this)"
onmousedown="event.cancelBubble=true;"
- title="<%=view.equals(uicomponent.HOME_VIEW)
? maxiTitle : unmaxiTitle%>"><span></span></div>
- <div class="<%=isMini ? "RestoreGadget":
"MinimizeGadget";%> MinimizeAction IconControl"
- onclick="eXo.gadget.UIGadget.minimizeGadget(this)"
onmousedown="event.cancelBubble=true;" style="display:none;"
- title="<%=isMini ? unminiTitle : miniTitle%>"
miniTitle="$miniTitle"
unminiTitle="$unminiTitle"><span></span></div>
- <% if(uicomponent.isSettingUserPref()) { %>
- <div class="EditGadget IconControl"
onclick="eXo.gadget.UIGadget.editGadget('$id')"
onmousedown="event.cancelBubble=true;"
title="<%=_ctx.appRes("UIGadget.tooltip.editGadget")%>"><span></span></div>
- <% } %>
- <div
class="GadgetDragHandleArea"><span></span></div>
- <div class="GadgetTitle" style="display: <%=isLossData ?
"block" : "none"; %> ; float: none; width: auto; margin-right:
75px"><%= uicomponent.getApplicationName() %></div>
- </div>
- </div>
- </div>
+ <div class="GadgetControl ClearFix" style="visibility:
visible;">
+ <span class="CloseGadget IconControl"
onclick="eXo.gadget.UIGadget.deleteGadget(this)"
onmousedown="event.cancelBubble=true;"
title="<%=_ctx.appRes("UIGadget.tooltip.deleteGadget")%>"></span>
+ <span class="<%=view.equals(uicomponent.HOME_VIEW) ?
"MaximizeGadget" : "RestoreGadget";%> IconControl"
+ onclick="eXo.gadget.UIGadget.maximizeGadget(this)"
onmousedown="event.cancelBubble=true;"
+ title="<%=view.equals(uicomponent.HOME_VIEW) ? maxiTitle :
unmaxiTitle%>"></span>
+ <span class="<%=isMini ? "RestoreGadget":
"MinimizeGadget";%> MinimizeAction IconControl"
+ onclick="eXo.gadget.UIGadget.minimizeGadget(this)"
onmousedown="event.cancelBubble=true;" style="display:none;"
+ title="<%=isMini ? unminiTitle : miniTitle%>"
miniTitle="$miniTitle" unminiTitle="$unminiTitle"></span>
+ <% if(uicomponent.isSettingUserPref()) { %>
+ <span class="EditGadget IconControl"
onclick="eXo.gadget.UIGadget.editGadget('$id')"
onmousedown="event.cancelBubble=true;"
title="<%=_ctx.appRes("UIGadget.tooltip.editGadget")%>"></span>
+ <% } %>
+ <span class="GadgetDragHandleArea" style="display:
none;"></span>
+ <span class="GadgetTitle" style="display: <%=isLossData ?
"block" : "none"; %> ; float: none; width: auto; margin-right:
75px"><%= uicomponent.getApplicationName() %></span>
</div>
- <div class="ClearBoth"><span></span></div>
- <div class="GadgetApplication" style="display:<%=
Boolean.parseBoolean(uicomponent.getProperties().get("minimized")) ?
"none": "block"; %>">
- <div class="TLGadget">
- <div class="TRGadget">
- <div class="TCGadget"><span></span></div>
- </div>
- </div>
- <div class="MLGadget">
- <div class="MRGadget">
+ <div class="GadgetApplication" id="content-$id"
style="display:<%=
Boolean.parseBoolean(uicomponent.getProperties().get("minimized")) ?
"none": "block"; %>">
<% if(isLossData) {%>
- <div id="content-$id"
class="MCGadget"><%=_ctx.appRes("UIGadget.message.isLossData")%></div>
- <% } else {%>
- <div id="content-$id"
class="MCGadget"></div>
- <% } %>
- </div>
- </div>
- <div class="BLGadget">
- <div class="BRGadget">
- <div class="BCGadget"><span></span></div>
- </div>
- </div>
+ <%=_ctx.appRes("UIGadget.message.isLossData")%>
+ <% } %>
</div>
<div class="UIMask" style="display: none; border:solid 1px
red"><span></span></div>
-</div>
\ No newline at end of file
+</div>