Author: sergeyhalipov Date: 2007-05-10 14:25:35 -0400 (Thu, 10 May 2007) New Revision: 727 Modified: trunk/richfaces/modal-panel/src/main/config/component/modalPanel.xml trunk/richfaces/modal-panel/src/main/java/org/richfaces/component/UIModalPanel.java trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/css/modalPanel.xcss trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js trunk/richfaces/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx Log: Add shadow decoration to modal panel. Modified: trunk/richfaces/modal-panel/src/main/config/component/modalPanel.xml =================================================================== --- trunk/richfaces/modal-panel/src/main/config/component/modalPanel.xml 2007-05-10 18:23:11 UTC (rev 726) +++ trunk/richfaces/modal-panel/src/main/config/component/modalPanel.xml 2007-05-10 18:25:35 UTC (rev 727) @@ -132,6 +132,23 @@ </description> <defaultvalue>100</defaultvalue> </property> - + + <property> + <name>shadowOpacity</name> + <classname>java.lang.String</classname> + <description> + HTML CSS class attribute of element for pop-up + suggestion content + </description> + </property> + + <property> + <name>shadowDepth</name> + <classname>java.lang.String</classname> + <description> + Pop-up shadow depth for suggestion content + </description> + </property> + </component> </components> Modified: trunk/richfaces/modal-panel/src/main/java/org/richfaces/component/UIModalPanel.java =================================================================== --- trunk/richfaces/modal-panel/src/main/java/org/richfaces/component/UIModalPanel.java 2007-05-10 18:23:11 UTC (rev 726) +++ trunk/richfaces/modal-panel/src/main/java/org/richfaces/component/UIModalPanel.java 2007-05-10 18:25:35 UTC (rev 727) @@ -22,7 +22,11 @@ package org.richfaces.component; import javax.faces.component.UIComponentBase; +import javax.faces.context.FacesContext; +import org.ajax4jsf.framework.skin.Skin; +import org.ajax4jsf.framework.skin.SkinFactory; + /** * JSF component class * @@ -32,6 +36,11 @@ public static final String COMPONENT_TYPE = "org.richfaces.ModalPanel"; private static final String COMPONENT_FAMILY = "org.richfaces.ModalPanel"; + + /** + * Shadow depth. + */ + private static final int SHADOW_DEPTH = 4; public abstract int getWidth(); public abstract int getHeight(); @@ -63,4 +72,37 @@ public boolean getRendersChildren() { return true; } + + public String getShadowStyle() { + String shadow = (String) getAttributes().get("shadowDepth"); + if (shadow == null) { + shadow = Integer.toString(SHADOW_DEPTH); + } + + String shadowStyle = "top: " + shadow + "; left: " + shadow + ";"; + + FacesContext context = FacesContext.getCurrentInstance(); + if (null == context) + return shadowStyle; + + String opacity = (String) getAttributes().get("shadowOpacity"); + String filterOpacity; + + if (null == opacity) { + Skin skin = SkinFactory.getInstance().getSkin(context); + opacity = (String) skin.getParameter(context, "shadowOpacity"); + } + try { + Double op = Double.valueOf(opacity); + filterOpacity = Integer.toString(op.intValue() * 10); + opacity = Double.toString(op.doubleValue() / 10); + } catch (Exception e) { + // illegal opacity + return ";"; + } + shadowStyle += " opacity:" + opacity + + "; filter:alpha(opacity=" + filterOpacity + ");"; + + return shadowStyle; + } } Modified: trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/css/modalPanel.xcss =================================================================== --- trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/css/modalPanel.xcss 2007-05-10 18:23:11 UTC (rev 726) +++ trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/css/modalPanel.xcss 2007-05-10 18:25:35 UTC (rev 727) @@ -70,6 +70,15 @@ .dr-mpnl-pnl-b{ padding : 10px; } + +.dr-mpnl-shadow { + position: absolute; + height: 100%; + width: 100%; + border : 1px solid; + z-index: 1; +} + ]]> </f:verbatim> <u:selector name=".dr-mpnl-pnl"> @@ -99,5 +108,11 @@ <u:style name="font-family" skin="generalFamilyFont" /> </u:selector> +<u:selector name=".dr-mpnl-shadow"> + <u:style name="background-color" skin="shadowBackgroundColor" /> + <u:style name="border-color" skin="shadowBackgroundColor" /> + <u:style name="opacity" skin="shadowOpacity" /> +</u:selector> + </f:template> Modified: trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js =================================================================== --- trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js 2007-05-10 18:23:11 UTC (rev 726) +++ trunk/richfaces/modal-panel/src/main/resources/org/richfaces/renderkit/html/scripts/modalPanel.js 2007-05-10 18:25:35 UTC (rev 727) @@ -107,6 +107,7 @@ this.cursorDiv = $(id + "CursorDiv"); this.cdiv = $(id + "CDiv"); this.contentDiv = $(id + "ContentDiv"); + this.shadowDiv = $(id + "ShadowDiv"); this.context = new ModalPanel.Context(this); @@ -294,6 +295,7 @@ this.iframe.style.width = options.width + 'px'; } this.contentDiv.style.width = options.width + 'px'; + this.shadowDiv.style.width = options.width + 'px'; } if (options.height) { @@ -305,6 +307,7 @@ this.iframe.style.height = options.height + 'px'; } this.contentDiv.style.height = options.height + 'px'; + this.shadowDiv.style.height = options.height + 'px'; } if (options.left) { Modified: trunk/richfaces/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx =================================================================== --- trunk/richfaces/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx 2007-05-10 18:23:11 UTC (rev 726) +++ trunk/richfaces/modal-panel/src/main/templates/org/richfaces/htmlModalPanel.jspx 2007-05-10 18:25:35 UTC (rev 727) @@ -1,6 +1,6 @@ <?xml version="1.0" encoding="UTF-8"?> -<f:root - xmlns:f="http://ajax4jsf.org/cdk/template" +<f:template + xmlns:f="http:/jsf.exadel.com/template" xmlns:c=" http://java.sun.com/jsf/core" xmlns:ui=" http://ajax4jsf.org/cdk/ui" xmlns:u=" http://ajax4jsf.org/cdk/u" @@ -65,6 +65,10 @@ } ]]> </jsp:scriptlet> + + <div id="#{clientId}ShadowDiv" class="dr-mpnl-shadow rich-mpnl-shadow" + style="#{component.shadowStyle}" > + </div> <div style="position: absolute; overflow: hidden; z-index: 2;" class="dr-mpnl-pnl" id="#{clientId}ContentDiv"> @@ -127,4 +131,4 @@ </div> </div> -</f:root> \ No newline at end of file +</f:template> \ No newline at end of file