Skip to content

Instantly share code, notes, and snippets.

@ricardoalcocer
Last active December 16, 2015 16:29
Show Gist options
  • Star 6 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save ricardoalcocer/5463309 to your computer and use it in GitHub Desktop.
Save ricardoalcocer/5463309 to your computer and use it in GitHub Desktop.
Quick and dirty Appcelerator Alloy + FireFoxOS hack. This sample App works EXACTLY the same on iOS, Android and FirefoxOS.
function onsuccess(data){
var jdata=JSON.parse(data);
var data=[];
jdata.forEach(function(item){
var payload={
tweet:item.text
};
var row=Alloy.createController('tweet.row',payload).getView();
data.push(row)
})
$.tweets.setData(data);
}
var url='https://api.twitter.com/1/statuses/user_timeline.json?include_entities=true&include_rts=true&screen_name=appcelerator&count=20';
if (OS_MOBILEWEB){
(function(url,callback){
var xhr = new XMLHttpRequest({mozSystem: true});
xhr.open("GET", url, true);
xhr.onreadystatechange = function () {
if (xhr.status === 200 && xhr.readyState === 4) {
callback(xhr.response);
}
}
xhr.onerror = function () {
alert("Result from Cross-domain XHR: Cross-domain XHR failed");
};
xhr.send();
})(url,onsuccess)
}else{
(function(url,callback){
// do regular Titanium.Network.createHTTPClient
var xhr = Ti.Network.createHTTPClient({
// function called when the response data is available
onload : function(e) {
callback(this.responseText);
},
// function called when an error occurs, including a timeout
onerror : function(e) {
alert('error');
},
timeout : 5000 // in milliseconds
});
// Prepare the connection.
xhr.open("GET", url);
// Send the request.
xhr.send();
})(url,onsuccess)
}
$.index.open();
".container": {
backgroundColor:"white"
},
"Label": {
width: Ti.UI.SIZE,
height: Ti.UI.SIZE,
color: "#000"
}
<Alloy>
<Window class="container">
<TableView id="tweets">
</TableView>
</Window>
</Alloy>
{
"name": "FxOS01",
"type" : "privileged",
"description": "Ti HTTP Test",
"launch_path": "/",
"icons": {
"128": "/appicon.png"
},
"developer": {
"name": "Ricardo Alcocer",
"url": "http://appcelerator.com"
},
"default_locale": "en",
"launch_path" : "/index.html",
"permissions": {
"desktop-notification": {
"description" : "To show notifications"
},
"systemXHR": {},
"geolocation": {
"description" : "Marking out user location"
}
}
}
var args=arguments[0] || {};
$.tweet.text=args.tweet;
".container": {
backgroundColor: "white"
},
"#tweetcontainer":{
top: 5,
bottom: 5,
left: 5,
right: 5,
height:100,
borderRadius:5,
borderWidth: 1,
borderColor: "#cacaca"
},
"#tweet":{
height: Ti.UI.SIZE,
width: Ti.UI.FILL
}
<Alloy>
<TableViewRow id="tweetrow" height="Ti.UI.SIZE">
<View id="tweetcontainer">
<Label id="tweet"/>
</View>
</TableViewRow>
</Alloy>
@ricardoalcocer
Copy link
Author

The important stuff: You need to include in your manifest.webapp two entries:

"type" : "privileged"

"type" : "privileged"

(look above)

Once you've done that, make sure that you instantiate your XMLHTTPConnection with an extra parameter:

var xhr = new XMLHttpRequest({mozSystem: true});

That takes care of allowing you to make HTTP request outside of the sandbox. Other than that, it's just Titanium and Alloy.

Fun times!!!

@ricardoalcocer
Copy link
Author

This is how it looks:

@ricardoalcocer
Copy link
Author

And Running on iOS

@ricardoalcocer
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment