IDEMPIERE-724 Zk: Make iDempiere theme more easily customizable. Allow theme to make bigger changes to the appearance of desktop header. Allow theme to change the timeout page.

This commit is contained in:
Heng Sin Low 2013-05-08 16:23:54 +08:00
parent 4399ea910e
commit 14fdc2559e
9 changed files with 132 additions and 93 deletions

View File

@ -28,9 +28,9 @@ import org.zkoss.zk.ui.Page;
import org.zkoss.zk.ui.event.Event; import org.zkoss.zk.ui.event.Event;
import org.zkoss.zk.ui.event.EventListener; import org.zkoss.zk.ui.event.EventListener;
import org.zkoss.zk.ui.event.Events; import org.zkoss.zk.ui.event.Events;
import org.zkoss.zul.Button;
import org.zkoss.zul.Image; import org.zkoss.zul.Image;
import org.zkoss.zul.Popup; import org.zkoss.zul.Popup;
import org.zkoss.zul.impl.LabelImageElement;
/** /**
* *
@ -45,9 +45,9 @@ public class HeaderPanel extends Panel implements EventListener<Event>
{ {
private static final long serialVersionUID = -2351317624519209484L; private static final long serialVersionUID = -2351317624519209484L;
private Image image; protected Image image;
private Button btnMenu; protected LabelImageElement btnMenu;
private Popup popMenu; protected Popup popMenu;
public HeaderPanel() public HeaderPanel()
{ {
@ -55,19 +55,23 @@ public class HeaderPanel extends Panel implements EventListener<Event>
addEventListener(Events.ON_CREATE, this); addEventListener(Events.ON_CREATE, this);
} }
private void onCreate() protected void onCreate()
{ {
image = (Image) getFellow("logo"); image = (Image) getFellow("logo");
image.setSrc(ThemeManager.getSmallLogo()); image.setSrc(ThemeManager.getSmallLogo());
image.addEventListener(Events.ON_CLICK, this); image.addEventListener(Events.ON_CLICK, this);
image.setStyle("cursor: pointer;"); image.setStyle("cursor: pointer;");
MenuSearchPanel menuSearchPanel = new MenuSearchPanel(this); createSearchPanel();
Component stub = getFellow("menuLookup");
stub.getParent().insertBefore(menuSearchPanel, stub);
stub.detach();
menuSearchPanel.setId("menuLookup");
createPopupMenu();
btnMenu = (LabelImageElement) getFellow("menuButton");
btnMenu.setLabel(Util.cleanAmp(Msg.getMsg(Env.getCtx(),"Menu")));
btnMenu.addEventListener(Events.ON_CLICK, this);
}
protected void createPopupMenu() {
popMenu = new Popup(); popMenu = new Popup();
popMenu.setId("menuTreePopup"); popMenu.setId("menuTreePopup");
new MenuTreePanel(popMenu); new MenuTreePanel(popMenu);
@ -75,10 +79,14 @@ public class HeaderPanel extends Panel implements EventListener<Event>
popMenu.setHeight("90%"); popMenu.setHeight("90%");
popMenu.setWidth("600px"); popMenu.setWidth("600px");
popMenu.setPage(this.getPage()); popMenu.setPage(this.getPage());
}
btnMenu = (Button) getFellow("menuButton"); protected void createSearchPanel() {
btnMenu.setLabel(Util.cleanAmp(Msg.getMsg(Env.getCtx(),"Menu"))); MenuSearchPanel menuSearchPanel = new MenuSearchPanel(this);
btnMenu.addEventListener(Events.ON_CLICK, this); Component stub = getFellow("menuLookup");
stub.getParent().insertBefore(menuSearchPanel, stub);
stub.detach();
menuSearchPanel.setId("menuLookup");
} }
public void onEvent(Event event) throws Exception { public void onEvent(Event event) throws Exception {

View File

@ -204,7 +204,7 @@ public class LoginPanel extends Window implements EventListener<Event>
protected void createUI() { protected void createUI() {
Div div = new Div(); Div div = new Div();
div.setSclass(ITheme.LOGIN_BOX_HEADER_CLASS); div.setSclass(ITheme.LOGIN_BOX_HEADER_CLASS);
Label label = new Label("Login"); Label label = new Label(Msg.getMsg(Env.getCtx(), "Login"));
label.setSclass(ITheme.LOGIN_BOX_HEADER_TXT_CLASS); label.setSclass(ITheme.LOGIN_BOX_HEADER_TXT_CLASS);
div.appendChild(label); div.appendChild(label);
this.appendChild(div); this.appendChild(div);

View File

@ -34,11 +34,12 @@ public class MenuSearchPanel extends AbstractMenuPanel
*/ */
private static final long serialVersionUID = 5308522340852904168L; private static final long serialVersionUID = 5308522340852904168L;
private MenuTreeSearchPanel pnlSearch; protected MenuTreeSearchPanel pnlSearch;
public MenuSearchPanel(Component parent) public MenuSearchPanel(Component parent)
{ {
super(parent); super(parent);
this.setSclass("menu-search-panel-container");
} }
protected void init() protected void init()
@ -70,6 +71,10 @@ public class MenuSearchPanel extends AbstractMenuPanel
{ {
super.initComponents(); super.initComponents();
createSearchPanel();
}
protected void createSearchPanel() {
Toolbar toolbar = new Toolbar(); Toolbar toolbar = new Toolbar();
toolbar.setMold("panel"); toolbar.setMold("panel");
this.appendChild(toolbar); this.appendChild(toolbar);

View File

@ -46,9 +46,9 @@ public class MenuTreeSearchPanel extends TreeSearchPanel {
* generated serial id * generated serial id
*/ */
private static final long serialVersionUID = 8785295166415073971L; private static final long serialVersionUID = 8785295166415073971L;
private Toolbarbutton newBtn; protected Toolbarbutton newBtn;
private Toolbarbutton openBtn; protected Toolbarbutton openBtn;
private boolean isNew = false; protected boolean isNew = false;
public MenuTreeSearchPanel(Tree tree, String event, int windowno, int tabno) { public MenuTreeSearchPanel(Tree tree, String event, int windowno, int tabno) {
super(tree, event, windowno, tabno); super(tree, event, windowno, tabno);
@ -71,22 +71,17 @@ public class MenuTreeSearchPanel extends TreeSearchPanel {
hlayout.setSpacing("0px"); hlayout.setSpacing("0px");
hlayout.setSclass("menu-search-toggle-box"); hlayout.setSclass("menu-search-toggle-box");
newBtn = new Toolbarbutton(); createNewButton();
newBtn.setImage(ThemeManager.getThemeResource("images/New16.png"));
newBtn.setSclass("menu-search-toggle-off");
newBtn.addEventListener(Events.ON_CLICK, new EventListener<Event>() {
@Override
public void onEvent(Event event) throws Exception {
newBtn.setDisabled(true);
newBtn.setSclass("menu-search-toggle-on");
isNew = true;
openBtn.setDisabled(false);
openBtn.setSclass("menu-search-toggle-off");
refreshAutoComplete();
}
});
newBtn.setTooltiptext(Util.cleanAmp(Msg.getMsg(Env.getCtx(), "New")));
createOpenButton();
hlayout.appendChild(newBtn);
hlayout.appendChild(openBtn);
layout.insertBefore(hlayout, layout.getFirstChild());
}
protected void createOpenButton() {
openBtn = new Toolbarbutton(); openBtn = new Toolbarbutton();
openBtn.setImage(ThemeManager.getThemeResource("images/Open16.png")); openBtn.setImage(ThemeManager.getThemeResource("images/Open16.png"));
openBtn.setSclass("menu-search-toggle-on"); openBtn.setSclass("menu-search-toggle-on");
@ -103,11 +98,24 @@ public class MenuTreeSearchPanel extends TreeSearchPanel {
} }
}); });
openBtn.setTooltiptext(Util.cleanAmp(Msg.getMsg(Env.getCtx(), "Open"))); openBtn.setTooltiptext(Util.cleanAmp(Msg.getMsg(Env.getCtx(), "Open")));
}
hlayout.appendChild(newBtn); protected void createNewButton() {
hlayout.appendChild(openBtn); newBtn = new Toolbarbutton();
newBtn.setImage(ThemeManager.getThemeResource("images/New16.png"));
layout.insertBefore(hlayout, layout.getFirstChild()); newBtn.setSclass("menu-search-toggle-off");
newBtn.addEventListener(Events.ON_CLICK, new EventListener<Event>() {
@Override
public void onEvent(Event event) throws Exception {
newBtn.setDisabled(true);
newBtn.setSclass("menu-search-toggle-on");
isNew = true;
openBtn.setDisabled(false);
openBtn.setSclass("menu-search-toggle-off");
refreshAutoComplete();
}
});
newBtn.setTooltiptext(Util.cleanAmp(Msg.getMsg(Env.getCtx(), "New")));
} }
@Override @Override
@ -131,7 +139,7 @@ public class MenuTreeSearchPanel extends TreeSearchPanel {
refreshAutoComplete(); refreshAutoComplete();
} }
private void refreshAutoComplete() { protected void refreshAutoComplete() {
List<String> valueList = new ArrayList<String>(); List<String> valueList = new ArrayList<String>();
List<String> descriptionList = new ArrayList<String>(); List<String> descriptionList = new ArrayList<String>();
List<String> imageList = new ArrayList<String>(); List<String> imageList = new ArrayList<String>();

View File

@ -144,7 +144,7 @@ public class RolePanel extends Window implements EventListener<Event>, Deferrabl
protected void createUI() { protected void createUI() {
Div div = new Div(); Div div = new Div();
div.setSclass(ITheme.LOGIN_BOX_HEADER_CLASS); div.setSclass(ITheme.LOGIN_BOX_HEADER_CLASS);
Label label = new Label("Login"); Label label = new Label(Msg.getMsg(Env.getCtx(), "SelectRole"));
label.setSclass(ITheme.LOGIN_BOX_HEADER_TXT_CLASS); label.setSclass(ITheme.LOGIN_BOX_HEADER_TXT_CLASS);
div.appendChild(label); div.appendChild(label);
this.appendChild(div); this.appendChild(div);

View File

@ -22,7 +22,6 @@ import java.util.Properties;
import org.adempiere.webui.component.Label; import org.adempiere.webui.component.Label;
import org.adempiere.webui.component.Menupopup; import org.adempiere.webui.component.Menupopup;
import org.adempiere.webui.component.Messagebox; import org.adempiere.webui.component.Messagebox;
import org.adempiere.webui.component.ToolBarButton;
import org.adempiere.webui.session.SessionManager; import org.adempiere.webui.session.SessionManager;
import org.adempiere.webui.util.FeedbackManager; import org.adempiere.webui.util.FeedbackManager;
import org.adempiere.webui.window.WPreference; import org.adempiere.webui.window.WPreference;
@ -32,12 +31,14 @@ import org.compiere.model.MRole;
import org.compiere.model.MUser; import org.compiere.model.MUser;
import org.compiere.util.Env; import org.compiere.util.Env;
import org.compiere.util.Msg; import org.compiere.util.Msg;
import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.event.Event; import org.zkoss.zk.ui.event.Event;
import org.zkoss.zk.ui.event.EventListener; import org.zkoss.zk.ui.event.EventListener;
import org.zkoss.zk.ui.event.Events; import org.zkoss.zk.ui.event.Events;
import org.zkoss.zk.ui.event.KeyEvent; import org.zkoss.zk.ui.event.KeyEvent;
import org.zkoss.zk.ui.util.Composer;
import org.zkoss.zul.Menuitem; import org.zkoss.zul.Menuitem;
import org.zkoss.zul.Vbox; import org.zkoss.zul.impl.LabelImageElement;
/** /**
* *
@ -45,51 +46,48 @@ import org.zkoss.zul.Vbox;
* @date Feb 25, 2007 * @date Feb 25, 2007
* @version $Revision: 0.10 $ * @version $Revision: 0.10 $
*/ */
public class UserPanel extends Vbox implements EventListener<Event> public class UserPanel implements EventListener<Event>, Composer<Component>
{ {
/**
*
*/
private static final long serialVersionUID = 6605639697034780065L;
private Properties ctx; protected Properties ctx;
private ToolBarButton logout = new ToolBarButton(); protected LabelImageElement logout;
private ToolBarButton changeRole = new ToolBarButton(); protected LabelImageElement changeRole;
private ToolBarButton preference = new ToolBarButton(); protected LabelImageElement preference;
private ToolBarButton feedback = new ToolBarButton(); protected LabelImageElement feedback;
private Label lblUserNameValue = new Label(); protected Label lblUserNameValue = new Label();
private WPreference preferencePopup; protected WPreference preferencePopup;
private Menupopup feedbackMenu; protected Menupopup feedbackMenu;
protected Component component;
public UserPanel() public UserPanel()
{ {
super(); super();
this.ctx = Env.getCtx(); this.ctx = Env.getCtx();
addEventListener(Events.ON_CREATE, this);
} }
private void onCreate() protected void onCreate()
{ {
lblUserNameValue = (Label) getFellow("loginUserAndRole"); lblUserNameValue = (Label) component.getFellowIfAny("loginUserAndRole", true);
lblUserNameValue.setValue(getUserName() + "@" + getClientName() + "." + getOrgName()+"/"+this.getRoleName()); lblUserNameValue.setValue(getUserName() + "@" + getClientName() + "." + getOrgName()+"/"+this.getRoleName());
lblUserNameValue.addEventListener(Events.ON_CLICK, this); lblUserNameValue.addEventListener(Events.ON_CLICK, this);
feedback = (ToolBarButton) getFellow("feedback"); feedback = (LabelImageElement) component.getFellowIfAny("feedback", true);
feedback.setLabel(Msg.getMsg(Env.getCtx(), "Feedback")); feedback.setLabel(Msg.getMsg(Env.getCtx(), "Feedback"));
feedback.addEventListener(Events.ON_CLICK, this); feedback.addEventListener(Events.ON_CLICK, this);
preference = (ToolBarButton) getFellow("preference"); preference = (LabelImageElement) component.getFellowIfAny("preference", true);
preference.setLabel(Msg.getMsg(Env.getCtx(), "Preference")); preference.setLabel(Msg.getMsg(Env.getCtx(), "Preference"));
preference.addEventListener(Events.ON_CLICK, this); preference.addEventListener(Events.ON_CLICK, this);
changeRole = (ToolBarButton) getFellow("changeRole"); changeRole = (LabelImageElement) component.getFellowIfAny("changeRole", true);
changeRole.setLabel(Msg.getMsg(Env.getCtx(), "changeRole")); changeRole.setLabel(Msg.getMsg(Env.getCtx(), "changeRole"));
changeRole.addEventListener(Events.ON_CLICK, this); changeRole.addEventListener(Events.ON_CLICK, this);
logout = (ToolBarButton) getFellow("logout"); logout = (LabelImageElement) component.getFellowIfAny("logout", true);
logout.setLabel(Msg.getMsg(Env.getCtx(),"Logout")); logout.setLabel(Msg.getMsg(Env.getCtx(),"Logout"));
logout.addEventListener(Events.ON_CLICK, this); logout.addEventListener(Events.ON_CLICK, this);
@ -104,7 +102,7 @@ public class UserPanel extends Vbox implements EventListener<Event>
feedbackMenu.appendChild(mi); feedbackMenu.appendChild(mi);
SessionManager.getSessionApplication().getKeylistener().addEventListener(Events.ON_CTRL_KEY, this); SessionManager.getSessionApplication().getKeylistener().addEventListener(Events.ON_CTRL_KEY, this);
addEventListener("onEmailSupport", this); component.addEventListener("onEmailSupport", this);
} }
private String getUserName() private String getUserName()
@ -165,14 +163,14 @@ public class UserPanel extends Vbox implements EventListener<Event>
preferencePopup.detach(); preferencePopup.detach();
} }
preferencePopup = new WPreference(); preferencePopup = new WPreference();
preferencePopup.setPage(this.getPage()); preferencePopup.setPage(component.getPage());
preferencePopup.open(preference, "after_start"); preferencePopup.open(preference, "after_start");
} }
else if (feedback == event.getTarget()) else if (feedback == event.getTarget())
{ {
if (feedbackMenu.getPage() == null) if (feedbackMenu.getPage() == null)
{ {
this.appendChild(feedbackMenu); component.appendChild(feedbackMenu);
} }
feedbackMenu.open(feedback, "after_start"); feedbackMenu.open(feedback, "after_start");
} }
@ -204,10 +202,11 @@ public class UserPanel extends Vbox implements EventListener<Event>
} }
} }
} }
else if (Events.ON_CREATE.equals(event.getName()))
{
onCreate();
} }
@Override
public void doAfterCompose(Component comp) throws Exception {
this.component = comp;
onCreate();
} }
} }

