You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@myfaces.apache.org by Simon Lessard <si...@gmail.com> on 2007/09/12 21:09:35 UTC
[TRINIDAD] StatusIndicator improvement
Hi all,
I would like to add two facets to statusIndicator: "busy" and "ready", each
with an attached styleClass placed on a child span element. I think it would
make the component much more customizable as it would allow something like:
<tr:statusIndicator>
<f:facet name="busy">
<tr:outputText value="Loading, please wait..."/>
</f:facet>
</tr:statusIndicator>
and in the skin:
af|statusIndicator::busy
{
border-color: black;
border-style: outset;
border-width: 2px;
display: block;
margin: auto;
position: absolute;
top: 45%;
text-align: center;
vertical-align: middle;
}
af|statusIndicator::ready
{
}
The icon would still be supported and placed in the parent span, at the same
place than now. The generated markup would thus look like:
<span>
<span id="clientId::ready">
<img src="readyIcon"/>
<span class="af_statusIndicator_ready">
("ready" facet content)
</span>
</span>
<span id="clientId::busy">
<img src="budyIcon"/>
<span class="af_statusIndicator_busy">
("busy" facet content)
</span>
</span>
</span>
Anyone's ok with that or has a better idea?
~ Simon
Re: [TRINIDAD] StatusIndicator improvement
Posted by Adam Winer <aw...@gmail.com>.
I like the facets a lot too, but I'm not thrilled with adding
extra JS attributes when we already have a JS hook.
Two ways of doing things only makes sense when the second
is much easier, not just marginally easier.
-- Adam
On 9/12/07, Andrew Robinson <an...@gmail.com> wrote:
>
> +1 great idea
>
> I would also like to suggest javascript support as well:
>
> <tr:statusIndicator onbusy="alert('starting ajax');"
> onready="alert('ajax done');" />
>
> This would probably be a simple hook around:
> TrPage.getInstance().getRequestQueue().addStateChangeListener(func);
>
> But it would be easier to have it on the component.
>
>
> On 9/12/07, Simon Lessard <si...@gmail.com> wrote:
> > Hi all,
> >
> > I would like to add two facets to statusIndicator: "busy" and "ready",
> each
> > with an attached styleClass placed on a child span element. I think it
> would
> > make the component much more customizable as it would allow something
> like:
> >
> > <tr:statusIndicator>
> > <f:facet name="busy">
> > <tr:outputText value="Loading, please wait..."/>
> > </f:facet>
> > </tr:statusIndicator>
> >
> > and in the skin:
> >
> > af|statusIndicator::busy
> > {
> > border-color: black;
> > border-style: outset;
> > border-width: 2px;
> > display: block;
> > margin: auto;
> > position: absolute;
> > top: 45%;
> > text-align: center;
> > vertical-align: middle;
> > }
> >
> > af|statusIndicator::ready
> > {
> > }
> >
> > The icon would still be supported and placed in the parent span, at the
> same
> > place than now. The generated markup would thus look like:
> >
> > <span>
> > <span id="clientId::ready">
> > <img src="readyIcon"/>
> > <span class="af_statusIndicator_ready">
> > ("ready" facet content)
> > </span>
> > </span>
> > <span id="clientId::busy">
> > <img src="budyIcon"/>
> > <span class="af_statusIndicator_busy">
> > ("busy" facet content)
> > </span>
> > </span>
> > </span>
> >
> >
> > Anyone's ok with that or has a better idea?
> >
> > ~ Simon
> >
>
Re: [TRINIDAD] StatusIndicator improvement
Posted by Andrew Robinson <an...@gmail.com>.
+1 great idea
I would also like to suggest javascript support as well:
<tr:statusIndicator onbusy="alert('starting ajax');"
onready="alert('ajax done');" />
This would probably be a simple hook around:
TrPage.getInstance().getRequestQueue().addStateChangeListener(func);
But it would be easier to have it on the component.
On 9/12/07, Simon Lessard <si...@gmail.com> wrote:
> Hi all,
>
> I would like to add two facets to statusIndicator: "busy" and "ready", each
> with an attached styleClass placed on a child span element. I think it would
> make the component much more customizable as it would allow something like:
>
> <tr:statusIndicator>
> <f:facet name="busy">
> <tr:outputText value="Loading, please wait..."/>
> </f:facet>
> </tr:statusIndicator>
>
> and in the skin:
>
> af|statusIndicator::busy
> {
> border-color: black;
> border-style: outset;
> border-width: 2px;
> display: block;
> margin: auto;
> position: absolute;
> top: 45%;
> text-align: center;
> vertical-align: middle;
> }
>
> af|statusIndicator::ready
> {
> }
>
> The icon would still be supported and placed in the parent span, at the same
> place than now. The generated markup would thus look like:
>
> <span>
> <span id="clientId::ready">
> <img src="readyIcon"/>
> <span class="af_statusIndicator_ready">
> ("ready" facet content)
> </span>
> </span>
> <span id="clientId::busy">
> <img src="budyIcon"/>
> <span class="af_statusIndicator_busy">
> ("busy" facet content)
> </span>
> </span>
> </span>
>
>
> Anyone's ok with that or has a better idea?
>
> ~ Simon
>
Re: [TRINIDAD] StatusIndicator improvement
Posted by Simon Lessard <si...@gmail.com>.
Hi Jeanne,
statusIndicator already does that on clientId::ready and clientId::busy
elements, the skin won't have to do it.
~ Simon
On 9/12/07, Jeanne Waldman <je...@oracle.com> wrote:
>
> Do you plan to toggle the styleclass display property depending upon the
> state?
>
> Simon Lessard wrote:
>
> Hi all,
>
> I would like to add two facets to statusIndicator: "busy" and "ready",
> each with an attached styleClass placed on a child span element. I think it
> would make the component much more customizable as it would allow something
> like:
>
> <tr:statusIndicator>
> <f:facet name="busy">
> <tr:outputText value="Loading, please wait..."/>
> </f:facet>
> </tr:statusIndicator>
>
> and in the skin:
>
> af|statusIndicator::busy
> {
> border-color: black;
> border-style: outset;
> border-width: 2px;
> display: block;
> margin: auto;
> position: absolute;
> top: 45%;
> text-align: center;
> vertical-align: middle;
> }
>
> af|statusIndicator::ready
> {
> }
>
> The icon would still be supported and placed in the parent span, at the
> same place than now. The generated markup would thus look like:
>
> <span>
> <span id="clientId::ready">
> <img src="readyIcon"/>
> <span class="af_statusIndicator_ready">
> ("ready" facet content)
> </span>
> </span>
> <span id="clientId::busy">
> <img src="budyIcon"/>
> <span class="af_statusIndicator_busy">
> ("busy" facet content)
> </span>
> </span>
> </span>
>
>
> Anyone's ok with that or has a better idea?
>
> ~ Simon
>
>