You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Vit Rozkovec <wi...@rozkovec.info> on 2007/10/06 17:35:20 UTC

TabbedPanel with image tabs

Good day,
I would like to have a possibility to have a small image next to the 
text in tab in the TabbedPanel.
How can I contribute this feature to Wicket? To have a constructor like
public AbstractTab(IModel title, ResourceReference image)?

Vitek

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs - how to contribute ?

Posted by Gwyn Evans <gw...@gmail.com>.
On Friday, October 12, 2007, 12:20:54 PM, Stefan <st...@gmail.com> wrote:

> Thank you, 
> I added new article:
> http://cwiki.apache.org/confluence/display/WICKET/Tabs+with+image

> but the last problem is, that I copied the article from one place to another
> (better location), but now
> I want to delete the the first article, because both are the same now.
> (ARTICLE I WANT TO DELETE IS 
> http://cwiki.apache.org/confluence/display/WICKET/TabbedPanel+with+image+tabs)

> .. and there is a problem with message: "You do not have permission"

> Who can I contact to delete the unwanted doubled article ?

  Done & thanks for the article - The reason for the restriction is
  that it's not as easy to recover the page as to revert an edit, so
  requires some admin-ish privs.

/Gwyn


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs - how to contribute ?

Posted by Vit Rozkovec <wi...@rozkovec.info>.
That's great!

I added to the article a different approach - custom image in every tab :)

Regards
Vitek

Stefan Simik wrote:
> Thank you, 
> I added new article:
> http://cwiki.apache.org/confluence/display/WICKET/Tabs+with+image
>
> but the last problem is, that I copied the article from one place to another
> (better location), but now
> I want to delete the the first article, because both are the same now.
> (ARTICLE I WANT TO DELETE IS 
> http://cwiki.apache.org/confluence/display/WICKET/TabbedPanel+with+image+tabs)
>
> .. and there is a problem with message: "You do not have permission"
>
> Who can I contact to delete the unwanted doubled article ?
>   


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs - how to contribute ?

Posted by Stefan Simik <st...@gmail.com>.
Thank you, 
I added new article:
http://cwiki.apache.org/confluence/display/WICKET/Tabs+with+image

but the last problem is, that I copied the article from one place to another
(better location), but now
I want to delete the the first article, because both are the same now.
(ARTICLE I WANT TO DELETE IS 
http://cwiki.apache.org/confluence/display/WICKET/TabbedPanel+with+image+tabs)

.. and there is a problem with message: "You do not have permission"

Who can I contact to delete the unwanted doubled article ?
-- 
View this message in context: http://www.nabble.com/TabbedPanel-with-image-tabs-tf4580281.html#a13173414
Sent from the Wicket - User mailing list archive at Nabble.com.


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs - how to contribute ?

Posted by Erik van Oosten <e....@chello.nl>.
Easy!

Go to http://cwiki.apache.org/WICKET/, click on Edit page, get yourself 
an account. After you've logged in go back to the main page, then find 
the page called 'Reference Library', with at the bottom 'Wicket 
Reference'. Find a suitable place there to describe the TabbedPanel.

Good work!
    Erik.


Stefan Simik wrote:
> very good idea :)
> How can I contribute ? ..or where can I send example with full sources ?
>   

-- 
Erik van Oosten
http://2008.rubyenrails.nl/
http://day-to-day-stuff.blogspot.com/


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs - how to contribute ?

Posted by Stefan Simik <st...@gmail.com>.
very good idea :)
How can I contribute ? ..or where can I send example with full sources ?
-- 
View this message in context: http://www.nabble.com/TabbedPanel-with-image-tabs-tf4580281.html#a13142733
Sent from the Wicket - User mailing list archive at Nabble.com.


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs

Posted by Erik van Oosten <e....@chello.nl>.
Something for the wiki component reference?

Regards,
    Erik.


Stefan Simik wrote:
> Example for AjaxTabbedPanel: 
>
>
> 1. create new Link with image - different for selected and different for
> unselected tab
>
> MyAjaxFallbackLink.java
>
> ------------------------------------------------
>
>
> public class MyAjaxFallbackLink extends AjaxFallbackLink {
>
> 	public MyAjaxFallbackLink(String id, boolean isSelectedTab) {
> 		super(id);
>
> 		Image image;
>
> 		if (isSelectedTab){
> 			image = new Image("image", new
> ResourceReference(MyAjaxFallbackLink.class, "inner-image_selected.gif"));
> 		}else{
> 			image = new Image("image", new
> ResourceReference(MyAjaxFallbackLink.class, "inner-image_unselected.gif"));
> 		}
> 		
> 		add(image);
> 		
> 	}
>
> 	public void onClick(AjaxRequestTarget target) {
> 		//really nothing here -> to override
> 	}
> }
>
>
>
> 2. override newLink() in AjaxTabbedPanel to return your link
>
> MyAjaxTabbedPanel.java
>
> ------------------------------------------------
>
>
> public class MyAjaxTabbedPanel extends AjaxTabbedPanel {
>
> 	public MyAjaxTabbedPanel(String id, List tabs) {
> 		super(id, tabs);
> 		setSelectedTab(0);     //make sure, the first selected tab has index=0.
> Important for image in first selected tab!
> 	}
>
> 	protected WebMarkupContainer newLink(String linkId, final int index) {
> 		int selectedTab = getSelectedTab();
> 		boolean selected = (index == selectedTab);
> 		
> 		return new MyAjaxFallbackLink(linkId, selected)
> 		{
> 			private static final long serialVersionUID = 1L;
>
> 			public void onClick(AjaxRequestTarget target)
> 			{
> 				setSelectedTab(index);
> 				if (target != null)
> 				{
> 					target.addComponent(MyAjaxTabbedPanel.this);
> 				}
> 				onAjaxUpdate(target);
> 			}
> 		}; 
> 	}
>
> }
>
>
>
>
> 3. copy html code from TabbedPanel.html and extend with image to pass
> hierarchy
>
>  MyAjaxTabbedPanel.html 
>
> ------------------------------------------------
>
>
> &lt;wicket:panel&gt;
>
> &lt;div wicket:id="tabs-container" class="tab-row"&gt;
> &lt;ul&gt;
> 	&lt;li wicket:id="tabs"&gt;
> 		&lt;a href="#" wicket:id="link"&gt;&lt;img wicket:id="image"
> class="left-image"/&gt;&lt;span wicket:id="title"&gt;[[tab
> title]]&lt;/span>&lt;/a&gt;
> 	&lt;/li&gt;
> &lt;/ul&gt;
> &lt;/div&gt;
> &lt;div wicket:id="panel" class="tab-panel"&gt;[panel]&lt;/div&gt;
>
>
>
>
>   

