Implementing javascript events to Wicket - java

I'm new to ria-development and working with the Ajax Slider example. I can't figure out how to work with javascript events. Here in the example the onValueChanged-event is preimplemented. How do I implement say onchange- or onSlider-event?
All help greatly appreciated!
public abstract class AjaxSlider extends WebMarkupContainer {
private static final long serialVersionUID = 1L;
public AjaxSlider(String id) {
super(id);
super.setOutputMarkupId(true);
}
public JQUIComponentBehaivor<SliderOptions> getSlideBehaviors() {
List behaviors = getBehaviors();
for(Object behavior : behaviors){
if(behavior instanceof SliderBehavior)
return (SliderBehavior) behavior;
}
return null;
}
public abstract void onValueChanged(AjaxRequestTarget target,
int newValue);
#Override
protected void onInitialize() {
super.onInitialize();
AbstractDefaultAjaxBehavior ajaxBehavior =
new AbstractDefaultAjaxBehavior() {
private static final long serialVersionUID = 1L;
#Override
protected void respond(AjaxRequestTarget target) {
String sliderValue = RequestCycle.get().getRequest()
.getParameter("sv");
if (Utils.isNotBlank(sliderValue)) {
onValueChanged(target, Integer.valueOf(sliderValue));
}
}
};
super.add(ajaxBehavior);
super.add(new SliderBehavior(new SliderOptions()
.changeEvent(wicketAjaxGet(
ajaxBehavior,
new MapBuilder<String, Object>().add("sv",
js("ui.value")).build()))));
}
}

The example you gave adds an event handler for the change event. What this event handler does is issueing a GET request to the ajaxBehaviordefined above. The behavior then extracts the slider value from the GET parameters and calls onValueChanged.
You can add another event handler just like this to SliderOptions. For instance:
.slideEvent(
wicketAjaxGet(ajaxBehavior,
new MapBuilder<String, Object>()
.add("sv", js("ui.value")).build()))));
This handler should call the ajax behavior any time the user moves the slider.

Related

Wicket : CheckBoxMultipleChoice is not saving values in model object

