Ernesto, Sebastien, Isn't that a good addition to WIquery/Wicket-JQuery-UI libraries ? JQuery UI provides many more effects.
On Fri, Feb 22, 2013 at 1:18 PM, Ernesto Reinaldo Barreiro < reier...@gmail.com> wrote: > Martin, > > I have made this code publicly available (with some minor improvements at > like make effects "pluggable") here > > > https://github.com/reiern70/antilia-bits/blob/master/wicket-replace-with-effect/src/main/java/com/antilia/replacewitheffect/ReplaceWithEffectBehavior.java > > an example of how to use it can be found at > > > https://github.com/reiern70/antilia-bits/blob/master/wicket-replace-with-effect/src/test/java/com/antilia/replacewitheffect/HomePage.java > > > Cheers. > > Ernesto > > > On Thu, Feb 21, 2013 at 8:31 PM, Martin Grigorov <mgrigo...@apache.org > >wrote: > > > Well done, Ernesto! > > > > > > On Thu, Feb 21, 2013 at 9:13 PM, Ernesto Reinaldo Barreiro < > > reier...@gmail.com> wrote: > > > > > Martin, > > > > > > Thanks for sharing! > > > > > > Inspired by your article I came up with following behavior that will: > > > > > > 1-Make component appear when appear when page is loaded. > > > 2-Have the same effect you describe on your Blog for AJAX request, > > > > > > > > > import org.apache.wicket.Component; > > > import org.apache.wicket.ajax.AjaxRequestTarget; > > > import org.apache.wicket.behavior.Behavior; > > > import org.apache.wicket.markup.ComponentTag; > > > import org.apache.wicket.markup.head.IHeaderResponse; > > > import org.apache.wicket.markup.head.OnDomReadyHeaderItem; > > > > > > /** > > > * @author Ernesto Reinaldo Barreiro (reiern70) > > > * > > > */ > > > public class ReplaceWithEffectBehavior extends Behavior { > > > > > > private static final long serialVersionUID = 1L; > > > > > > /** > > > * Constructor. > > > */ > > > public ReplaceWithEffectBehavior() { > > > } > > > @Override > > > public void bind(Component component) { > > > component.setOutputMarkupId(true); > > > } > > > > > > @Override > > > public void onComponentTag(Component component, ComponentTag tag) { > > > String style = tag.getAttribute("style"); > > > if(style == null || style.indexOf("display: none;") < 0) { > > > tag.append("style", "display: none;", ";"); > > > } > > > } > > > @Override > > > public void renderHead(Component component, IHeaderResponse response) { > > > AjaxRequestTarget target = > > > component.getRequestCycle().find(AjaxRequestTarget.class); > > > if(target != null) { > > > target.prependJavaScript("notify|if(jQuery('#" + > component.getMarkupId() > > + > > > "').length != 0){jQuery('#" + component.getMarkupId() + > "').slideUp(1000, > > > notify);}"); > > > > > > > > > target.appendJavaScript("jQuery('#"+component.getMarkupId()+"').slideDown(1000);"); > > > } else { > > > > > > > > > response.render(OnDomReadyHeaderItem.forScript("jQuery('#"+component.getMarkupId()+"').slideDown(1000);")); > > > } > > > } > > > } > > > > > > How to use it. > > > > > > public class TestSlideDown extends WebPage { > > > > > > private static final long serialVersionUID = 1L; > > > > > > private WebMarkupContainer slideDown; > > > /** > > > * > > > */ > > > public TestSlideDown() { > > > add(slideDown = new WebMarkupContainer("slideDown")); > > > slideDown.add(new ReplaceWithEffectBehavior()); > > > add(new AjaxLink<Void>("link") { > > > /** > > > * > > > */ > > > private static final long serialVersionUID = 1L; > > > > > > @Override > > > public void onClick(AjaxRequestTarget target) { > > > target.add(slideDown); > > > } > > > }); > > > } > > > > > > } > > > > > > and > > > > > > <!DOCTYPE html> > > > <html xmlns:wicket="http://wicket.apache.org";> > > > <head> > > > <title>Test</title> > > > <style type="text/css"> > > > .Test { > > > width: 200px; > > > background: red; > > > border: 1px solid black; > > > } > > > </style> > > > </head> > > > <body> > > > <div wicket:id="slideDown" class="Test"> > > > Test > > > </div> > > > <p> > > > <a wicket:id="link">Repaint via AJAX</a> > > > </p> > > > </body> > > > </html> > > > > > > Cheers, > > > > > > Ernesto > > > > > > On Thu, Feb 21, 2013 at 4:04 PM, Martin Grigorov <mgrigo...@apache.org > > > >wrote: > > > > > > > Hi, > > > > > > > > While fixing WICKET-5039 I've created an application that > demonstrates > > > how > > > > to replace a component with animation effect and blogged about it at > > > > http://wicketinaction.com/2013/02/replace-components-with-animation/ > > > > > > > > I hope you find it useful! > > > > > > > > -- > > > > Martin Grigorov > > > > jWeekend > > > > Training, Consulting, Development > > > > http://jWeekend.com <http://jweekend.com/> > > > > > > > > > > > > > > > -- > > Martin Grigorov > > jWeekend > > Training, Consulting, Development > > http://jWeekend.com <http://jweekend.com/> > > > > > > -- > Regards - Ernesto Reinaldo Barreiro > Antilia Soft > http://antiliasoft.com/ <http://antiliasoft.com/antilia> > -- Martin Grigorov jWeekend Training, Consulting, Development http://jWeekend.com <http://jweekend.com/>
