Wednesday, November 21, 2012

HTML5 Drag and Drop example tested in Chrome,IE(7-9),FF

I was looking for HTML5 drag and drop example on google so i came across w3schools example and the code worked fine on their own online editor. Then i copied the same code inside an html file that i created locally on my system. After running local html file inside different browsers the script went against my expectations and refused to work inside IE.

I went back to w3schools editor with the working code and checked if any extra javascript code was included but found nothing additional there.

I was a bit disappointed and returned back to my local script. I had no option but to find the solutions for IE errors. When i googled the errors, it occured the methods used inside javascript code were not available inside IE. Anyway i debugged the code and fixed all the IE specific errors which took exceptional time. Thanks to IE developer tool that helped me a lot and thanks to w3schools example who led me to the errors.

After wasting lot of time in fixing w3schools example i thought why not i put it on my blog so that someone else's time would not be wasted. Hope this helps.

Below link has the example script.

Friday, November 9, 2012

MySQL Function to Calculate x time ago from a particular date

Couple of days ago i was searching for a function in MySQL that could calculate time difference of a particular time with current time and return string like "3 minutes ago" or "2 days ago" and etc. I came across many functions for PHP but no MySQL. So i picked a PHP function and converted it to MySQL function. I used the PHP script from by Tom Elliot.

MySQL script to create this function is


DROP FUNCTION IF EXISTS `fn_x_time_ago`$$

CREATE DEFINER=`root`@`localhost` FUNCTION `fn_x_time_ago`(old_time DATETIME) RETURNS VARCHAR(100) CHARSET latin1
DECLARE the_result VARCHAR(100) DEFAULT '';
DECLARE time_difference INT(11);

IF (time_difference > (60*60*24))
THEN SELECT CONCAT(ROUND(time_difference/60/60/24)," days ago") INTO the_result;
ELSEIF (time_difference > (60*60))
THEN SELECT CONCAT(ROUND(time_difference/60/60)," hours ago") INTO the_result;
ELSEIF (time_difference > (60))
THEN SELECT CONCAT(ROUND(time_difference/60)," minutes ago") INTO the_result;
ELSEIF (time_difference > (0))
THEN SELECT CONCAT(time_difference," seconds ago") INTO the_result;
RETURN the_result;


Name of MySQL function is fn_x_time_ago. It takes a date as argument. So the query to call this function will become.

SELECT fn_x_time_ago('2012-11-10 10:15:00');

Sunday, September 23, 2012

Zend Framework doesn't support bulk inserts

Frameworks have definitely made life easier for a developer. Specially web applications who always face a threat of being hacked, if developed from scratch. But today, developers of these applications worry no more about making applications safe from hacking. Framework do this job for them. They only need to follow the framework's recommendations.

Many of the modern frameworks provide their own api's for doing common tasks. For example if we were to develop a database driven application we are required to do simple sql related tasks like insert, select or update. DB related tasks are handled by DB related api's of framework and contain method for almost every sql operation.

Couple of days ago i got a chance to play around Zend Framework version 1.11. After seeing the depth of this framework with endless possibilities i became a fan of it. Although Zend Framework documentation need lot of improvements, but O my! they might be the first to adopt PHP 5.3 features like closures and namespaces for their Zend Framework 2.

Unfortunately, there is one part i was said to find out inside about Zend Framework that it cannot do multiple/bulk or batch insert in one query. I know what you guys are thinking about.

"Even the simplest PHP/MySQL frameworks have bulk insert feature".

If Zend Framework has a room left for a feature, we would love to have this one implemented.

Wednesday, February 22, 2012

Make Facebook application or page without purchasing SSL

Facebook has put restrictions over developers to make Facebook pages and apps secure. Now the question is how to secure our pages and apps on Facebook. To secure your pages and apps, you need to purchase SSL license for the domain on which your app or page is hosted. There are different companies out there who sell SSL license online. The price of SSL license start from $9 and goes on.

Although price of a SSL license is cheap but it not FREE. Lot of developers are seeing this restriction really annoying. Due to new restrictions the old Facebook apps and pages have stopped working.

But no worries my dear developer friends. If your Facebook page and app is not dynamic and consist of Javascript and HTML you guys can host them on Dropbox.

Dropbox is a file hosting/sharing service. Dropbox allows you to upload files and then you can get links for each file for web browsing.

GO to Dropbox website.
Download their application for Windows/Mac. Whatever OS you are using. INSTALL IT.
[For Windows]
After installing Dropbox application will ask to make new account. Fill the form and you are done with Dropbox setup.
Go inside My Document -> Dropbox->Public.
make a folder naming your Facebook app/page. Like mine is 'myfacebookapp'
copy all your app/page files inside your folder.
If you have index.html as default file to run. Right click on it and Select Dropbox->copy public link.
You will get a link like.

Now go to your app/page settings in Facebook developer account.
Edit your app settings.

