beoynd vaadin 7
DESCRIPTION
Presentation at Vaadin & GWT meetup San Francisco Sep 25, 2013TRANSCRIPT
Joonas LehtinenFounder & CEO@joonaslehtinen
Beyond 7
Questions &answers
Roadmap
Quick recap of Vaadin 7
7.1Feature by feature
Agenda
Vaadin7
v32002
v0.12001
OpenSource
v42006
Ajax
v52007
7Febv6
2009
Completestack
Renewedfrom Inside
Sass
JS
HTML5+=GWT
RPCState
UI
Field
Vaadin7.1
@VaadinServletConfiguration
https://vaadin.com/wiki/-/wiki/Main/Creating+a+servlet+3.0+application
@Theme("foo")public class FooUI extends UI {
@WebServlet(value = "/*", asyncSupported = true) @VaadinServletConfiguration(productionMode = false, ui = FooUI.class) public static class Servlet extends VaadinServlet { }
@Override protected void init(VaadinRequest request) { ... }
}
@Theme("foo")public class FooUI extends UI {
@WebServlet(value = "/*", asyncSupported = true) @VaadinServletConfiguration(productionMode = false, ui = FooUI.class) public static class Servlet extends VaadinServlet { }
@Override protected void init(VaadinRequest request) { ... }
}
Server initiated events / Push
https://vaadin.com/wiki/-/wiki/Main/Using+server+initiated+events
server
client
Component
Widget
Connector
RPC
State
Samplehttp://demo.vaadin.com/sampler/#foundation/push
@Push MyUI
<async-supported/> orasyncSupported = true
vaadin-push dependency
UI.getCurrent().access(new Runnable() {public void run() {layout.addComponent(new Label("foo”));
}});
Debugwindow
?debug
Optimizing widgetset...
278k 130k
Compiling themes
Add-ontheme packaging
https://vaadin.com/wiki/-/wiki/Main/Packaging+SCSS+or+CSS+in+an+add-on
Inject CSSdynamically
https://vaadin.com/wiki/-/wiki/Main/Dynamically+injecting+CSS
getPage().getStyles().add(".reindeer.v-app { background: #"+ Math.round(Math.random() * 899 + 100) + ";}"
);
Samplehttp://demo.vaadin.com/sampler/#foundation/cssinject
Calendar
https://vaadin.com/wiki/-/wiki/Main/Migrating+from+Vaadin+7.0+to+Vaadin+7.1
Accessibility with WAI-ARIA
https://vaadin.com/blog/-/blogs/first-step-in-accessibility
ButtonTextFieldPasswordFieldTextAreaDateField
WAI-ARIA enabled components
CheckBoxComboBoxButtonGroupTreeTooltip
Roadmap
Roadmap
Vaadin 7.2GWT compatibilityApplication archetypeVaadin CDI 1.0 betaVaadin TouchKit 4.0Vaadin TestBench 4.0Netbeans plug-inSpreadsheet
Grid• Client-side data model• Client-side APIs• Replaces Table and TreeTable
New theme that leverages SASS
Responsive extension built-inhttp://vaadin.com/addon/vaadin-responsive
Vaadin 7.2
<Beat design example>
// Vaadin UIprotected void init(VaadinRequest request) { new Responsive(this);}
// CSS.v-ui[width-range~="0-800px"] { /* Styles that apply when the UI's width is between 0 and 800 pixels */} .v-ui[width-range~="801px-"] { /* Styles that apply when the UI's width is over 800 pixels */}
http://demo.vaadin.com/responsive/
Full stack example
Suitable for working on all layers• Server-side Java• Client-side Java• JavaScript
Modularization and full tools support
Application Archetype
Finalize what is already available as alpha in directoryhttp://vaadin.com/addon/vaadin-cdi
Features• Registering UI with @CDIUI and Views• Decoupling by injecting components• Injecting EJBs, events, ...• UI Scope• Supports JAAS
Vaadin CDI 1.0 beta
New cross-platform themehttp://demo.vaadin.com/parking/
Windows Phone 8 support
Vaadin TouchKit 4.0
Vaadin Driver : New way of building selectors
Replacing recorder with debug window
Vaadin TestBench 4.0
Spreadsheet
Netbeans plugin
http://gwtcreate.com/
San Francisco - Dec 12-13Frankfurt - Dec 17-18