CoffeeScript using only to build an SmartPhone Application Naoya Ito 

Chrome To iOS 

No content

Node Titanium Mobile Chrome Extension + + 

JavaScript 

}); }); }); }); }); }); 

＼(＾o＾)／ 

CoffeeScript will save us from the darkside of JavaScript 

Node express = require "express" app = module.exports = express.createServer() app.get "/", (req, res) -> res.render "index", title: "Express" 

Titanium Mobile win = Ti.UI.createWindow title: "Chrome To iOS" table = Ti.UI.createTableView top: 0 data: [] win.add table tabGroup = Ti.UI.createTabGroup tab = Ti.UI.createTab window: win tabGroup.addTab tab tabGroup.open() 

Chrome Extension chrome.browserAction.onClicked.addListener (tab) -> chrome.tabs.executeScript null, file: "jquery-1.6.4.min.js", -> chrome.tabs.executeScript null, file: "content_script.js" chrome.extension.onConnect.addListener (port) -> port.onMessage.addListener (info) -> socket = io.connect 'http://localhost:3000' socket.emit 'fireEvent:openUrl' title: info.title url: info.url image: info.image 

To learn more about CoffeeScript 

CoffeeScript All your product are belong to 

How do they communicate with each other? 

No content

socket.emit() socket.emit() using socket.io for messaging 

Hacking Titanium for enabling Socket.IO WebView proxy technique 0px WebView left: -100 top: -100 enabling socket.io on HTML socket.emit() Titanium.App.fireEvent() github.com/euforic/ChatSocks/tree/wv-proxy 

WebView proxy for Socket.IO socket = {} socket.connect = (win) -> proxy = Ti.UI.createWebView url: "webview/webview.html" top: -100, left: -100, width: 0 height: 0 win.add proxy # Alias for Titanium functions just for fun socket.emit = (e, params) -> Ti.App.fireEvent e, params socket.on = (e, callback) -> Ti.App.addEventListener e, callback on Titanium App 

Open new URL when receiving socket events socket.on 'openUrl', (params) -> table.prependRow $$.ui.createRow title: params.title || params.url message: 'URLを開く' image: params.image click: -> w = Ti.UI.createWindow() w.add Ti.UI.createWebView url: params.url tab.open w on Titanium App 

Using socket.io on Chrome is easy # background.html # background.coffee chrome.extension.onConnect.addListener (port) -> port.onMessage.addListener (info) -> socket = io.connect 'http://localhost:3000' socket.emit 'fireEvent:openUrl' ... on Chrome Extension 

done! 

Node & Titanium Mobile can help you to write SmartPhone Apps only in CoffeeScript Socket.IO makes work easy! 

To learn more about CoffeeScript NO MORE JS HELL!? 

Thanks! github/naoya/push-to-ios (Titanium App & Node server) github/naoya/chrome2ios (Chrome Extension) Design inspired by: zachholman.com/posts/slide-design-for-developers/