ItEr37S16RFMaquetacionDesenhoAplicacionItEr36S18: Chart legends and scrolling reviewed

* The scrolling keeps the year and horizontal legend fixed.
This commit is contained in:
Lorenzo Tilve 2009-12-04 10:12:48 +01:00 committed by Javier Moran Rua
parent 7f7133994f
commit 39e552bb79
7 changed files with 115 additions and 68 deletions

View file

@ -66,7 +66,7 @@ planner = self;
</center>
</borderlayout>
</center>
<south height="200px" collapsible="true" title="Graphics"
<south height="150px" collapsible="true" title="Graphics"
sclass="scheduling-graphics">
<div id="insertionPointChart" />
</south>

View file

@ -94,6 +94,15 @@ function leftpanelcontainer() {
return YAHOO.util.Selector.query('.leftpanelcontainer')[0];
}
function timeplotcontainer_load() {
return YAHOO.util.Selector.query('.timeplot-canvas')[0];
}
function timeplotcontainer_earnedvalue() {
return YAHOO.util.Selector.query('.timeplot-canvas')[1];
}
zkTasklist.init = function(cmp) {
zkTasklist.adjust_height();
listenToScroll();
@ -115,11 +124,16 @@ function listenToScroll() {
leftpanel_ = leftpanel();
rightpanellayout_ = rightpanellayout();
plannergraph_ = plannergraph();
timeplotcontainer_load_ = timeplotcontainer_load();
timeplotcontainer_earnedvalue_ = timeplotcontainer_earnedvalue();
var onScroll = function() {
timetrackergap_.style["left"] = "-" + scrolledpannel_.scrollLeft + "px";
leftpanel_.style["top"] = "-" + scrolledpannel_.scrollTop + "px";
plannergraph_.scrollLeft = scrolledpannel_.scrollLeft;
timeplotcontainer_load_.style["left"] = "-" + scrolledpannel_.scrollLeft + "px";
timeplotcontainer_earnedvalue_.style["left"] = "-" + scrolledpannel_.scrollLeft + "px";
};
rightpanellayout_.onscroll = onScroll;

View file

@ -87,7 +87,6 @@ import org.zkoss.zk.ui.event.Events;
import org.zkoss.zul.Checkbox;
import org.zkoss.zul.Div;
import org.zkoss.zul.Hbox;
import org.zkoss.zul.Label;
import org.zkoss.zul.Tab;
import org.zkoss.zul.Tabbox;
import org.zkoss.zul.Tabpanel;
@ -159,7 +158,6 @@ public abstract class CompanyPlanningModel implements ICompanyPlanningModel {
Tabbox chartComponent = new Tabbox();
chartComponent.setOrient("vertical");
chartComponent.setHeight("200px");
appendTabs(chartComponent);
Timeplot chartLoadTimeplot = new Timeplot();
@ -219,16 +217,19 @@ public abstract class CompanyPlanningModel implements ICompanyPlanningModel {
}
private org.zkoss.zk.ui.Component getLoadChartLegend() {
Div div = new Div();
Hbox hbox = new Hbox();
hbox.setClass("legend-container");
hbox.setAlign("center");
hbox.setPack("center");
Executions.createComponents("/planner/_legendLoadChartCompany.zul",
div, null);
return div;
hbox, null);
return hbox;
}
private void appendEarnedValueChartAndLegend(
Tabpanel earnedValueChartPannel, Timeplot chartEarnedValueTimeplot) {
Hbox hbox = new Hbox();
hbox.setSclass("earned-value-chart");
hbox.appendChild(getEarnedValueChartConfigurableLegend());
Div div = new Div();
@ -241,26 +242,23 @@ public abstract class CompanyPlanningModel implements ICompanyPlanningModel {
}
private org.zkoss.zk.ui.Component getEarnedValueChartConfigurableLegend() {
Hbox mainhbox = new Hbox();
mainhbox.setClass("legend-container");
mainhbox.setAlign("center");
mainhbox.setPack("center");
Vbox vbox = new Vbox();
vbox.setId("earnedValueChartConfiguration");
vbox.setClass("legend");
Hbox hboxTitle = new Hbox();
hboxTitle.setClass("legend-title");
hboxTitle.setPack("center");
Label labelTitle = new Label(_("Chart legend"));
labelTitle.setClass("title");
hboxTitle.appendChild(labelTitle);
vbox.appendChild(hboxTitle);
Vbox column1 = new Vbox();
Vbox column2 = new Vbox();
column1.setWidth("75px");
column2.setWidth("75px");
Vbox column3 = new Vbox();
column1.setSclass("earned-parameter-column");
column2.setSclass("earned-parameter-column");
column3.setSclass("earned-parameter-column");
boolean odd = true;
int columnNumber = 0;
for (EarnedValueType type : EarnedValueType.values()) {
Checkbox checkbox = new Checkbox(type.getAcronym());
@ -268,21 +266,29 @@ public abstract class CompanyPlanningModel implements ICompanyPlanningModel {
checkbox.setAttribute("indicator", type);
checkbox.setStyle("color: " + type.getColor());
if (odd) {
columnNumber = columnNumber + 1;
switch (columnNumber) {
case 1:
column1.appendChild(checkbox);
} else {
break;
case 2:
column2.appendChild(checkbox);
break;
case 3:
column3.appendChild(checkbox);
columnNumber = 0;
}
earnedValueChartConfigurationCheckboxes.add(checkbox);
odd = !odd;
}
Hbox hbox = new Hbox();
hbox.appendChild(column1);
hbox.appendChild(column2);
hbox.appendChild(column3);
vbox.appendChild(hbox);
mainhbox.appendChild(vbox);
markAsSelectedDefaultIndicators();

View file

@ -90,7 +90,6 @@ import org.zkoss.zk.ui.event.Events;
import org.zkoss.zul.Checkbox;
import org.zkoss.zul.Div;
import org.zkoss.zul.Hbox;
import org.zkoss.zul.Label;
import org.zkoss.zul.Tab;
import org.zkoss.zul.Tabbox;
import org.zkoss.zul.Tabpanel;
@ -176,7 +175,7 @@ public abstract class OrderPlanningModel implements IOrderPlanningModel {
Tabbox chartComponent = new Tabbox();
chartComponent.setOrient("vertical");
chartComponent.setHeight("200px");
// chartComponent.setHeight("200px");
appendTabs(chartComponent);
Timeplot chartLoadTimeplot = new Timeplot();
@ -204,7 +203,7 @@ public abstract class OrderPlanningModel implements IOrderPlanningModel {
chartTabs.appendChild(new Tab(_("Earned value")));
chartComponent.appendChild(chartTabs);
chartTabs.setWidth("100px");
chartTabs.setSclass("charts-tabbox");
}
private void appendTabpanels(Tabbox chartComponent, Timeplot loadChart,
@ -227,6 +226,7 @@ public abstract class OrderPlanningModel implements IOrderPlanningModel {
Timeplot loadChart) {
Hbox hbox = new Hbox();
hbox.appendChild(getLoadChartLegend());
hbox.setSclass("load-chart");
Div div = new Div();
div.appendChild(loadChart);
@ -237,10 +237,13 @@ public abstract class OrderPlanningModel implements IOrderPlanningModel {
}
private org.zkoss.zk.ui.Component getLoadChartLegend() {
Div div = new Div();
Executions.createComponents("/planner/_legendLoadChartOrder.zul", div,
Hbox hbox = new Hbox();
hbox.setClass("legend-container");
hbox.setAlign("center");
hbox.setPack("center");
Executions.createComponents("/planner/_legendLoadChartOrder.zul", hbox,
null);
return div;
return hbox;
}
private void appendEarnedValueChartAndLegend(
@ -257,26 +260,23 @@ public abstract class OrderPlanningModel implements IOrderPlanningModel {
}
private org.zkoss.zk.ui.Component getEarnedValueChartConfigurableLegend() {
Hbox mainhbox = new Hbox();
mainhbox.setClass("legend-container");
mainhbox.setAlign("center");
mainhbox.setPack("center");
Vbox vbox = new Vbox();
vbox.setId("earnedValueChartConfiguration");
vbox.setClass("legend");
Hbox hboxTitle = new Hbox();
hboxTitle.setClass("legend-title");
hboxTitle.setPack("center");
Label labelTitle = new Label(_("Chart legend"));
labelTitle.setClass("title");
hboxTitle.appendChild(labelTitle);
vbox.appendChild(hboxTitle);
Vbox column1 = new Vbox();
Vbox column2 = new Vbox();
column1.setWidth("75px");
column2.setWidth("75px");
Vbox column3 = new Vbox();
column1.setSclass("earned-parameter-column");
column2.setSclass("earned-parameter-column");
column3.setSclass("earned-parameter-column");
boolean odd = true;
int columnNumber = 0;
for (EarnedValueType type : EarnedValueType.values()) {
Checkbox checkbox = new Checkbox(type.getAcronym());
@ -284,21 +284,30 @@ public abstract class OrderPlanningModel implements IOrderPlanningModel {
checkbox.setAttribute("indicator", type);
checkbox.setStyle("color: " + type.getColor());
if (odd) {
columnNumber = columnNumber + 1;
switch (columnNumber) {
case 1:
column1.appendChild(checkbox);
} else {
break;
case 2:
column2.appendChild(checkbox);
break;
case 3:
column3.appendChild(checkbox);
columnNumber = 0;
break;
}
earnedValueChartConfigurationCheckboxes.add(checkbox);
odd = !odd;
}
Hbox hbox = new Hbox();
hbox.appendChild(column1);
hbox.appendChild(column2);
hbox.appendChild(column3);
vbox.appendChild(hbox);
mainhbox.setClass("legend-container");
mainhbox.appendChild(vbox);
markAsSelectedDefaultIndicators();

View file

@ -662,10 +662,16 @@ div.z-grid {
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 12px;
border: solid 1px #000000;
padding: 10px 30px 10px 30px;
padding: 5px 10px;
background-color: #FFFFFF;
}
.legend-container {
width: 226px;
height: 104px;
background-color: #E8E8E8;
}
.legend td {
vertical-align:bottom;
}
@ -714,14 +720,14 @@ div.z-grid {
}
.legend .overload-other {
border-top:solid 1px #FFFF00;
border-top:solid 1px #7f007f;
height:7px;
width:25px;
margin-right:5px;
}
.legend .other {
background-color:#00FF00;
background-color:#7f007f;
height:10px;
width:25px;
margin-bottom:2px;
@ -913,3 +919,23 @@ tr.z-tree-row-seld, tr.z-list-item-seld {
background-color: #2a83b4;
color: #FFFFFF;
}
.timeplot-canvas {
position:relative;
overflow:hidden;
}
.resourcesload .timetrackergap .z-grid-header{
heigth: 15px;
}
.scheduling-graphics .z-tabs-ver {
width: 60px !important;
}
.scheduling-graphics .z-tab-ver .z-tab-ver-text {
white-space: normal;
}
.earned-parameter-column {
width: 70px;
}

View file

@ -23,10 +23,6 @@
<vbox sclass="legend">
<hbox pack="center" sclass="legend-title">
<n:label class="title">${i18n:_('Chart legend')}</n:label>
</hbox>
<hbox pack="center" sclass="legend-row">
<n:div class="capability"/>
<n:label>${i18n:_('Total capability')}</n:label>

View file

@ -23,35 +23,31 @@
<vbox sclass="legend">
<hbox pack="center" sclass="legend-title">
<n:label class="title">${i18n:_('Chart legend')}</n:label>
</hbox>
<hbox pack="center" sclass="legend-row">
<hbox pack="center" sclass="legend-row" tooltiptext="${i18n:_('Resources capability')}">
<n:div class="capability"/>
<n:label>${i18n:_('Capability')}</n:label>
<n:label>${i18n:_('Total capability')}</n:label>
</hbox>
<hbox pack="center" sclass="legend-row">
<hbox pack="center" sclass="legend-row" tooltiptext="${i18n:_('Overload due to other projects')}">
<n:div class="overload-other"/>
<n:label>${i18n:_('Overload due to other')}</n:label>
<n:label>${i18n:_('Overload (*)')}</n:label>
</hbox>
<hbox pack="center" sclass="legend-row">
<hbox pack="center" sclass="legend-row" tooltiptext="${i18n:_('Overload due to order')}">
<n:div class="overload-order"/>
<n:label>${i18n:_('Overload due to order')}</n:label>
<n:label>${i18n:_('Overload')}</n:label>
</hbox>
<hbox pack="center" sclass="legend-row">
<hbox pack="center" sclass="legend-row" tooltiptext="${i18n:_('Other assignments')}">
<n:div class="other"/>
<n:label>${i18n:_('Other assignments')}</n:label>
</hbox>
<hbox pack="center" sclass="legend-row">
<hbox pack="center" sclass="legend-row" tooltiptext="${i18n:_('Load due to order')}">
<n:div class="load" />
<n:label>${i18n:_('Load due to order')}</n:label>
<n:label>${i18n:_('Load')}</n:label>
</hbox>
</vbox>
</zk>
</zk>