Category: Tricks

Using iPaper API to convert office documents to flash movie on the fly :)

October 7, 2009 ·

Embedding documents in web applications is a challenging work. Because you need to convert these documents into flash movie and only then you can embed them in your web applications. There are many converters available out their for use. Some of them are proprietary, Some of them comes for free. There are command line tools as well as web services also to perform these conversions and make your life easier. In this post I am going to introduce you to IPaper, an excellent service from Scribd. Using IPaper API you can upload and convert your documents to flash movie on the fly, and then you can embed them using Scribd’s excellent document viewer. Scribd offers a collection of client libraries and fortunately, we have a PHP lib in that collection.

Scribd API can convert numbers of document types including the followings

* Adobe PDF (.pdf)
* Adobe PostScript (.ps)
* Microsoft Word (.doc, .docx)
* Microsoft PowerPoint (.ppt, .pps, .pptx)
* Microsoft Excel (.xls, xlsx)
* OpenOffice Text Document (.odt, .sxw)
* OpenOffice Presentation Document (.odp, .sxi)
* OpenOffice Spreadsheet (.ods, .sxc)
* All OpenDocument formats
* Plain text (.txt)
* Rich text format (.rtf)

To use IPaper API, you need to create a developer account in ScribD and get your API key and secret key. Also, download the PHP client library from http://www.scribd.com/developers/libraries

You are ready to go once you get your Scribd api key and secret key. You can upload different types of files to scribd server and of course you can make them private or publicly accessible. After successful upload and conversion you will receive a doc_id and access_key from Scribd web service. Using those data you can embed your document in your web app. Lets have a look. In the following code examples, you may find the getEmbedUrl() and getEmbedCode() functions handy. You can also use SWFObject for quick embedding 🙂

[sourcecode lang=”php”]
<?php
include_once("scribd.php");

$UpdloadData = createIPaper("gpl.pdf","pdf","public");
$EmbedUrl = getEmbedUrl($UpdloadData);
echo $EmbedUrl;
$EmbedCode = getEmbedCode($UpdloadData);
echo $EmbedCode;

function createIPaper($File, $FileType, $Access="private")
{
$scribd_api_key = "<your API key>";
$scribd_secret = "<your Secret key>";

if (empty($FileType))
throw new Exception("Filetype cannot be empty");
$Scribd = new Scribd($scribd_api_key,$scribd_secret);

$UploadData = $Scribd->upload($File,$FileType,$Access,1);
return $UploadData;
}

function getEmbedUrl($UploadData)
{
if($UploadData){
$EmbedUrl = "http://d1.scribdassets.com/ScribdViewer.swf?document_id={$UploadData[‘doc_id’]}&access_key={$UploadData[‘access_key’]}&page=1&version=1&viewMode=list";
return $EmbedUrl;
}
}

function getEmbedCode($UploadData, $Width=450, $Height=500)
{
$EmbedCode = <<<EOD
<object codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"
id="doc_512761847372423" name="doc_512761847372423"
classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
align="middle"
height="{$Height}"
width="{$Width}" >
<param name="movie" value="http://d1.scribdassets.com/ScribdViewer.swf?document_id={$UploadData[‘doc_id’]}&access_key={$UploadData[‘access_key’]}&page=1&version=1&viewMode=list">
<param name="quality" value="high">
<param name="play" value="true">
<param name="loop" value="true">
<param name="scale" value="showall">
<param name="wmode" value="opaque">
<param name="devicefont" value="false">
<param name="bgcolor" value="#ffffff">
<param name="menu" value="true">
<param name="allowFullScreen" value="true">
<param name="allowScriptAccess" value="always">
<param name="salign" value="">
<param name="mode" value="list">
<embed src="http://d1.scribdassets.com/ScribdViewer.swf?document_id={$UploadData[‘doc_id’]}&access_key={$UploadData[‘access_key’]}&page=1&version=1&viewMode=list"
quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer"
play="true"
loop="true"
scale="showall"
wmode="opaque"
devicefont="false"
bgcolor="#ffffff"
name="doc_512761847372423_object"
menu="true"
allowfullscreen="true"
allowscriptaccess="always"
salign=""
type="application/x-shockwave-flash"
align="middle"
mode="list"
height="{$Height}"
width="{$Width}">
</embed>
</object>
EOD;
return $EmbedCode;
}
?>
[/sourcecode]

