5. Úvod
• GWT je javascriptový framework
Wednesday, March 17, 2010
6. Úvod
• GWT je javascriptový framework
• Vývoj v JAVE (kompilátor preloží do JS)
Wednesday, March 17, 2010
7. Úvod
• GWT je javascriptový framework
• Vývoj v JAVE (kompilátor preloží do JS)
• silné IDE - refaktor, code completion
Wednesday, March 17, 2010
8. Úvod
• GWT je javascriptový framework
• Vývoj v JAVE (kompilátor preloží do JS)
• silné IDE - refaktor, code completion
• unit testovanie, moznosť TDD
Wednesday, March 17, 2010
9. Úvod
• GWT je javascriptový framework
• Vývoj v JAVE (kompilátor preloží do JS)
• silné IDE - refaktor, code completion
• unit testovanie, moznosť TDD
• integrácia s backendami (Spring,
Hibernate, JSF a ďalšie)
Wednesday, March 17, 2010
10. Úvod
• GWT je javascriptový framework
• Vývoj v JAVE (kompilátor preloží do JS)
• silné IDE - refaktor, code completion
• unit testovanie, moznosť TDD
• integrácia s backendami (Spring,
Hibernate, JSF a ďalšie)
Wednesday, March 17, 2010
12. Úvod
• debug kódu v prehliadači
Wednesday, March 17, 2010
13. Úvod
• debug kódu v prehliadači
• kompatibilita
Wednesday, March 17, 2010
14. Úvod
• debug kódu v prehliadači
• kompatibilita
• IE 6+, FF 1.x+, Opera 8.5+, Safari 2.0.x
Wednesday, March 17, 2010
15. Hello world!
public class HelloApp implements EntryPoint {
public void onModuleLoad() {
Button b = new Button("Click me", new ClickListener() {
public void onClick(Widget sender) {
Window.alert("Hello world!");
}
}
RootPanel.get().add(b);
}
}
Wednesday, March 17, 2010
19. Project Layout
• module base
• .client - kód ktorý sa
kompiluje do JS
• .server - java kód ktorý
nebude kompilovaný do
JS (ale bude pristupný
iba na serveri)
• .public - resources
Wednesday, March 17, 2010
20. Module
• XML súbor MyApp.gwt.xml
• source
• super source
• deferred binding
• inherited modules
• entry point
Wednesday, March 17, 2010
22. Module - source
• <source src=”client” />
• com.app.Module.gwt.xml
• com.app.client.* - kód ktorý sa bude
kompilovať
• com.app.other* alebo com.other.*- na
tento kód gwt neuvidí a nebude sa
kompilovať do JS
Wednesday, March 17, 2010
23. Module - super-source
• <super-source src=”jre” />
• com.app.Module.gwt.xml
• com.app.jre.java.util.UUID.java -
kompilátor to uvidí ako
java.util.UUID.java
Wednesday, March 17, 2010
24. Module - deferred
<!-- Fall through to this rule is the browser isn't IE or Mozilla -->
<replace-with class="com.google.gwt.user.client.ui.impl.PopupImpl">
<when-type-is class="com.google.gwt.user.client.ui.impl.PopupImpl"/>
</replace-with>
<!-- Mozilla needs a different implementation due to issue #410 -->
<replace-with class="com.google.gwt.user.client.ui.impl.PopupImplMozilla">
<when-type-is class="com.google.gwt.user.client.ui.impl.PopupImpl" />
<any>
<when-property-is name="user.agent" value="gecko"/>
<when-property-is name="user.agent" value="gecko1_8" />
</any>
</replace-with>
Wednesday, March 17, 2010
25. Module - deferred
public class HelloApp implements EntryPoint {
public void onModuleLoad() {
PopupImpl impl = GWT.create(PopupImpl.class);
impl.callSomeMethod();
}
}
Wednesday, March 17, 2010
27. Hello world!
public class HelloApp implements EntryPoint {
public void onModuleLoad() {
Button b = new Button("Click me", new ClickListener() {
public void onClick(Widget sender) {
Window.alert("Hello world!");
}
}
RootPanel.get(“gwt-main-container”).add(b);
}
}
Wednesday, March 17, 2010
31. AJAX
• AJAX (Asynchronous JavaScript and XML) mení obsah
stránky bez nutnosti znovunačítania
• RIA (desktop-like Rich Internet Application) aka WEB 2.0
Wednesday, March 17, 2010
33. AJAX v podani GWT
/ some code flow
/
/ GWT.create(YourService.class);
/
YourService.Util.getInstance().method(param, new AsyncCallback() {
public void onFailure(Throwable e) {
Window.alertError(“error occured”);
}
public void onSuccess(Object result) {
/ and more logic continues
/
/ process the result
/
}
});
Wednesday, March 17, 2010
34. Client Bundles
• obrázky - multi-obrázok (jeden request)
• minimalizuje chyby medzi filename-om a
konštantou
• rozširiteľný design pre nové resource typy
Wednesday, March 17, 2010
35. Client Bundles
<inherits name="com.google.gwt.resources.Resources" />
public interface MyResources extends ClientBundle {
public static final MyResources INSTANCE = GWT.create
(MyResources.class);
@Source("my.css")
public CssResource css();
@Source("config.xml")
public TextResource initialConfiguration();
@Source("manual.pdf")
public DataResource ownersManual();
Wednesday, March 17, 2010
36. Client Bundles
/ Inject the contents of the CSS file
/
MyResources.INSTANCE.css().ensureInjected();
/ Display the manual file in an iframe
/
new Frame(MyResources.INSTANCE.ownersManual().getURL());
Wednesday, March 17, 2010
40. JSNI
• JavaScript Native Interface
• ľahko kombinovateľný JavaScript kód do
GWT
• volanie metód z GWT v JS
• volanie metód z JS v GWT
Wednesday, March 17, 2010
41. JSNI Syntax
• /*-{ JavaScript code here }-*/;
• native void nativeJsCall()/*-{alert(“JS”);}-*/;
• $wnd - pointer na window (ale preco?)
Wednesday, March 17, 2010
42. JSNI - JS call do GWT
• [instance-expr.]@class-name::method-name
(param-signature)(arguments)
• [instance-expr.]@class-name::field-name
Wednesday, March 17, 2010
43. JSNI - JS call do GWT
[instance-expr.]@class-name::method-name(param-signature)(arguments)
/ method calls
/
this.@com.example.client.MyClass::setStringValue(Ljava/lang/String;)(s);
x.@com.example.client.MyClass::setStringValue(Ljava/lang/String;)(s);
@com.example.client.MyClass::setStaticValue(Ljava/lang/String;)(s);
/ fields
/
var val = this.@com.example.client.MyClass::valueStringFiled
x.@com.example.client.MyClass::valueStringField = val + " and stuff";
Wednesday, March 17, 2010
44. JSNI - JS call do GWT
Type Signature Java Type long f (int n, String s, int[] arr);
Z boolean =
B byte (ILjava/lang/String;[I)J
C char
S short
I int
J long
F float
D double
L class ; class
[ type type[]
Wednesday, March 17, 2010
45. JavaScript overlay types
• JS objekt ako Java objekt
• protected konštruktor - bez arg
• mžnosť písť natívne aj nenatívne metódy
• nesmie obsahovať fieldy
Wednesday, March 17, 2010
47. JavaScript overlay types
class Customer extends JavaScriptObject {
/ Overlay types always have protected, zero-arg ctors
/
protected Customer() { }
/ Typically, methods on overlay types are JSNI
/
public final native String getFirstName() /*-{return this.FirstName; }-*/;
public final native String getLastName() /*-{return this.LastName; }-*/;
/ Note, though, that methods aren't required to be JSNI
/
public final String getFullName() {
return getFirstName() + " " + getLastName();
}
}
Wednesday, March 17, 2010
48. JavaScript overlay types
class MyModuleEntryPoint implements EntryPoint {
public void onModuleLoad() {
JsArray<Customer> cs = getCustomers();
for (int i = 0, n = cs.length(); i < n; ++i) {
Window.alert("Hello, " + cs.get(i).getFullName());
}
}
/ Return the whole JSON array, as is
/
private final native JsArray<Customer> getCustomers() /*-{
return $wnd.jsonData;
}-*/;
}
Wednesday, March 17, 2010
49. JavaScript overlay types
function $onModuleLoad(){
var cs, i, n;
cs = $wnd.jsonData;
for (i = 0, n = cs.length; i < n; ++i) {
$wnd.alert('Hello, ' + (cs[i].FirstName + ' ' + cs[i].LastName));
}
}
//---------------------------------------------------------------------
function B(){var a,b,c;a=$wnd.jsonData;for(b=0,c=a.length;b<c;++b)
{$wnd.alert(l+(a[b].FirstName+m+a[b].LastName))}}
Wednesday, March 17, 2010