Created
December 4, 2022 15:43
-
-
Save dashorst/15f7713718746fcbcb03b989d52aad20 to your computer and use it in GitHub Desktop.
ReactJS ToDo application rewritten in Wicket Java and HTML
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html xmlns:wicket="http://wicket.apache.org"> | |
<body> | |
<h1 wicket:id="title" class="text-center mb-4"></h1> | |
<form wicket:id="formTodoForm"> | |
<label wicket:id="formTodoLabel"><b>Add Todo</b></label> | |
<input type="text" wicket:id="textField" class="input" placeholder="Add new todo" /> | |
<button wicket:id="submit" type="submit">Submit</button> | |
</form> | |
<div> | |
<ul> | |
<li wicket:id="todos" class="todo"> | |
<span wicket:id="text"></span> | |
<a wicket:id="markTodo" class="outline-success" href="#">✓</a> | |
<a wicket:id="removeTodo" class="outline-danger" href="#">✕</a> | |
</li> | |
</ul> | |
</div> | |
</wicket:panel> | |
</body> | |
</html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
public class App extends WebPage { | |
private static final long serialVersionUID = 1L; | |
private List<Todo> todos = Arrays.asList( | |
new Todo("This is a sample todo", false) | |
); | |
public App() { | |
add(new Label("title", "Todo List")); | |
add(new FormTodoForm("formTodoForm")); | |
add(new ListView<Todo>("todos", todos) { | |
@Override | |
protected void populateItem(ListItem<Todo> item) { | |
item.add(new TodoPanel("todo", item.getModel())); | |
} | |
}); | |
} | |
private class FormTodoForm extends Form<Void> { | |
private static final long serialVersionUID = 1L; | |
private TextField<String> textField; | |
public FormTodoForm(String id) { | |
super(id); | |
add(new Label("formTodoLabel", "Add Todo")); | |
textField = new TextField<>("textField", Model.of("")); | |
add(textField); | |
add(new Button("submit") { | |
@Override | |
public void onSubmit() { | |
if (StringUtils.isNotBlank(textField.getValue())) { | |
todos.add(new Todo(textField.getValue(), false)); | |
textField.setModelObject(""); | |
} | |
} | |
}); | |
} | |
} | |
private class TodoPanel extends Panel { | |
private static final long serialVersionUID = 1L; | |
private Todo todo; | |
public TodoPanel(String id, IModel<Todo> model) { | |
super(id, model); | |
this.todo = model.getObject(); | |
add(new Label("text", todo.getText()).setRenderBodyOnly(true)); | |
add(new AjaxLink<Void>("markTodo") { | |
@Override | |
public void onClick(AjaxRequestTarget target) { | |
todo.setDone(true); | |
target.add(TodoPanel.this); | |
} | |
}); | |
add(new AjaxLink<Void>("removeTodo") { | |
@Override | |
public void onClick(AjaxRequestTarget target) { | |
todos.remove(todo); | |
target.add(TodoPanel.this.getParent()); | |
} | |
}); | |
} | |
@Override | |
protected void onConfigure() { | |
super.onConfigure(); | |
addStateChange(); | |
} | |
} | |
private static class Todo implements Serializable { | |
private static final long serialVersionUID = 1L; | |
private String text; | |
private boolean done; | |
public Todo(String text, boolean done) { | |
this.text = text; | |
this.done = done; | |
} | |
public String getText() { | |
return text; | |
} | |
public boolean isDone() { | |
return done; | |
} | |
public void setDone(boolean done) { | |
this.done = done; | |
} | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment