Vaadin 7 Today and Tomorrow

3,194 views

Published on

Vaadin Meetup Helsinki presentation in 2013/2 about the Vaadin 7 release and roadmap ahead.

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,194
On SlideShare
0
From Embeds
0
Number of Embeds
22
Actions
Shares
0
Downloads
38
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Vaadin 7 Today and Tomorrow

  1. 1. Vaadin 7 today and tomorrow @joonaslehtinen
  2. 2. v0.12001 v3 2002 Open Source
  3. 3. v4 2006Ajax v5 2007
  4. 4. v62009 7
  5. 5. 934 tickets closed during 16 months ofdevelopmentOldest ticket created 3/2008Newest ticket 2/20133939 commits made by 23 authors93 % by 6 persons> 1 000 000 lines of code touched
  6. 6. Renewed JS Sass from Inside HTML5 += UI GWT RPCComplete State Fieldstack
  7. 7. 7Favorite picks
  8. 8. Vaadin += GWT
  9. 9. GWTCompatible
  10. 10. Server Pr Op - od t r im fo uc d ti ize ize vit dfy or tim e rol Op t- s d ont i C ien Cl
  11. 11. Architecture
  12. 12. New Windowing API
  13. 13. public class Vaadin6App extends Application { public void init() { setMainWindow(createWindow()); } public Window getWindow(String name) { Window window = super.getWindow(name); if (window == null) { window = createWindow(); window.setName(name); addWindow(window); } return window; } private Window createWindow() { Window window = new Window("Vaadin 6 Application"); window.addComponent(new TextField("What is your name")); window.addComponent(new Button("Do not push me")); return window; }}
  14. 14. @Title("Vaadin 7 Application")public class Vaadin7uiUI extends UI { public void init(VaadinRequest request) { addComponent(new TextField("What is your name")); addComponent(new Button("Do not push me")); }}
  15. 15. Built-in high levelView management
  16. 16. Sass
  17. 17. Variables & functions Demo
  18. 18. Mixins Demo
  19. 19. RedesignedForms
  20. 20. public class Employee { String firstName; String lastName; double salary; 6 Date birthDate; // Getters, setters, …}Form form = new Form();form.setItemDataSource( new BeanItem<Employee>(employee));
  21. 21. form.setFormFieldFactory(new FormFieldFactory() { public Field createField(Item item, Object propertyId, Component uiContext) { if ("birthDate".equals(propertyId)) { 6 DateField df = new DateField(); df.setResolution(DateField.RESOLUTION_DAY); return df; } // .. return DefaultFieldFactory.createFieldByPropertyType(item .getItemProperty(propertyId).getType()); } });
  22. 22. 7 GridLayout form = new GridLayout(2,2) { TextField firstName = new TextField("First name"); TextField lastName = new TextField("Last name"); TextField salary = new TextField("Salary"); DateField birthDate = new DateField("Birth date"); { birthDate.setResolution(Resolution.DAY); setSpacing(true); addComponent(firstName); addComponent(lastName); addComponent(birthDate); addComponent(salary); } }; BeanFieldGroup<Employee> fieldGroup = new BeanFieldGroup<Employee>(Employee.class); fieldGroup.bindMemberFields(form); fieldGroup.setItemDataSource(new BeanItem<Employee>(employee));
  23. 23. public class Person { @Size(min = 5, max = 50) private String name; @Min(0) @Max(100) private int age; // + constructor + setters + getters}
  24. 24. “Joonas Lehtinen” presentation Component model firstName = “Joonas”Demo lastName = “Lehtinen”
  25. 25. RPCState
  26. 26. Widget 6 Paintable Variableclient Changesserver UIDL Component
  27. 27. Widget 7 Connector client State server RPC ComponentDemo
  28. 28. public interface ButtonRpc extends ServerRpc { public void click(MouseEventDetails details); } private ButtonRpc rpc = new ButtonRpc() { public void click(private ButtonRpc rpc = MouseEventDetails details) {RpcProxy.create(ButtonRpc.class, this); // do stuff }public void onClick(ClickEvent event) { }; rpc.click( new MouseEventDetails(event)); public Button() {} registerRpc(rpc); } client server
  29. 29. JavaScriptAdd-ons
  30. 30. Publish API from JavagetPage().getJavaScript().addCallback("myCallback", new JavaScriptCallback() { public void call(JSONArray arguments) throws JSONException { // Do something with the arguments } }); Use from JavaScriptwindow.myCallback(foo, 100);
  31. 31. Widget implementation in JavaScriptwindow.com_example_MyWidget = function() { var element = $(this.getWidgetElement()); // Draw a plot for any server-side (plot data) state change this.onStateChange = function() { $.plot(element, this.getState().series, {grid: {clickable: true}}); } // Communicate local events back to server-side component element.bind(plotclick, function(event, point, item) { if (item) { var onPlotClick = this.getCallback("plotClick"); onPlotClick(item.seriesIndex, item.dataIndex); } });}
  32. 32. Server-side Java API for Widgetpublic class MyWidget extends AbstractJavaScriptComponent { public MyWidget() { registerCallback("plotClick", new JavaScriptCallback() { public void call(JSONArray arguments) throws JSONException { // Do something with the event } }); } public static class MyWidgetState extends ComponentState { public List<List<List<Double>>> plotSeriesData = new ArrayList<List<List<Double>>>(); // getters & setters }}
  33. 33. HTML5
  34. 34. <!DOCTYPE html>
  35. 35. Lighter DOM Minimized reflows 6.8 7.0
  36. 36. Roadmap
  37. 37. Feb - March - April
  38. 38. Vaadin Framework 7.1 • Server push • Calendar (now under Apache 2.0 license) • Limited IE 10 support without touch • CSS string inject • Renewed debug console features ◦ Redesigned UI/UX for debug window ◦ Optimize widgetset ◦ Generate Java code for this view • Arithmetics for SASS • Packaging CSS for add-ons without a widgetset
  39. 39. Vaadin Charts • 1.0 version was released in Feb 21, 2013 • 1.1 version to be released in April, 2013 • New charts: • Funnel • Box plot • Waterfall • Bubble • Error bars • Different coloring of a graph above and below a threshold • Pinch zooming and panning for touch devices
  40. 40. Vaadin TouchKit • 3.0 version to be released in March • Vaadin 7 support • New components: • URLField • Datefield • Combobox • Preparing WP8 support
  41. 41. Vaadin TestBench • Maintenance releases
  42. 42. Vaadin JPAContainer • License changed to Apache 2.0 • Vaadin 7 compatible version released in March
  43. 43. Vaadin CDI • Beta to be released in March • Apache 2.0 License
  44. 44. Will not be ported to Vaadin 7 • Spring Roo Plug-in • WSRP Add-on • XS (will be included in Vaadin 7.x later on)
  45. 45. One more thing....
  46. 46. ? joonas@vaadin.com vaadin.com/joonas @joonaslehtinen

×