mobl

50 million 20 million

iPhones iPod Touches

50 million 20 million

iPhones iPod Touches

100 million

1.5 million 1.2 million

G1 Droid

1.5 million 1.2 million

G1 Droid

2013

Objective-C Java J2ME/C++

HTML/Javascript

Objective-C Java J2ME/C++

HTML/Javascript Java

Objective-C

Android Java

Blackberry
Java
J2ME

HTML/JS

3.3.1 – Applications may only use Documented
APIs in the manner prescribed by Apple and
must not use or call any private APIs.
Applications must be originally written in
Objective-C, C, C++, or JavaScript as executed
by the iPhone OS WebKit engine, and only code
written in C, C++, and Objective-C may compile
and directly link against the Documented APIs
(e.g., Applications that link to Documented APIs
through an intermediary translation or
compatibility layer or tool are prohibited).

cross-platform development

arbitrary rejections

language expressivity

WebDatabases

Location information
(GPS)

WebDatabases

(GPS)

Threading

WebDatabases

(GPS)

Canvas

Threading

WebDatabases

(GPS)

Canvas

Multi-touch Threading

WebDatabases

(GPS)
Ofﬂine support
Canvas


WebDatabases
Full-screen support
(GPS)
Ofﬂine support
Canvas


“ We believe the web has won and over the next
several years, the browser [..] will become the
platform that matters and certainly that’s where
Google is investing.
”
Vic Gundotra, Google VP of Engineering

entity Task {
name : String (searchable)
done : Bool
tags : Collection<Tag> (inverse: tasks)
}

entity Tag {
name : String (searchable)
tasks : Collection<Task> (inverse: tags)
}

function sayHello(name : String) {
alert("Hello there, " + name);
}

screen root() {
basicView("Tasks") {
group {
list(t in Task.all()) {
item { label(t.name) }
}
}
}
}

screen prompt(question : String) : String {
var answer = ""
header(question)
group {
inputString(answer)
}
button("Done", onclick={
screen return answer;
})
}

screen root() {
var firstName = prompt("First name?")
var lastName = prompt("Last name?")
header("Hello there")
label("Hello, " + firstName + " "
+ lastName)
}

var s = ""

button("Set s", onclick={
s = "Hello";
})

template label(t : String) {

}
...
var s = ""
label(s)
button("Set s", onclick={
s = "Hello";
})

<input type="text" databind=s/>

two-way binding

reactive/dataﬂow programming

screen root() {
var amount = 10
var percentage = 10
var total = amount *
(1 + percentage/100)

header("Tip calculator")
group {
inputNumber(amount, label="amount")
inputNumber(percentage, label="%")
label(total)
}
}

64

CSS styles
span
events
- onclick
64

var myspan = $("");
myspan.text("64");
anotherEl.append(myspan);

synchronous programming

var results = tx.executeQuery("SELECT * FROM Task");
for(var i = 0; i < results.length; i++) {
alert(results[i].name);
}

render page

time
query database
and process
results

...

render page

time
query database
browser freeze and process
results

...

render page

send query

time
...

process query
result

...

asynchronous programming

tx.executeQuery("SELECT * FROM Task",
function(results) {
for(var i = 0; i < results.length; i++) {
alert(results[i].name);
}
});
...

function(results) {
alert("Hello, ");
});
alert("world!");

function(results) {
tx.executeQuery("INSERT ...", function() {
alert("Selected, then inserted");
});
});

continuation-passing style
transformation

function displayLocationAndReturn() : Coordinates {
var position = mobl::location::getPosition();
alert("Lat: " + position.latitude);
alert("Long: " + position.longitude);
return position;
}

screen root() {
var n = 8
label(n * n)
button("Inc", onclick={
n = n + 1;
})
}

var n = 8

var n = ref(8);

Observable
- set(value)
- get()
- addEventListener(eventType, callback)

label(n * n)

var node565 = $("");
node565.text(n.get() * n.get());
n.addEventListener("change", function() {
node565.text(n.get() * n.get());
});
root.append(node565);

button("Inc", onclick={
n = n + 1;
})

var nodes566 = $("");
node566.text("Inc");
node566.click(function() {
n.set(n.get() + 1);
});
root.append(node566);

many mobile platforms

HTML5/JS

avoid AppStore approval

mobl

statically-typed WebDSL-like language

generates HTML/JS

CPS transform/reactive programming

get it?

http://mobl-lang.org

http://twitter.com/zef

mobl

More Related Content

What's hot (20)

Viewers also liked (9)

Similar to mobl (20)

Recently uploaded (20)

mobl