My code looks like this
html
< div wicket:id="metroEthernetChildchkLeft">
java code
initializing CheckBoxMultipleChoice in constructor and then later setting the values of list and model using setter methods
class <some name>
private CheckBoxMultipleChoice<String> metroEthernetChildchkLeft;
<constructor>()
{ metroEthernetChildchkLeft = new CheckBoxMultipleChoice<String>("metroEthernetChildchkLeft");
metroEthernetChildchkLeft.setMarkupId("metroEthernetChildchkLeftId");
metroEthernetChildchkLeft.add(AttributeModifier.prepend("load", "javascript:addMargin(metroEthernetChildchkLeftId);"));
metroEthernetChildchkLeft.setEnabled(false);
commentTechSpeedMetroEthernetListView.add(metroEthernetChildchkLeft);
add(new IndicatingAjaxButton("submitChoiceCmd")
{
private static final long serialVersionUID = 1L;
#Override
protected void onSubmit(AjaxRequestTarget target, Form< ? > form)
{
//// >>>>>>>> updated model value is not coming here <<<<<<
meSpeedSelectLeft = (ArrayList<String>) metaCommentTechSpeedBean.getMeSpeedSelectLeft();
});
}
method()
{
meSpeedSelectLeft = (ArrayList<String>) metaCommentTechSpeedBean.getMeSpeedSelectLeft();
leasedLineChildDivLeft.setDefaultModel(new PropertyModel(metaCommentTechSpeedBean, "llSpeedSelectLeft"));
leasedLineChildDivLeft.setChoices(llSpeedListLeft);
}
i am not able to get checked values [array list of selected checkboxes] in submit method {located in constructor}
Updated :
<div wicket:id="metroEthernetChildchkLeft"></div>
public class MetaCommentTechSpeedChoiceForm extends OForm<MetaCommentTechSpeedBean>
{
private CheckBoxMultipleChoice<String> metroEthernetChildchkLeft;
public MetaCommentTechSpeedChoiceForm(String id)
{
super(id);
metroEthernetChildchkLeft = new CheckBoxMultipleChoice<String>("metroEthernetChildchkLeft");
metroEthernetChildchkLeft.setMarkupId("metroEthernetChildchkLeftId");
metroEthernetChildchkLeft.add(AttributeModifier.prepend("load", "javascript:addMargin(metroEthernetChildchkLeftId);"));
metroEthernetChildchkLeft.setEnabled(false);
commentTechSpeedMetroEthernetListView.add(metroEthernetChildchkLeft);
add(new IndicatingAjaxButton("submitChoiceCmd")
{
private static final long serialVersionUID = 1L;
#Override
protected void onSubmit(AjaxRequestTarget target, Form< ? > form)
{
meSpeedSelectLeft = (ArrayList<String>) metaCommentTechSpeedBean.getMeSpeedSelectLeft(); //// >>>>>>>> updated model value is not coming here <<<<<<
});
}
public void formFunction(final MetaCommentCreationBean metaCommentCreationBean, final Component basicInfoContainer, final Component techSpeedSettingsContainer)
{
meSpeedSelectLeft = (ArrayList<String>) metaCommentTechSpeedBean.getMeSpeedSelectLeft();
leasedLineChildDivLeft.setDefaultModel(new PropertyModel(metaCommentTechSpeedBean, "llSpeedSelectLeft"));
leasedLineChildDivLeft.setChoices(llSpeedListLeft);
}
the problem occurred due to this line
metroEthernetChildchkLeft.setEnabled(false);
i disabled the control and enabling it on frontend using javascript.
Wicket still thinks that the control is disabled and hence not updating the model object.

Event between actors

I'm trying to use events to do something on actor but i don't understand how to do it properly.
I have a button on my screen and a text (just for example). they are both actors in a stage
my purpose is: if i click on the button, i would like to change text
I add listener on my button, i get the click but i don't know how to send event (or anything else) to my text to set it.
Main class with stage definition and his
public class AGame implements ApplicationListener {
private WorldRendererTouchPad renderer;
private Stage stage;
private static Vector3 cameraVelocity=new Vector3(0,0,0);
private ButtonJump button;
public static final int SCREEN_WIDTH=800;
public static final int SCREEN_HEIGHT=480;
public void create() {
stage = new Stage();
stage.setViewport(SCREEN_WIDTH, SCREEN_HEIGHT, true);
stage.getCamera().translate(-stage.getGutterWidth(), -stage.getGutterHeight(), 0);
renderer = new MyRenderer(SCREEN_WIDTH, SCREEN_HEIGHT);
stage.addActor(renderer);
renderer.create();
button=new ButtonJump();
stage.addActor(button);
button.create();
Gdx.input.setInputProcessor(stage);
}
....
resize and other methods
}
MyRenderer class (contains text actor):
public class MyRenderer {
private TextTest text;
public MyRenderer(float screenWidth, float screenHeight) {
setBounds(0, 0, screenWidth, screenHeight);
}
public void create() {
this.initActors();
}
private void initActors() {
text=new TextTest("Hello world!");
addActor(text);
}
// is it usefull?
public void setText(String newText) {
text.setText(newText);
}
}
and the ButtonJump class (extends MyButton just here for define Skin and ButtonStyle)
public class ButtonJump extends MyButton {
public boolean isJump=false;
private static InputListener buttonListener=new InputListener() {
public boolean touchDown (InputEvent event, float x, float y, int pointer, int button) {
Gdx.app.log("event" , "="+event.toString());
// do something to update text
return true;
}
};
public ButtonJump() {
super();
}
public void create() {
this.setPosition(getStage().getWidth()-60, 30);
this.addCaptureListener(buttonListener);
}
public void capture() {
if (this.isJump)
Gdx.app.log("jump button", "Jump is set");
else
Gdx.app.log("jump button", "No jump");
}
}
If you use the clicklistener you need to let the other actor hold an reference to it to call a method on click. It is not that good to let all Actor know of each other. Use an anonymous way.
There is a "common" system for it in games.
If you really want to use Events, do implement an Event-System. Therefore you have an interface Listen and an Interface Event_Handler. At the start of your game you init one Implementation of the Eventhandler. The interface should at least look like this:
public interface Interface_EventHandler extends Disposable
{
public void handleEvent(final Event... e);
public void registerListener(final Interface_Listen listener,
final Event_Type... type);
public void unregisterListener(final Interface_Listen... listener);
public void unregisterAllListener();
public void unregisterAllListener(final Event_Type... type);
public void processEvents();
public void processEvents(final int maxTimeInMS);
}
Okay so now how does it work. The handler has an hashmap with all eventtypes as Key and an list of listeners as Value. So if someone want to notice an event he registers with the registerListerner at the handler for the right Event_Type (Enum). It need to have the interface Listen to get events. Everyone can now push an Event into the handler with the handleEvent(...) method. Or even more than one.. (varargs) ..
Okay that still does not explain how it work. We now have a registered listener (actor for example) and we have events that get into the handler.
Every Rendercycle you call the processEvents() at the hanlder once. That mean that every event that get pushed in at a frame get handled at the next frame. (Asynchronus) While that he iterates over all events and push them to the listeners. Moreover the listener should have a queue too where they put all events and when they are at their .act() they handle the events. (more asynchronus).
Okay here is an Handler i use:
package com.portaaenigma.eventsystem;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.LinkedList;
import com.badlogic.gdx.utils.TimeUtils;
import com.portaaenigma.managers.Logger;
public class EventHandler implements Interface_EventHandler
{
private HashMap> listeners;
private LinkedList events;
public EventHandler()
{
listeners = new HashMap<Event_Type, ArrayList<Interface_Listen>>();
// add the arraylist for every Eventtype
for (Event_Type e : Event_Type.values())
{
listeners.put(e, new ArrayList<Interface_Listen>());
}
events = new LinkedList<Event>();
}
#Override
public void handleEvent(final Event... e)
{
for (Event event : e)
{
events.push(event);
}
}
#Override
public void unregisterListener(final Interface_Listen... listener)
{
for (Event_Type e : Event_Type.values())
{
for (Interface_Listen interface_Listen : listener)
{
listeners.get(e).remove(interface_Listen);
}
}
}
#Override
public void processEvents()
{
while (events.size() != 0)
{
// get the first element and delete it
Event e = events.pop();
for (Interface_Listen l : listeners.get(e.getType()))
{
l.handleEvent(e);
}
}
}
#Override
public void processEvents(final int maxTimeInMS)
{
int startSize = 0;
if (events.size() != 0)
{
startSize = events.size();
Logger.log("Processing Events: " + events.size());
}
long startTime = TimeUtils.millis();
while (events.size() != 0)
{
// get the first element and delete it
Event e = events.pop();
for (Interface_Listen l : listeners.get(e.getType()))
{
l.handleEvent(e);
}
// stop handling if time is up
if (startTime - TimeUtils.millis() > maxTimeInMS)
{
Logger.log("Handled " + (events.size() - startSize) + " Events");
break;
}
}
}
#Override
public void registerListener(final Interface_Listen listener,
Event_Type... type)
{
for (Event_Type event_Type : type)
{
listeners.get(event_Type).add(listener);
}
}
#Override
public void unregisterAllListener()
{
Logger.log("UnregisterAll");
for (Event_Type e : Event_Type.values())
{
listeners.get(e).clear();
}
}
#Override
public void unregisterAllListener(final Event_Type... type)
{
for (Event_Type event_Type : type)
{
listeners.get(event_Type).clear();
}
}
#Override
public void dispose()
{
unregisterAllListener();
events.clear();
listeners.clear();
}
}
The interface for all listeners is simple it's just this:
public interface Interface_Listen
{
public void handleEvent(final Event e);
}
Last but not least the event. How can you now send different data? Quiet simple. Have an hashmap out of Strings and Strings and for sure the EventType.
public class Event
{
private Event_Type type;
private HashMap<String, String> m_messages;
public Event(final Event_Type e, final Event_Message... m)
{
m_messages = new HashMap<String, String>();
for (Event_Message message : m)
{
m_messages.put(message.m_key, message.m_value);
}
type = e;
}
public Event_Type getType()
{
return type;
}
public void addMessages(final Event_Message... m)
{
for (Event_Message event_Message : m)
{
m_messages.put(event_Message.m_key, event_Message.m_value);
}
}
public String getMessage(final String name)
{
if (m_messages.get(name) == null)
{
Logger.error("Message not found: " + name);
}
// if null return an empty string
return m_messages.get(name) != null ? m_messages.get(name) : "";
}
public void clearMessages()
{
m_messages.clear();
}
}
Okay i hope this does explain how to implement an EventSystem at a Game. This meight not be the regular way at other Software but in games you queue up the events and handle them once in a Gameloop cycle. Also the listeners do the same.
So in your case. Implement such an handler and register the actors as listener. Sure they need to implement the listener interface and do something with the event. Let the one actor push an event into the handler which directs to the other actor and your are done. And they event dont need to know of each other and it does work for as much actors as you whish. You can even create 1 event for different classes different actors and so on. Usefull for example at mapchange. You push one event with the notice.. "changemap".. and every actor knows he need to stop moving and every subsystem knows that it does need to stop because of an mapchange and so on ...
It seems to be a bit overkill but it has alot of advantages and worth to use even at early stages. I made the misstake and started using it laterly and now i regret it.
Sorry for the bracing. It's not the regular java standart but more clear i think... Sorry for alot of varargs just like it at that point. Meight be confusing.
Literatur:
Game Coding Complete, Fourth Edition Chapter 11

GWT Editors - how to add N sub-editors of the same type based on a Collection

I have an object, Supply, that can either be an ElecSupply or GasSupply (see related question).
Regardless of which subclass is being edited, they all have a list of BillingPeriods.
I now need to instantiate N number of BillingPeriodEditors based on the contents of that list, and am pretty baffled as to how I should do it.
I am using GWTP. Here is the code of the SupplyEditor I have just got working:
public class SupplyEditor extends Composite implements ValueAwareEditor<Supply>
{
private static SupplyEditorUiBinder uiBinder = GWT.create(SupplyEditorUiBinder.class);
interface SupplyEditorUiBinder extends UiBinder<Widget, SupplyEditor>
{
}
#Ignore
final ElecSupplyEditor elecSupplyEditor = new ElecSupplyEditor();
#Path("")
final AbstractSubTypeEditor<Supply, ElecSupply, ElecSupplyEditor> elecSupplyEditorWrapper = new AbstractSubTypeEditor<Supply, ElecSupply, ElecSupplyEditor>(
elecSupplyEditor)
{
#Override
public void setValue(final Supply value)
{
setValue(value, value instanceof ElecSupply);
if(!(value instanceof ElecSupply))
{
showGasFields();
}
else
{
showElecFields();
}
}
};
#Ignore
final GasSupplyEditor gasSupplyEditor = new GasSupplyEditor();
#Path("")
final AbstractSubTypeEditor<Supply, GasSupply, GasSupplyEditor> gasSupplyEditorWrapper = new AbstractSubTypeEditor<Supply, GasSupply, GasSupplyEditor>(
gasSupplyEditor)
{
#Override
public void setValue(final Supply value)
{
setValue(value, value instanceof GasSupply);
if(!(value instanceof GasSupply))
{
showElecFields();
}
else
{
showGasFields();
}
}
};
#UiField
Panel elecPanel, gasPanel, unitSection;
public SupplyEditor()
{
initWidget(uiBinder.createAndBindUi(this));
gasPanel.add(gasSupplyEditor);
elecPanel.add(elecSupplyEditor);
}
// functions to show and hide depending on which type...
#Override
public void setValue(Supply value)
{
if(value instanceof ElecSupply)
{
showElecFields();
}
else if(value instanceof GasSupply)
{
showGasFields();
}
else
{
showNeither();
}
}
}
Now, as the list of BillingPeriods is a part of any Supply, I presume the logic for this should be in the SupplyEditor.
I got some really good help on the thread How to access PresenterWidget fields when added dynamically, but that was before I had implemented the Editor Framework at all, so I think the logic is in the wrong places.
Any help greatly appreciated. I can post more code (Presenter and View) but I didn't want to make it too hard to read and all they do is get the Supply from the datastore and call edit() on the View.
I have had a look at some examples of ListEditor but I don't really get it!
You need a ListEditor
It depends of how you want to present them in your actual view, but the same idea apply:
public class BillingPeriodListEditor implements isEditor<ListEditor<BillingPeriod,BillingPeriodEditor>>, HasRequestContext{
private class BillingPeriodEditorSource extends EditorSource<BillingPeriodEditor>{
#Override
public EmailsItemEditor create(final int index) {
// called each time u add or retrive new object on the list
// of the #ManyToOne or #ManyToMany
}
#Override
public void dispose(EmailsItemEditor subEditor) {
// called each time you remove the object from the list
}
#Override
public void setIndex(EmailsItemEditor editor, int index) {
// i would suggest track the index of the subeditor.
}
}
private ListEditor<BillingPeriod, BillingPeriodEditor> listEditor = ListEditor.of(new BillingPeriodEditorSource ());
// on add new one ...
// apply or request factory
// you must implement the HasRequestContext to
// call the create.(Proxy.class)
public void createNewBillingPeriod(){
// create a new one then add to the list
listEditor.getList().add(...)
}
}
public class BillingPeriodEditor implements Editor<BillingPeriod>{
// edit you BillingPeriod object
}
Then in you actual editor edit as is in the path Example getBillingPeriods();
BillingPeriodListEditor billingPeriods = new BillingPeriodListEditor ();
// latter on the clickhandler
billingPeriods.createNewBillingPeriod()
You are done now.

JComboxBox setSelectedItem

I am facing problem to set a perticulat value of a custom JComboBox. If I call setSelectedItem() from the initialize() method of the following class it is not selecting the particular value.
The extended JComboBox class is:
public class ThemeComboBox extends JComboBox {
private static final long serialVersionUID = 50L;
public ThemeComboBox(DefaultComboBoxModel model) {
super(model);
initialize();
LibraryLogger.initMessage(getClass().getSimpleName());
}
public void initialize() {
ThemeComboBoxModel model = (ThemeComboBoxModel) getModel();
for(ThemeModel themeModel : model.getThemeModels()) {
if(themeModel.getThemeClass().equals(ConfigurationManager.getInstance().getUiManager().getUiProperties().getTheme())) {
setSelectedItem(themeModel);
System.out.println("=========");
break;
}
}
addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent actionEvent) {
ThemeComboBox themeComboBox = (ThemeComboBox) actionEvent.getSource();
System.out.println(themeComboBox.getSelectedItem());
}
});
}
}
While if I override the getSelectedItem() of custom DefaultComboBoxModel then it is selecting that value but on choosing other value the selection remain same or it remain unchange.
The model class is:
public class ThemeComboBoxModel extends DefaultComboBoxModel {
private static final long serialVersionUID = 51L;
private Vector<ThemeModel> themeModels;
public ThemeComboBoxModel(Vector<ThemeModel> models) {
super(models);
}
public Vector<ThemeModel> getThemeModels() {
return themeModels;
}
public void setThemeModels(Vector<ThemeModel> themeModels) {
this.themeModels = themeModels;
}
/*#Override
public Object getSelectedItem() {
for(ThemeModel themeModel : themeModels) {
if(themeModel.getThemeClass().equals(ConfigurationManager.getInstance().getUiManager().getUiProperties().getTheme())) {
return themeModel;
}
}
return null;
}*/
}
I am unable to understand what I am doing wrong. Any information will be very helpful to me.
Thanks in advance.
1) I hope that main method is initialized from invokeLater
2) Swing is single threaded, where output to the GUI is done quite in one moment
3) there isn't any guarantee that all events have got any order, basically isn't possible ordering events for Swing GUI, same/especially on GUI startup
4) show GUI (setVisible(true);), then last codeline will be JComboBox#setSelectedItem(int or Object), wrapped inside invokeLater
5) add Listeners only if needed, remove useless Listeners