and here is how it will look after embedding
[scribd id=20736638 key=key-1dg5q0bof480cv4pjebo]

download the source code from here http://www.box.net/shared/5dav7hnkm9

By the way, IPaper PHP client library has some cool methods like uploadFromUrl() – Check them out )

Stay in touch, In next post I will show you how to use some other exciting tools which you can use and host in your own server :). that will be fun to host your own service like this 🙂

Thanks to Rana for helping me out with iPaper.

jQuery:hooking form submit and making it ajax request

October 1, 2009 ·

modern javascript frameworks are big blessings to every front end developer. they made our life so much easier so that we can sleep more and become fat day by day 😀 – i am a big fan of jQuery and mootools.

in this post i am going to show you how you can hook a normal form submission process, regardless of it’s method GET or POST, and convert it into an ajax request. the whole process will work dynamically. it will parse form input elements, make a JSON array from them and make an ajax request to the appropriate action url. after that, it will invoke the user supplied callback function.

problem 1: parsing form elements was a small challenge. you can do it in various way (by traversing or serialize or using css selectors). i choose to use serializer routines. jQuery has builtin support for two types of serializing , one is $(form).serialize() and another is $(form).serializeArray(). lets have a look at the output of both of them for the following form

[sourcecode lang=”html”]
<form id="f1" action=’some target’ method=’POST’>
<input type ="textbox" id=’username’ name =’username’ value=’me’/>
<input type ="checkbox" value=1 id=’guests’ name =’guests’/>
</form>
[/sourcecode]

now lets check the output by both serialize() and serializeArray() method