[For App]
Canvas URL:
Secure Canvas URL:

[For Page]
Page Tab URL:
Secure Page Tab URL:

P.S: Don't forget to put trailing slash '/' at the end of each URL, otherwise you will get an error.

And here you go.

Saturday, January 21, 2012

jQ.Mobi another smartphone/tablet web application development api lanched

Why we prefer smart phones over old non-smart phones. You guys are right, they are capable of storing more contacts, messages and notes. But there is one another advantage they have on old phones.

"Let me call them old phones, because they are old and not smart."

Yes, they have a relatively efficient/new web browser and lots of third party applications. Old phones are also not getting updates that is why their web browsers can only show websites which contain WAP or HTML4 content. According to a survey smart phone users spend more time on applications rather than using internet on mobile's browser. This mean a huge cloud of third party applications is the only reason behind buying a smart phone.

But some of you might not agree with the above conclusion. Third party applications are also available for almost every old handset. They are not productive and easy to use as compared to Computer applications, but they still exist. Today, when we buy a smart phone we expect that its applications will give us a experience close to computer application. People are now looking at smart phones and tablets as an alternative of a computer.

For publishers it is like the biggest hurdle, because there are lot of brands of smart phones out there in market.

"From publishers i mean companies who make applications/softwares. Now don't get confused by the word software, it is another name for application."

If publishers want their application made to run on each brand's smartphone/tablet. They will have to create departments to develop application for each brand. Every department require employees with relevant skills. Now you understand why it is a hefty job?

These companies thought their way out of this problem by identifying, which application is by default available in every smartphone.

"Applications which are already available inside a new device are called default applications. Company install them on the device and they cannot be removed by any user."

They found out that web browser is the only application which is available in every smart phone and tablet by default. So companies started developing api's or libraries which can be used to make applications. These libraries are consist of HTML and javascript files. By including these api's, applications use resources of web browser available inside the smartphone/tablet. Due to the heavy use of javascript in these api's, applications some time run slow on the smartphone. Although these api's are facing compatibility issues, but they are still popular inside the publishers because they run on almost every smartphone/tablet.

jQ.Mobi is another api/library for making mobile applications. They have specially optimized their api to avoid lag or slow down while running on mobile devices. Although their api is in beta testing phase, but i hope pretty soon they will capture nice share of mobile application development.

Saturday, January 14, 2012

Grooveshark's HTML5 app is on the news

It is everywhere on the internet that Grooveshark has launched beta version of their music app created in HTML5. Yes, it is a big moment for HTML5 and a good alternative of mobile native app. It occurred that Grooveshark moved towards their web app after getting their native iOS app removed from Apple App Store. The fun part is that you can now access Grooveshark app on any modern browser.

Being a tech savvy person, i was interested to know which mobile api they used for transitions and touch capabilities. Because there are mobile api's available on the internet like jQueryMobile and Sencha Touch. But unfortunately, i got no clue about the api after seeing the source code of their web app. Although jQuery is being used inside the minified javascript files Grooveshark used in their app. Although mobile web apps have a past of being laggy on mobile browsers, but Grooveshark's beta app run smoothly on iOS browser with a simple layout and small footprint of javascript.

HTML5 Tag Check
HTML5 new tags like header, footer, article, section and nav are not used inside the app. Basically due to their limited implementation on mobile browsers. On the other hand they have used script text/templates to speed up client side rendering and updating. Facebook sharing tags are also implemented inside the source to make it available for sharing within your friends.

Wednesday, January 11, 2012

StencylWorks a nice tool to easily make games without coding

Games are now getting more popular than movies. Major proportion of game revenue is coming from mobile devices. Even on the freelance websites now most of the outsourced work is related to gaming. After the evolution of powerful mobile devices called smart phones, developers are now capable of making more detailed,eye catching games. Companies like Rovio and Zynga made a fortune by selling their games for web and mobile platforms. Flash gaming is still unbeatable on web giving birth to HTML5 games. No doubt the importance of traditional console or PC gaming is there, but companies are now making mobile versions of their game as well. Game making tools which support variety of platforms are now becoming popular within game developers.

The previous paragraph is all about Corporate GIANTS making cash by developing games with their HUGE studios and a list of teams named inside the credits of their game. But you should not let your hopes run dry, because they also took a start from one or two guys. If your game idea is unique then you should go for it. Think about the guy who gave the idea of ANGRY BIRDS, he was also like us. Once you are done with your game idea, pick a tool that can develop your game easily and quickly. Thats where StencylWorks comes in.

StencylWorks is a FREE game making tool by Stencyl company. It is available for Windows, Mac and Linux. Currently it can publish games to flash,iPhone and iPad but Stencyl has future plans to extend its tool to also publish games for android and HTML5. StencylWorks has a nice website containing a wiki and an active forum to get started with it. StencylWorks is free for the whole development and testing of games on flash and iOS. But to publish your game on App Store you need to purchase their license.