Re: [Wicket-user] State selection from imagemap
I know this is long winded, and I apologize. But it would be nice to know the best way to deal with a large imagemap like this. I would be happy to post this information on the wiki, but I don't want to do it if there are better solutions. So any advice would be appreciated. Tbh, I never use image maps myself, so I wouldn't be able to give you advice backed by experience. If you think your component would be a good addition, we could consider putting it in Wicket. For instance as part of the wicket-stuff mini's project, or if you think it really solves a common problem, we could vote to see whether we could put it in wicket-extensions. If you think this makes sense, please open up a JIRA issue and attache your sources (preferably as a patch). Thanks, Eelco - This SF.net email is sponsored by DB2 Express Download DB2 Express C - the FREE version of DB2 express and take control of your XML. No limits. Just data. Click to get it now. http://sourceforge.net/powerbar/db2/ ___ Wicket-user mailing list Wicket-user@lists.sourceforge.net https://lists.sourceforge.net/lists/listinfo/wicket-user
Re: [Wicket-user] State selection from imagemap
You could use the image map component (see the example in
org.apache.wicket.examples.linkomatic), but that would indeed result
in a lot of components for not that much gains.
I'm pretty sure that at least in Wicket 1.3 you don't need to put the
servlet context in your hrefs yourself, as Wicket will automatically
prepend that for you. Which version are you using, and did you try it
without?
Eelco
On 6/19/07, Tauren Mills [EMAIL PROTECTED] wrote:
I'm wondering if I should wicketize this form, or leave it as a
basic html form and would like to hear your thoughts.
I have a map of the USA with an imagemap. Clicking onto a state goes
to another page that displays a list of metro areas in the state.
img src=img/map.png usemap=#map border=0 alt=US Map/
map id=map name=map
area shape=poly alt=Maine
coords=409,19,403,43,411,64,433,39,416,17 href=app/lookup/state/ME
title=Maine/
area shape=poly alt=New Hampshire coords=401,43,399,69,411,65
href=app/lookup/state/NH title=New Hampshire/
area shape=poly alt=Vermont
coords=400,47,388,48,393,70,398,69 href=app/lookup/state/VT
title=Vermont/
...
/map
I did this by using a bookmarkable page with pageparameters:
mountBookmarkablePage(/lookup, StateLookupPage.class);
---
public StateLookupPage(PageParameters params) {
super(params);
String state = (String) params.get(state);
add(new Label(state,state));
}
The main issue I have with this is I have hardcoded my servlet context
(app) into the HTML, so changing my web.xml will require lots of
html edits.
And I also want to have a drop down select of all states and have it
get to the same place as clicking on the map. The following form
using either post or get doesn't work:
form action=lookup method=post name=StateForm
select name=state id=state
option selected=selected value=Choose State.../option
option value=ALAlabama/option
option value=AKAlaska/option
option value=AZArizona/option
...
/select
/form
So my first thought is to make the form a wicket form with a wicket
DropDownChoice component, but then I'm unclear of the best way to make
the imagemap go to the same place. There are about 70 polygons in the
imagemap, and making them all wicket components seems overkill. Or is
that really the best way to deal with this?
Thanks,
Tauren
-
This SF.net email is sponsored by DB2 Express
Download DB2 Express C - the FREE version of DB2 express and take
control of your XML. No limits. Just data. Click to get it now.
http://sourceforge.net/powerbar/db2/
___
Wicket-user mailing list
Wicket-user@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/wicket-user
-
This SF.net email is sponsored by DB2 Express
Download DB2 Express C - the FREE version of DB2 express and take
control of your XML. No limits. Just data. Click to get it now.
http://sourceforge.net/powerbar/db2/
___
Wicket-user mailing list
Wicket-user@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/wicket-user
Re: [Wicket-user] State selection from imagemap
Eelco,
Thanks for the reply!
You could use the image map component (see the example in
org.apache.wicket.examples.linkomatic), but that would indeed result
in a lot of components for not that much gains.
The problem with the ImageMap component is that it doesn't support alt
and title parameters, and I need those. This site is for seniors and
needs to be accessible.
I'm pretty sure that at least in Wicket 1.3 you don't need to put the
servlet context in your hrefs yourself, as Wicket will automatically
prepend that for you. Which version are you using, and did you try it
without?
I'm currently using 1.2.6. The imagemap is on the home page, and I
was finding that the links worked correctly from my home page's
mountBookmarkablePage path, but if a link component took the user back
to the home page, then the path wouldn't work.
Because of the problems I was having, I ended up wicketizing the whole
thing. I'm not convinced that this is the best solution, and it does
mean a whole lot of components are generated for the home page. I'd
appreciate any feedback on this solution. I can post full code
somewhere too if desired.
The solution output is similar to this:
form id=usamap_form name=State
action=/db/app?wicket:interface=:1:usamap:form::IFormSubmitListener
method=post wicket:id=formdiv style=display:noneinput
type=hidden name=usamap_form:hf:0 id=usamap_form:hf:0 //div
select id=state name=state wicket:id=state
option selected=selected value=Choose One/option
option value=0ALASKA/option
...
/select
map id=map name=map
area title=ALASKA
coords=20,200,11,219,11,249,17,287,90,256,77,198,42,188 alt=ALASKA
shape=poly href=/db/app/lookup/state/AK wicket:id=repeating/
...
/map
To fully wicketize this image map, I have a custom TreeMap called
StateMap that maps state abbreviations to State objects. The State
objects have name, abbreviation, and a List of Area objects (some
States need more than one polygon Area). The Area objects have shape
and coordinates attributes. StateMap has a getAreas() method that
returns a List of all the Area objects in all of the State objects.
To create the DropDownChoice, I just get a list from the TreeMap's
values and create a DropDownChoice with it:
StateMap.getStates() {
return (List) new ArrayListState(abbrevMap.values());
}
StateSelectForm(String id, StateMap stateMap) {
add(new DropDownChoice(state,new
PropertyModel(this,state),stateMap.getStates()));
}
To create the imagemap, I use a RepeatingView and iterate through the
list of Area objects returned by StateMap.getAreas(). I create a
WebMarkupContainer for each area tag and add AttributeModifiers to
it for alt, title, shape, coords, and href. All of these
just access properties of either the State or Area objects, except for
href, where I do this:
// Get the State object for the abbreviation
final State state = stateMap.getAbbreviation(abbrev);
...
item.add(new AttributeModifier(href, true, new AbstractReadOnlyModel()
{
public Object getObject(Component component)
{
// return a URL to StateLookupPage with parameters of state=abbrev
return urlFor(StateLookupPage.class, new
PageParameters(state=+state.getAbbreviation()));
}
}));
Lastly, the StateLookupPage has two constructors, one to handle the
form and another to handle the imagemap. When the form is submitted,
the selected State object is put into the session. When the imagemap
is clicked, the selected state is passed as a parameter.
I know this is long winded, and I apologize. But it would be nice to
know the best way to deal with a large imagemap like this. I would be
happy to post this information on the wiki, but I don't want to do it
if there are better solutions. So any advice would be appreciated.
Thanks,
Tauren
Eelco
On 6/19/07, Tauren Mills [EMAIL PROTECTED] wrote:
I'm wondering if I should wicketize this form, or leave it as a
basic html form and would like to hear your thoughts.
I have a map of the USA with an imagemap. Clicking onto a state goes
to another page that displays a list of metro areas in the state.
img src=img/map.png usemap=#map border=0 alt=US Map/
map id=map name=map
area shape=poly alt=Maine
coords=409,19,403,43,411,64,433,39,416,17 href=app/lookup/state/ME
title=Maine/
area shape=poly alt=New Hampshire coords=401,43,399,69,411,65
href=app/lookup/state/NH title=New Hampshire/
area shape=poly alt=Vermont
coords=400,47,388,48,393,70,398,69 href=app/lookup/state/VT
title=Vermont/
...
/map
I did this by using a bookmarkable page with pageparameters:
mountBookmarkablePage(/lookup, StateLookupPage.class);
---
public StateLookupPage(PageParameters params) {
super(params);
String state = (String) params.get(state);
add(new Label(state,state));
}
The main issue I have with this is I have hardcoded my servlet context
(app) into the HTML, so changing my
[Wicket-user] State selection from imagemap
I'm wondering if I should wicketize this form, or leave it as a
basic html form and would like to hear your thoughts.
I have a map of the USA with an imagemap. Clicking onto a state goes
to another page that displays a list of metro areas in the state.
img src=img/map.png usemap=#map border=0 alt=US Map/
map id=map name=map
area shape=poly alt=Maine
coords=409,19,403,43,411,64,433,39,416,17 href=app/lookup/state/ME
title=Maine/
area shape=poly alt=New Hampshire coords=401,43,399,69,411,65
href=app/lookup/state/NH title=New Hampshire/
area shape=poly alt=Vermont
coords=400,47,388,48,393,70,398,69 href=app/lookup/state/VT
title=Vermont/
...
/map
I did this by using a bookmarkable page with pageparameters:
mountBookmarkablePage(/lookup, StateLookupPage.class);
---
public StateLookupPage(PageParameters params) {
super(params);
String state = (String) params.get(state);
add(new Label(state,state));
}
The main issue I have with this is I have hardcoded my servlet context
(app) into the HTML, so changing my web.xml will require lots of
html edits.
And I also want to have a drop down select of all states and have it
get to the same place as clicking on the map. The following form
using either post or get doesn't work:
form action=lookup method=post name=StateForm
select name=state id=state
option selected=selected value=Choose State.../option
option value=ALAlabama/option
option value=AKAlaska/option
option value=AZArizona/option
...
/select
/form
So my first thought is to make the form a wicket form with a wicket
DropDownChoice component, but then I'm unclear of the best way to make
the imagemap go to the same place. There are about 70 polygons in the
imagemap, and making them all wicket components seems overkill. Or is
that really the best way to deal with this?
Thanks,
Tauren
-
This SF.net email is sponsored by DB2 Express
Download DB2 Express C - the FREE version of DB2 express and take
control of your XML. No limits. Just data. Click to get it now.
http://sourceforge.net/powerbar/db2/
___
Wicket-user mailing list
Wicket-user@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/wicket-user