[sourcecode lang=”javascript”]
alert ($(‘#f1’).serialize());
//output is "username=me&guests=1"

alert($(‘#f1’).serializeArray()
//output is [{object},{object}]
[/sourcecode]

are you scared seeing this [object] output of serializeArray()? well dont panic. serializeArray() returns a JSON structure. you can still investigate using toSource() method

[sourcecode lang=”javascript”]
alert($(‘#f1’).serializeArray().toSource()
//output is [{"username":"me"},{"guests":"1"}]
[/sourcecode]

but that will not be usable to send in our AJAX request. we need a JSON array key/value pair (or you can use the output of serialize() function too to send as data in ajax request, the serilizeForm part is completely optional )

lets create a new function called serializeForm which will create JSON key/value pair out of serializeArray() and do the rest of the work.

[sourcecode language=”javascript”]
$.fn.serializeForm = function()
{
data = {};
url = this.attr("action");
items = this.serializeArray();
$.each(items,function(i,item)
{
data[item[‘name’]]=item[‘value’];
}
);
return data;
}
[/sourcecode]

now lets hook the normal submit process of the form using the following hook

[sourcecode lang=”javascript”]
function submitHook(form, callback)
{
$(form).submit(function(e){
items = {};
items = $(form).serializeForm();
url = $(form).attr("action");
if(""==url)
{
alert("Cannot submit form. No action specified");
return false;
}
callback = callback?callback:function(){};
$.post(url,items,callback);
return false;
});
}
[/sourcecode]

now you can just hook the form simply by this

[sourcecode lang=”javascript”]
ourCallback = function (data)
{
alert(data);
}

submitHook($(‘#f1’),ourCallback);
[/sourcecode]

happy jQuerying 🙂

removing empty elements from an array, the php way :)

September 16, 2009 ·

removing empty elements from array is most likely a very common task for everyday programming. different people work on it differently. some runs N times loop and some other tries by finding offset and then by unsetting that. let me show you some common approach of doing it and possibly the best way too :), needless to say, in a php way – most of the time such a microsecond does not matter, but well, its still good to find out the best solution 🙂

first of all, lets write a function which will create a random array with empty elements
[source lang=’php’]
function generateRandomArray($count=10000)
{
$array = range(0,($count-1));
for($i = 0;$i<1000;$i++)
{
$offset = mt_rand(0,$count);
$array[$offset] = “”;
}
return $array;
}
[/source]

now lets see some different approaches to get it done.
probably most common approach
[source lang=’php’]
$array = generateRandomArray();
$len = count($array);
$start = microtime(true);
for ($i=0;$i< $len;$i++) { if(""==$array[$i]) unset($array[$i]); } $end = microtime(true); echo ($end-$start); [/source] you can see the output varies from 0.13-0.14 seconds for an array with 10000 elements in a 2.66 ghz core 2duo machine running mac osx 10.5.8 with 4GB ram. here is another better approach using array_diff() [source lang='php'] $array = generateRandomArray(); $start= microtime(true); $empty_elements = array(""); $array = array_diff($array,$empty_elements); $end = microtime(true); echo ($end-$start); [/source] this one takes 0.052-0.059 seconds and surely is a significant improvement over the last one here is another improved version using array_filter() [source lang='php'] $array = generateRandomArray(); $start= microtime(true); $array = array_filter($array); $end = microtime(true); echo ($end-$start); [/source] it takes like 0.002 seconds to complete 🙂 - pretty good one, eh? (thanks damdec, for reminding about it) and this is the last one which was my favorite one using array_keys() taking advantage of the optional search_values parameter 🙂 [source lang='php'] $array = generateRandomArray(); $start= microtime(true); $empty_elements = array_keys($array,""); foreach ($empty_elements as $e) unset($array[$e]); $end = microtime(true); echo ($end-$start); [/source] this is an amazing improvement over the previous solutions, it takes only around 0.0008 - 0.0009 seconds for an array of 10000 elements. i hope you enjoyed this post with micro benchmarks 😀 - happy phping

Using Google WorldMap visualization component in your applications

September 14, 2009 ·

Its really hard to find a good flash based world map component to use in your web applications. They are either too complex to add or they cost quite a lot. And even sometime if you pay that, its tough to customize the chart as you want it to look like. But you know there is someone called “Uncle G” (i.e google) here who has almost all the components in his Pandora’s box. So lets see how can we use the geomap component from their Visualization Library.

First we need to create a datatable which will act as a data source for this world map, as usual like all other google visualization component.

[source lang=’javascript’]
var data = new google.visualization.DataTable();
data.addRows(5);
data.addColumn(‘string’, ‘Country’);
data.addColumn(‘number’, ‘Number of ZCEs’);
data.setValue(0, 0, ‘Bangladesh’);
data.setValue(0, 1, 19);
data.setValue(1, 0, ‘India’);
data.setValue(1, 1, 150);
data.setValue(2, 0, ‘Pakistan’);
data.setValue(2, 1, 4);
data.setValue(3, 0, ‘Nepal’);
data.setValue(3, 1, 5);
data.setValue(4, 0, ‘Sri Lanka’);
data.setValue(4, 1, 7);
[/source]

now we will initialize the google visualization framework and draw this component using this data source

[source lang=’javascript’]
var geomap = new google.visualization.GeoMap(document.getElementById(‘‘));
geomap.draw(data, null);
[/source]

but wait, we are not done yet – to make sure that everything works properly, we need to wrap all of these code inside a function (for example name this function as drawGeoMap) and we will use that function as a callback to draw this map. and of course, we need to load the google visualization library and geomap component first

so here is the complete code of this
[source lang=’javascript’]

[/source]

you can check the demo at http://sandbox.ofhas.in/geomapv1.php

it will display a world map with highlighted countries like below
Geomap V 1

but wait – lets make ca nifty change and add event listeners to it. we will add event listeners in such a way so that whenever users click on any country in the map, it will take you to zend yellow page corresponding to that country 🙂 that will make it really an useful component :). here is the code

[source lang=’javascript’]

[/source]

check the demo at http://sandbox.ofhas.in/geomapv2.php

now you can click on any country and it will open a new tab with that particular country pre selected – and you can see who are the zend certified engineers from that country. i hope you’ve liked this :). Thanks goes the theam Visualization team at google for creating these awesome components and to make them free for use

For reference – check out geomap reference at google code at http://code.google.com/apis/visualization/documentation/gallery/geomap.html. you can do many other cool things like displaying only US states map or Canadian States map with this 🙂

expanding short url to original url using PHP and CURL

May 5, 2009 ·

there are numbers of url shortening services available these days, including the good old tinyurl and something really short like u.nu. now when you get the short url shortened by using any of these services, you dont know where your browser is taking you! so if you are interested to figure out the original url hiding behind these short url, you need to have a little knowledge on how these services actually work. if you go to any of these short urls, they tell your browser “HTTP 30X: Object has moved” HTTP HEADER (optionally, some does it, some doesn’t) and then asks your browser to move to the original url using “Location” in HTTP HEADER. so all you have to do is just get the HTTP HEADER out first (PHP and Curl is pretty good at doing this, heh heh) and then parse the “Location” parameter from it.

lets see how that works in code

[sourcecode lang=”php”]
< ?php $url = "http://tinyurl.com/2dfmty"; $ch = curl_init($url); curl_setopt($ch,CURLOPT_HEADER,true); curl_setopt($ch,CURLOPT_RETURNTRANSFER,true); curl_setopt($ch, CURLOPT_FOLLOWLOCATION,false); $data = curl_exec($ch); $pdata = http_parse_headers($data); echo "Short URL: {$url}
“;
echo “Original URL: {$pdata[‘Location’]}”;

now you see that the output of this code is
[sourcecode lang=”HTML”]
Short URL: http://tinyurl.com/2dfmty
Original URL: http://ghill.customer.netspace.net.au/embiggen/
[/sourcecode]

pretty interesting huh? if you analyze the full headers for each of these services you will find that most of them are using PHP in backend with Apache. only http://u.nu is using mod_rails (hence RoR) and bit.ly uses nginx 🙂

have fun in expanding!

Look Ma, everyone's computing out there for me!

June 6, 2008 ·

SETI@Home is probably the greatest example of low cost distributed computing which become a big hit. After their tremendous success, many others over there started following the same strategy and used the power of distributed computing for other purposes like cancer research. In this article I will show you how we can use the same power at almost zero cost, and specially for your web applications.

As I am currently working on building an open source version of FriendFeed (not targetted to be an alternative, coz those people at FriendFeed done their job really well) and scaling such a huge load effectively at low cost, so I will mainly talk more about FriendFeed through out this blog post and use it as an example for my proposal.

If you consider FriendFeed as a repository of feed URLs, a lot of peoples and how they are related to each other, you can assume how big it is or it could be in near future. And scaling such a service would cost numbers of sleepless nights of many developers out there. So in basic, lets focus where actually the problem is and how we can introduce distributed computing.

Beside optimizing database to serve huge sets of data, one of the main problems of such a service has to parse millions of feeds in a regular interval. If we want to bear all the loads on your server, fine, if you can afford. But what about some low cost solutions. Lets consider a simple scenario, if your application has one million of users and each of them browse your application for 10 minutes a day, you really have 10 millions of computational power just wasting over there, in lanes and by lanes of internet – heh heh. So lets make use of such an incredible CPU power. All you have to do let the visitors machine do some calculations for you and free your server from gigantic load.

When the users of your application and relation among them are stored in your database, you can easily find out the first degree and second degree friends of a specific user. If you don’t know what does that mean, its simple, If A is a friend of B and C is a friend of A, then A is B’s first degree friend and C is B’s second degree friend. For a huge social network, it may look like the following one when you visualize the relationship

image courtesy: http://prblog.typepad.com

Now what we want to do is when B is visiting our application we want to parse most of his/her second degree friends in client using his browser. So while generating the page for B, we will supply him a bunch of feed URLs, a hash of their last known update time or hash of the latest item of each of these corresponding feeds, and a javascript based parser (for example Google’s ajax Feed API would do fine) script. Now, while B is browsing our application we will parse those feeds of his second degree friends using javascript without bothering him for a single second and post back the parsed contents (after checking against the hash for really updated contents) to a server side script which will then blindly (not totally, after some validation or authentication for sure) insert those result to our database. Now when A comes and visit his page (A is C’s first degree friend), he will get all the latest result from C’s feeds as B has already done the parsing job for us and we have those latest result from C’s feeds stored in our Database.

There are definitely more challenge than it is explained here, like what if a person is second degree friend of a multiple user. In such cases as we supplied last update time of these feeds while generating a page, we can calculate from server side which feeds we really want to parse.

And moreover, we can add more check for our javascript parser than just blindly parse those feeds. We can download a chunk of RSS or Atom feeds (using a proxy script developped using curl range options) and read just up to the latest update time and extract the time using simple reg ex or string functions instead of downloading full feed data. Now if we know that a script is not uptodate just by downloading 1-2 killobyte of data instead of downloading full feed, parsing the xml data, it would save us more computing resources for performing other jobs.

But of course, you cannot live completely on your client’s machine for parsing all your data. You must have several cron’d scripts to parse left overs or other feeds at server side. But what I am saying is that with little help of javascript you can make use of such a tremendous distributed computing power in your application, all at almost no cost.

I will come with example code once I am done developing my open source clone of FriendFeed and then I am sure, you will find it was worth writing a blog post about.

Distributed Computing
image courtesy: http://www.naccq.ac.nz/bacit/0203/2004Caukill_OffPeakGrid.htm

Have a nice RnDing time. 🙂

Getting Dell BCM4328 Wifi Card Working on Ubuntu 7.10

February 27, 2008 ·

After trying,searching and crying for more than one month, I finally get it working today in my laptop (Dell Inspiron 6400) 🙂 – I am one of the happiest ever in this world right now :D. here’s how to. All the credit goes to “kayvortex”

Model of my wifi card is “Broadcom BCM4328 802.11a/b/g/n (rev 01)”

Steps

1. Install Ndiswrapper Common and Ndiswrapper Utils (You can do it using synaptic)
2. Download The Driver from ftp://ftp.dell.com/network/R151517.EXE and unzip it somewhere. You will see a folder named DRIVER
3. Execute the following commands

sudo ndiswrapper -i /download_directory/DRIVER/bcmwl5.inf sudo ndiswrapper -l sudo modprobe ndiswrapper

4. Then, set ndiswrapper to load on startup:
sudo ndiswrapper -m gksudo gedit /etc/modules

and add the following module to the list

ndiswrapper

5. Restart (This is a must)

Now you can use Fn+F2 to turn on your wifi 😀 )

CookieJar in CURL – It Sucks

April 18, 2007 ·

I was working with Linked in authentication management these days for one of my project where I have to loginto linked in using user’s credentials and fetch personal information and then display it in different form. My code was working properly in local machine, 3 different LAMP servers and one windows server. But finally when I deployed the code in production box, it fails. I quickly found that the cookiejar was not created for some permission problem. I tried to figure out what went wrong but I cant.

1. My script has the permission to create file in that directory on the fly

so there shouldn’t be any problem with this cookie jar and curl, but there was. So hours after hours i spend on it to find the reason and finally I decide to go without cookie jar. And If I don’t use cookie Jar, I have to manually parse the cookies sent to me after login and then set those cookies to my next request so that Linked in recognize me as a “coming back call after login”. I did that and my script worked pretty fine.

Fuck cookie jar in curl. Why the hell the developers didn’t provide a way to override to manage cookies??

If you are interested to know how did I solve it, let me explain a bit.

I set CURLSETOPT_HEADER to true so that I get back the header info
curl_setopt($ch, CURLOPT_HEADER, 1);

and then I parse that header info and extracted the cookies
$end = strpos($header, “Content-Type”);
$start = strpos($header, “Set-Cookie”);
$parts = split(“Set-Cookie: “,substr($header, $start, $end-$start));
$cookies = array();
foreach ($parts as $co)
{
$cd = split(“;”,$co);
if (!empty($cd[0]))
$cookies[] = $cd[0];
}

I will replace this section with RegEx

and finally I set those cookies to my next request using CURLSETOPT_COOKIE
curl_setopt($ch, CURLOPT_COOKIE, implode(“;”,$cookies));

Thats it!! It works pretty fine without cookie jar.

NOTE: I know that cookiejar is a very useful feature for curl users as it automates the cookie management. But I am saying “fuck cookiejar” because developers of curl didn’t provide any way to override cookie management process. If they give us way to use cookijar with any other options beside disk files, it would be beautiful. But in fact I am a big fan of this cookijar feature of curl, except the selfish automation.

The Storyteller

Rise Of The Machines