-- 
Erik van Oosten
http://2008.rubyenrails.nl/
http://day-to-day-stuff.blogspot.com/


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs

Posted by Stefan Simik <st...@gmail.com>.
Example for AjaxTabbedPanel: 


1. create new Link with image - different for selected and different for
unselected tab

MyAjaxFallbackLink.java

------------------------------------------------


public class MyAjaxFallbackLink extends AjaxFallbackLink {

	public MyAjaxFallbackLink(String id, boolean isSelectedTab) {
		super(id);

		Image image;

		if (isSelectedTab){
			image = new Image("image", new
ResourceReference(MyAjaxFallbackLink.class, "inner-image_selected.gif"));
		}else{
			image = new Image("image", new
ResourceReference(MyAjaxFallbackLink.class, "inner-image_unselected.gif"));
		}
		
		add(image);
		
	}

	public void onClick(AjaxRequestTarget target) {
		//really nothing here -> to override
	}
}



2. override newLink() in AjaxTabbedPanel to return your link

MyAjaxTabbedPanel.java

------------------------------------------------


public class MyAjaxTabbedPanel extends AjaxTabbedPanel {

	public MyAjaxTabbedPanel(String id, List tabs) {
		super(id, tabs);
		setSelectedTab(0);     //make sure, the first selected tab has index=0.
Important for image in first selected tab!
	}

	protected WebMarkupContainer newLink(String linkId, final int index) {
		int selectedTab = getSelectedTab();
		boolean selected = (index == selectedTab);
		
		return new MyAjaxFallbackLink(linkId, selected)
		{
			private static final long serialVersionUID = 1L;

			public void onClick(AjaxRequestTarget target)
			{
				setSelectedTab(index);
				if (target != null)
				{
					target.addComponent(MyAjaxTabbedPanel.this);
				}
				onAjaxUpdate(target);
			}
		}; 
	}

}




3. copy html code from TabbedPanel.html and extend with image to pass
hierarchy

 MyAjaxTabbedPanel.html 

------------------------------------------------


&lt;wicket:panel&gt;

&lt;div wicket:id="tabs-container" class="tab-row"&gt;
&lt;ul&gt;
	&lt;li wicket:id="tabs"&gt;
		&lt;a href="#" wicket:id="link"&gt;&lt;img wicket:id="image"
class="left-image"/&gt;&lt;span wicket:id="title"&gt;[[tab
title]]&lt;/span>&lt;/a&gt;
	&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;div wicket:id="panel" class="tab-panel"&gt;[panel]&lt;/div&gt;




-- 
View this message in context: http://www.nabble.com/TabbedPanel-with-image-tabs-tf4580281.html#a13132005
Sent from the Wicket - User mailing list archive at Nabble.com.

Re: TabbedPanel with image tabs

Posted by Vit Rozkovec <wi...@rozkovec.info>.
Thank you,
I will have a look at it.

Vitek

Fabio Fioretti wrote:
> On 10/7/07, Erik van Oosten <e....@chello.nl> wrote:
>   
>> You can override a method on TabbedPanel to create the component that is
>> put in the tab.
>> I can not look it up now, but can do so later if you want.
>>     
>
> The method you are talking about is newLink.
>
>
> Kindest regards,
>
> Fabio Fioretti - WindoM
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>   


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs

Posted by Fabio Fioretti <wi...@gmail.com>.
On 10/7/07, Erik van Oosten <e....@chello.nl> wrote:
> You can override a method on TabbedPanel to create the component that is
> put in the tab.
> I can not look it up now, but can do so later if you want.

The method you are talking about is newLink.


Kindest regards,

Fabio Fioretti - WindoM

---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org


Re: TabbedPanel with image tabs

Posted by Erik van Oosten <e....@chello.nl>.
Hello Vitek,

You can override a method on TabbedPanel to create the component that is 
put in the tab.
I can not look it up now, but can do so later if you want.

Regards,
     Erik.


Vit Rozkovec schreef:
> Good day,
> I would like to have a possibility to have a small image next to the 
> text in tab in the TabbedPanel.
> How can I contribute this feature to Wicket? To have a constructor like
> public AbstractTab(IModel title, ResourceReference image)?
>
> Vitek
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>

-- 
Erik van Oosten
http://2008.rubyenrails.nl/
http://day-to-day-stuff.blogspot.com/


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org