View File

@ -0,0 +1,32 @@
<?page title="iDempiere" contentType="text/html;charset=UTF-8" automaticTimeout="false" ?>
<zk>
<zscript>
<![CDATA[
import org.compiere.util.Msg;
import org.compiere.util.Env;
var continueText = Msg.getMsg(Env.getCtx(),"continue");
]]>
</zscript>
<window width="60%" mode="highlighted">
<vbox style="padding: 5px">
<div id="timeoutText"></div>
<div style="margin-top: 10px">
<toolbarbutton href="/index.zul" label="${continueText}"/>
</div>
</vbox>
<script defer="true">
<![CDATA[
var callback = function(ok, val) {
if (ok && !!val)
{
document.getElementById("${timeoutText.uuid}").innerHTML = val;
}
};
adempiere.store.get("zkTimeoutText", callback);
]]>
</script>
</window>
</zk>

View File

@ -10,7 +10,7 @@
</hbox> </hbox>
</west> </west>
<center sclass="desktop-header-right"> <center sclass="desktop-header-right">
<vbox use="org.adempiere.webui.panel.UserPanel" height="100%" align="right" <vbox apply="org.adempiere.webui.panel.UserPanel" height="100%" align="right"
style="position: absolute; text-align:right;" hflex="1" vflex="1" style="position: absolute; text-align:right;" hflex="1" vflex="1"
sclass="desktop-user-panel"> sclass="desktop-user-panel">
<vbox> <vbox>

View File

@ -1,32 +1,19 @@
<?page title="iDempiere" contentType="text/html;charset=UTF-8" automaticTimeout="false" ?> <?page title="iDempiere" contentType="text/html;charset=UTF-8" automaticTimeout="false" ?>
<zk> <zk>
<zscript>
<![CDATA[
import org.compiere.util.Msg;
import org.compiere.util.Env;
var continueText = Msg.getMsg(Env.getCtx(),"continue");
]]>
</zscript>
<window width="60%" mode="highlighted">
<vbox style="padding: 5px">
<div id="timeoutText"></div>
<div style="margin-top: 10px">
<toolbarbutton href="/index.zul" label="${continueText}"/>
</div>
</vbox>
<script defer="true"> <script defer="true">
<![CDATA[ <![CDATA[
var callback = function(ok, val) { var callback = function(ok, val) {
if (ok && !!val) if (ok && !!val)
{ {
document.getElementById("${timeoutText.uuid}").innerHTML = val; window.location = val;
}
else
{
window.location = "sessiontimeout.zul";
} }
}; };
adempiere.store.get("zkTimeoutText", callback); adempiere.store.get("zkTimeoutURL", callback);
]]> ]]>
</script> </script>
</window>
</zk> </zk>