mobl
DESCRIPTION
mobl is a new language for the development of mobile applications using web technologies.TRANSCRIPT
![Page 1: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/1.jpg)
moblZef Hemel
![Page 2: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/2.jpg)
![Page 3: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/3.jpg)
50 million
iPhones
![Page 4: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/4.jpg)
50 million
iPhones
20 million
iPod Touches
![Page 5: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/5.jpg)
50 million
iPhones
20 million
iPod Touches
100 million
![Page 6: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/6.jpg)
![Page 7: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/7.jpg)
1.5 million
G1
![Page 8: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/8.jpg)
1.5 million
G1
1.2 million
Droid
![Page 9: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/9.jpg)
1.5 million
G1
1.2 million
Droid
2013
![Page 10: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/10.jpg)
![Page 11: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/11.jpg)
applicationdevelopment
![Page 12: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/12.jpg)
Objective-C
![Page 13: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/13.jpg)
Objective-C Java
![Page 14: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/14.jpg)
Objective-C Java J2ME/C++
![Page 15: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/15.jpg)
Objective-C Java J2ME/C++
HTML/Javascript
![Page 16: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/16.jpg)
Objective-C Java J2ME/C++
HTML/Javascript Java
![Page 17: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/17.jpg)
![Page 18: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/18.jpg)
Objective-C
Android Java
Blackberry Java
J2ME
HTML/JS
![Page 19: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/19.jpg)
![Page 20: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/20.jpg)
3.3.1
![Page 21: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/21.jpg)
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).
![Page 22: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/22.jpg)
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).
![Page 23: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/23.jpg)
![Page 24: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/24.jpg)
![Page 25: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/25.jpg)
AppStore
![Page 26: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/26.jpg)
![Page 27: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/27.jpg)
![Page 28: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/28.jpg)
cross-platform development
arbitrary rejections
language expressivity
![Page 29: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/29.jpg)
mobl
![Page 30: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/30.jpg)
![Page 31: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/31.jpg)
![Page 32: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/32.jpg)
![Page 33: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/33.jpg)
![Page 34: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/34.jpg)
![Page 35: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/35.jpg)
![Page 36: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/36.jpg)
![Page 37: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/37.jpg)
Webkit
![Page 38: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/38.jpg)
HTML
![Page 39: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/39.jpg)
WebDatabases
WebDatabases
![Page 40: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/40.jpg)
WebDatabases
Location information (GPS)
WebDatabases
![Page 41: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/41.jpg)
WebDatabases
Location information (GPS)
Threading
WebDatabases
![Page 42: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/42.jpg)
WebDatabases
Location information (GPS)
Threading
Canvas
WebDatabases
![Page 43: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/43.jpg)
WebDatabases
Location information (GPS)
Threading
Canvas
WebDatabases
Multi-touch
![Page 44: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/44.jpg)
WebDatabases
Location information (GPS)
Threading
Canvas
WebDatabases
Multi-touch
Offline support
![Page 45: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/45.jpg)
WebDatabases
Location information (GPS)
Threading
Canvas
WebDatabases
Multi-touch
Offline support
Full-screen support
![Page 46: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/46.jpg)
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
![Page 47: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/47.jpg)
![Page 48: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/48.jpg)
![Page 49: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/49.jpg)
syntax similar to
![Page 50: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/50.jpg)
demo
![Page 51: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/51.jpg)
entity Task { name : String (searchable) done : Bool tags : Collection<Tag> (inverse: tasks)}
entity Tag { name : String (searchable) tasks : Collection<Task> (inverse: tags)}
![Page 52: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/52.jpg)
function sayHello(name : String) { alert("Hello there, " + name);}
![Page 53: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/53.jpg)
screen root() { basicView("Tasks") { group { list(t in Task.all()) { item { label(t.name) } } } }}
![Page 54: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/54.jpg)
screen prompt(question : String) : String { var answer = "" header(question) group { inputString(answer) } button("Done", onclick={ screen return answer; })}
![Page 55: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/55.jpg)
screen root() { var firstName = prompt("First name?") var lastName = prompt("Last name?") header("Hello there") label("Hello, " + firstName + " " + lastName)}
![Page 56: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/56.jpg)
data binding
![Page 57: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/57.jpg)
var s = ""<span databind=s/>button("Set s", onclick={ s = "Hello";})
![Page 58: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/58.jpg)
template label(t : String) { <span databind=t/>}...var s = ""label(s)button("Set s", onclick={ s = "Hello";})
![Page 59: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/59.jpg)
two-way binding
<span databind=s/><input type="text" databind=s/>
![Page 60: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/60.jpg)
reactive/dataflow programming
![Page 61: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/61.jpg)
demo
![Page 62: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/62.jpg)
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) }}
![Page 63: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/63.jpg)
demo
![Page 64: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/64.jpg)
implementation
![Page 65: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/65.jpg)
HTML/Javascript
![Page 66: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/66.jpg)
<span>64</span>
![Page 67: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/67.jpg)
<span>64</span>
span
64
CSS stylesevents- onclick
![Page 68: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/68.jpg)
var myspan = $("<span>");myspan.text("64");anotherEl.append(myspan);
![Page 69: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/69.jpg)
sync vs async
![Page 70: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/70.jpg)
var results = tx.executeQuery("SELECT * FROM Task");for(var i = 0; i < results.length; i++) { alert(results[i].name);}
synchronous programming
![Page 71: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/71.jpg)
render page
query database and process
results
...
time
![Page 72: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/72.jpg)
render page
query database and process
results
...
timebrowser freeze
![Page 73: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/73.jpg)
render page
send query
...
process query result
...
time
![Page 74: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/74.jpg)
tx.executeQuery("SELECT * FROM Task", function(results) { for(var i = 0; i < results.length; i++) { alert(results[i].name); } });...
asynchronous programming
![Page 75: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/75.jpg)
tx.executeQuery("SELECT * FROM Task", function(results) { alert("Hello, "); });alert("world!");
![Page 76: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/76.jpg)
tx.executeQuery("SELECT * FROM Task", function(results) { tx.executeQuery("INSERT ...", function() { alert("Selected, then inserted"); }); });
![Page 77: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/77.jpg)
continuation-passing styletransformation
![Page 78: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/78.jpg)
function displayLocationAndReturn() : Coordinates { var position = mobl::location::getPosition(); alert("Lat: " + position.latitude); alert("Long: " + position.longitude); return position;}
![Page 79: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/79.jpg)
function displayLocationAndReturn() : Coordinates { var position = mobl::location::getPosition(); alert("Lat: " + position.latitude); alert("Long: " + position.longitude); return position;}
function displayLocationAndReturn(callback) { mobl.location.getPosition(function(result) { var position = result; alert("Lat: " + position.latitude); alert("Long: " + position.longitude); callback(position); });};
![Page 80: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/80.jpg)
function displayLocationAndReturn() : Coordinates { var position = mobl::location::getPosition(); alert("Lat: " + position.latitude); alert("Long: " + position.longitude); return position;}
function displayLocationAndReturn(callback) { mobl.location.getPosition(function(result) { var position = result; alert("Lat: " + position.latitude); alert("Long: " + position.longitude); callback(position); });};
![Page 81: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/81.jpg)
function displayLocationAndReturn() : Coordinates { var position = mobl::location::getPosition(); alert("Lat: " + position.latitude); alert("Long: " + position.longitude); return position;}
function displayLocationAndReturn(callback) { mobl.location.getPosition(function(result) { var position = result; alert("Lat: " + position.latitude); alert("Long: " + position.longitude); callback(position); });};
![Page 82: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/82.jpg)
reactive programming
![Page 83: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/83.jpg)
screen root() { var n = 8 label(n * n) button("Inc", onclick={ n = n + 1; })}
![Page 84: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/84.jpg)
var n = 8
var n = ref(8);
![Page 85: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/85.jpg)
var n = 8
var n = ref(8);
Observable- set(value)- get()- addEventListener(eventType, callback)
![Page 86: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/86.jpg)
label(n * n)
var node565 = $("<span>");node565.text(n.get() * n.get());n.addEventListener("change", function() { node565.text(n.get() * n.get());});root.append(node565);
![Page 87: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/87.jpg)
button("Inc", onclick={ n = n + 1;})
var nodes566 = $("<span class='button'>");node566.text("Inc");node566.click(function() { n.set(n.get() + 1);});root.append(node566);
![Page 88: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/88.jpg)
screen root() { var n = 8 label(n * n) button("Inc", onclick={ n = n + 1; })}
![Page 89: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/89.jpg)
screen root() { var n = 8 label(n * n) button("Inc", onclick={ n = n + 1; })}
![Page 90: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/90.jpg)
screen root() { var n = 8 label(n * n) button("Inc", onclick={ n = n + 1; })}
![Page 91: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/91.jpg)
conclusion
![Page 92: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/92.jpg)
many mobile platforms
HTML5/JS
avoid AppStore approval
![Page 93: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/93.jpg)
mobl
statically-typed WebDSL-like language
generates HTML/JS
CPS transform/reactive programming
![Page 94: mobl](https://reader034.vdocument.in/reader034/viewer/2022051411/545524baaf79592b448b4761/html5/thumbnails/94.jpg)
get it?
http://mobl-lang.org
http://twitter.com/zef