Davit mkrtchyan rich wicket presentation

Post on 10-Aug-2015

52 views 4 download

transcript

1CONFIDENTIAL

Rich wicket

Apache wicket extensions framework

APRIL 4, 2015

2CONFIDENTIAL

Почему Wicket?

1. Open-source and free2. Быстрая разработка, Экономит время и деньги3. Apache wicket компонент ориентированный веб фреймворк 4. Поддержка наследование на уровне java и html markup. 5. Wicket наследует интерфейсы swing и awt. 6. Html markup не содержит логики, вся логика пишется в java

и js.

3CONFIDENTIAL

Основные компоненты Wicket

• WebPage – has markup• Panel – has markup• WebMarkupContainer• Behaviour• Form• IModel

4CONFIDENTIAL

WebPage & наследование

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html><html xmlns:wicket="http://wicket.apache.org"><head></head><body><div class="container"> <div wicket:id="header"></div> <wicket:child/> <div wicket:id="footer"></div></div></body></html>

public class BasePage extends WebPage {

public BasePage(PageParameters parameters) { super(parameters); add(new HeaderPanel("header")); add(new FooterPanel(“footer")); }}

BasePage.html BasePage.java

5CONFIDENTIAL

WebPage & наследование

public class HomePage extends BasePage {

public HomePage(PageParameters parameters) { super(parameters); }}

<?xml version="1.0" encoding="UTF-8"?><wicket:extend xmlns:wicket="http://wicket.apache.org"> <!--Home page content--></wicket:extend>

HomePage.html BasePage.java

6CONFIDENTIAL

Panel & наследование

<?xml version="1.0" encoding="UTF-8"?><wicket:panel xmlns:wicket="http://wicket.apache.org"> <!—Some base content-->

<wicket:child/>

<div wicket:id="somePanel"></div>

</wicket:panel>

public class BasePanel extends Panel {

public BasePanel(String id) { super(id); add(new SomePanel(“somePanel")); }}

public class HomePage extends BasePage {

public HomePage(PageParameters parameters) { super(parameters); add(new MyBehavior()); }}

<?xml version="1.0" encoding="UTF-8"?><wicket:extend xmlns:wicket="http://wicket.apache.org"> <!--Home page content--></wicket:extend>

BasePanel.html BasePanel.java

MyPanel.html MyPanel.java

7CONFIDENTIAL

Behavior

public class MyBehaviour extends Behavior {

@Override public void onConfigure(final Component component) { super.onConfigure(component); component.add(new AttributeAppender("style", Model.of("width:150px"), ";"));

component.add(new AjaxEventBehavior("click") { @Override protected void onEvent(AjaxRequestTarget target) { component.setDefaultModel(Model.of("clicked")); target.add(component); } }); }

@Override public void onComponentTag(Component component, ComponentTag tag) { super.onComponentTag(component, tag); tag.put("class", "clicked-class"); }}

8CONFIDENTIAL

Hmm… But what about js inheritance?

9CONFIDENTIAL

Why Rich Wicket

• Автоматическое включение javascript класса для wicket Panel (помимо html

markup), MarkupContainer, Behaviour• Автоматическое наследование js классов при наследовании wicket java

компонентов• Для каждого экземпляра wicket java класса создается его собственный

экземпляра js класса, устанавливается связь между ними• Получение модели wicket java компоненты в его js экземпляре

10CONFIDENTIAL

Как это работает?

public class MyPanel extends DcsPanel<MyModel> {

public MyPanel(String id, MyModel myModel) { super(id, myModel); }}

(function ($) { var MyPanel = window.DcsPanel.$extend({ __init__: function (modelObject, markupId) { this.$super(modelObject, markupId); }, onDomReady: function () { this.$super('onDomReady'); var _self = this; var myModel = this.modelObject; var $domElement = this.getComponent(); }); window.MyPanel = MyPanel;})(jQuery);

appendOnLoadJs("myMethod('stringVal')");

addAjaxPostLitenner("postButton", new AjaxPostEventListener<MyModel>(MyModel.class) {

@Override public Object actionWithCallback(MyModel pojo) { pojo.setValue("new new new value"); return pojo; } }); }

this.ajaxPost("postButton", myModel, new function(callbackPojo) { alert(callbackPojo.value);});

myMethod: function(value) { // do something with value}

11CONFIDENTIAL

Применение

• Разработана богатая библиотека wicket компонентов и поведений• Полная интеграция с twitter bootstrap• Ecommerce template

12CONFIDENTIAL

Спасибо

Давит Мкртчян