Wicket string model

Im still not getting the wicket models. What am I doing wrong here? filterString is still "" when the links onClick method prints it.
class X extends Panel {
String filterString;
TextField filterTextField;
AjaxLink filterLink;
X(){
filterString = new String("");
filterTextField = new TextField<String>("filterTextField", new PropertyModel<String>(this, "filterString"));
filterLink = new AjaxLink<Void>("filterLink"){
private static final long serialVersionUID = 1L;
#Override
public void onClick(AjaxRequestTarget target) {
params.setFilterString(filterTextField.getModelObject());
System.out.println("BLABLABLA " + filterTextField.getModelObject());
}
};
//add stuff etc
}
}
EDIT:
OK, like Juha said using a Form works. Sometimes I feel like creating forms feels like overkill but since this is probably the most Wicket-y thing to do anyway, it is what I will use here. The class would look something like this:
public class X extends Panel {
private static final long serialVersionUID = 1L;
public X(String id) {
super(id);
add(new FilterForm("logEntryForm"));
}
public class FilterForm extends Form{
private static final long serialVersionUID = 1L;
private transient String text; //no need to serialize this
public FilterForm(String id) {
super(id);
final TextField<String> contents = new TextField<String>("contents", new PropertyModel<String>(FilterForm.this, "text")); //textArea for user to enter the filter String
add(contents);
add(new AjaxButton("filterButton") {
private static final long serialVersionUID = 1L;
#Override
protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
//do stuff, in my case it was to send the text to the database for filtering out results
}
});
}
}
}
Replace AjaxLink with Form and AjaxButton or something that has onSubmit() method. AjaxLink doesn't do submit so browser doesn't send the input value to server.
In constructor it seems you have written x() rather than X() (capital X)

Categories