Skip to content

Instantly share code, notes, and snippets.

@juanghurtado
Created July 9, 2012 06:39
Show Gist options
  • Save juanghurtado/3074641 to your computer and use it in GitHub Desktop.
Save juanghurtado/3074641 to your computer and use it in GitHub Desktop.
Appcelerator QR Code VCard error
// TESTED WITH APPCELERATOR TITANIUM 2.1.0.GA
// Method by Dawson Toth:
// http://developer.appcelerator.com/blog/2011/09/qr-codes-in-your-mobile-apps-cross-platform.html
function createQRCodeImageView(text, size) {
var url = 'http://chart.apis.google.com/chart?cht=qr&chs=' + size + '&chl=' + encodeURI(text) + '&chld=H|0';
var width = size.split('x')[0], height = size.split('x')[1];
if (Ti.Android) {
width += 'dp';
height += 'dp';
}
return Ti.UI.createImageView({
image: url, width: width, height: height
});
}
// vCard string to be encoded inside a QR Code
var vcard = "BEGIN:VCARD\n";
vcard += "VERSION:2.1\n";
vcard += "N:ipsum;lorem;;;\n";
vcard += "FN:Lorem Ipsum\n";
vcard += "ORG:Company Ipsum\n";
vcard += "TITLE:Lorem Ipsum developer\n";
vcard += "TEL:555 555 555\n";
vcard += "EMAIL:[email protected]\n";
vcard += "END:VCARD";
var img = createQRCodeImageView(vcard, "300x300");
// `img` now contains a QR Code with an invalid vCard (with escaped content inside: %20, %0A and so on…)
// Expected:
//BEGIN:VCARD
//VERSION:2.1
//N:ipsum;lorem;;;
//FN:Lorem Ipsum
//ORG:Company Ipsum
//TITLE:Lorem Ipsum developer
//TEL:555 555 555
//EMAIL:[email protected]
//END:VCA
// Result:
// BEGIN:VCARD%0AVERSION:2.1%0AN:Ipsum;Lorem;;;%0AFN:Lorem%20Ipsum%0AORG:Company%20Ipsum%0ATITLE:Lorem%20Ipsum%20developer%0ATEL:555%20555%20555%0AEMAIL:[email protected]%0AEND:VCARD
@dawsontoth
Copy link

Report this issue in Jira. The URL is fine (it must be escaped -- that's part of it being a URL). Type that URL in your browser, and you'll see a valid QR code that you can scan. But somewhere after you pass it to the image view, Titanium is corrupting it.

https://jira.appcelerator.org/secure/CreateIssue.jspa?pid=10190&issuetype=1

Use this code for your reproduction:

var win = Ti.UI.createWindow({
    backgroundColor: '#fff'
});
win.add(Ti.UI.createImageView({
    image: 'http://chart.apis.google.com/chart?cht=qr&chs=300x300&chl=BEGIN:VCARD%0AVERSION:2.1%0AN:Ipsum;Lorem;;;%0AFN:Lorem%20Ipsum%0AORG:Company%20Ipsum%0ATITLE:Lorem%20Ipsum%20developer%0ATEL:555%20555%20555%0AEMAIL:[email protected]%0AEND:VCARD&chld=H|0',
    width: 300, height: 300
}));
win.open();

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