Web PHP programming and more

FreshBooks API JavaScript Library

rukavina — Mon, 16 Mar 2009 18:16:12 +0000

As I mentioned already, here I’ll explain the motivation, the idea and the implementation of freshbooks api javascript library. Rich client web applications are trend. There are a lot of processing which could (and should) be moved from a server to a client machine. There are different technologies to achieve this, but browser native javascript is most common way. There are plenty of powerful javascript frameworks. That’s why I think is always useful to have js library which communicates with web services and APIs with none or minimum usage of server side technology which in many cases does nothing more than spends server resources in order to generate web page interface.

Still there’s one important limitation. Browsers will NOT allow cross-domain AJAX calls. For example, if your web page executes on www.mypage.com you cannot call www.freshbooks.com from ajax – and that’s what we need here. That’s why I created proxy php script which has to reside on the same domain as your js and htm files. Our ajax script calls proxy and proxy gets content from freshbooks.com with no limitations. So we have one extra step, but it should work.

Another approach could be to use flash component like flXHR without extra server side proxy scripts. BTW. cross domain ajax calls will probably be supported/allowed in new browser versions (like FireFox 3.1).

Here’s demo usage:

Test Ajax JS

FreshBooks API js library Example

As you can see it doesn’t differ too much from php version even though porting is not trivial, mainly because javascript OO concept is primitive compared to php 5 (even php 4).

Please take a look at js library documentation and native XML freshbooks api documentation in order to learn more.

DOWNLOAD FRESHBOOKS API JAVASCRIPT LIBRARY

PROJECT PAGE

FreshBooks API PHP 5 Library

rukavina — Sun, 15 Mar 2009 10:35:21 +0000

If you are interested in SAAS concept (as I am) I’m sure you have heard of FreshBooks . This is an great and easy to use online invoice, time tracking and expence service. In my opinion this kind of software has a great potential. I suppose at the moment it cannot have big companies as clients. Still majority of companies are not so big I guess – so that market must be huge.

As a developer I’m more intereset in API they offer. Like their user interface and general usability, the API request/response XML structures are nice, consistent and simple. Actually, you don’t have to deal with XML – there are some 3rd party libraries for various languages. Yet, I was not impressed with php/symphony library. I was thinking of something more zend framework like object oriented implementation. So I decided to offer my own implementation.

Here’s sample usage:

//include particular file for entity you need (Client, Invoice, Category…)
include_once “library/FreshBooks/Client.php”;

//you API url and token obtained from freshbooks.com
$url = “your-url-please-replace”;
$token = “your-token-please-replace”;

//init singleton FreshBooks_HttpClient
FreshBooks_HttpClient::init($url,$token);

//new Client object
$client = new FreshBooks_Client();

//try to get client with client_id 3
if(!$client->get(3)){
//no data – read error
echo $client->lastError;
}
else{
//investigate populated data
print_r($client);
}

//new invoice example

//new Invoice object
$invoice= new FreshBooks_Invoice();
//populate data
$invoice->clientId = 123;
$invoice->date = ’2009-06-03′; //mysql format
…//all other required properties should be populated
//lines (items) is array of asoc. arrays
$invoice->lines = array(
//1st item
array(
‘name’=>’xyz’,
‘unitCost’=>99.99,
…//all other required properties should be populated
),
//2nd item
array(
‘name’=>’yyy’,
‘unitCost’=>199.99,
…
)
…
);
//try to create new invoice with provided data on FB server
if(!$invoice->create()){
//read error
echo $invoice->lastError;
}
else{
//investigate populated data
print_r($invoice);
}

//new client example

//new Client object
$client = new FreshBooks_Client();

//populate client’s properties
$client->email = ‘test@test.com’;
$client->firstName = ‘Chad’;
$client->lastName = ‘Smith’;

…//all other required properties should be populated

//try to create new client with provided data on FB server
if(!$client->create()){
//read error
echo $client->lastError;
}
else{
//investigate populated data
print_r($client);
}

?>

Should be simple enough. For more details please refer to library documentation and freshbooks api.

Also, here’s bonus tool for raw communication with freshbooks api using AJAX. You can download the source from here.

I’m about to post javascript port of this library. I hope it should find its use in numerous rich client javascript applications.

DOWNLOAD LIBRARIES

PROJECT PAGE

Don’t Forget to Index Database Tables

rukavina — Sat, 27 Dec 2008 07:16:19 +0000

Your dynamic web page opens too slow? Your desktop application window freezes during a query execution? The most common cause of these problems is lack of proper indexes on tables. During a development of a web application in particular, it’s hard to notice this problem – there’s just test data, your are using local development server without real life load and everything seems to be working just fine. Then you launch a site, it’s DB grows and pages start to open slower and slower and finally server even stops responding.

phpmyadmin

It makes really big difference for big tables and complex queries to have and not to have proper indexes set up. Image unsorted address book and looking for “Smith Chad”. He can be anywhere in the book – in worst case scenario you’ll have to go through all entries for the book to find that one. But if you have alphabetically sorted address by by last name and “tabs” for each first letter than you’ll be able to jump to “S” and in the worst case scenario just go through all entries starting with “S”. So this is much faster search, right?

So if your database structure is OK then all you have to do is just set up indexes. But which fields should be indexed, which indexes should include multiple fields? Basically all foreign-key fields should be indexed – it helps a lot db server to return JOIN queries faster. But in general you will need to analyze each particular query especially WHERE clause. Fields existing in a WHERE condition should be included in an INDEX. Of course, you should use optimization tools as much as possible. For example if your DB is MySQL there is test query syntax EXPLAIN – just execute the same query with the word “EXPLAIN” before the SELECT. The output will inform you if keys and indexes are being used and which ones.

Sometimes it’s even hard to find “slow” query. By you can prepare your code to track it down. You could create your own query function to encapsulate mysql_query

$time_before = microtime();

$result = mysql_query(SQL_QUERY);

$time_after = microtime();

if(($time_after – $time_before)/1000 > 1) log_this_query(SQL_QUERY)

This way can log (save to database or file) queries which last more than 1 second. Basically similar kind of logging exist on the database system level but generally is not available on shared hosts.

Multilingual (multilanguage) web applications

rukavina — Sat, 13 Dec 2008 09:07:42 +0000

Developing multilanguage web applications (internationalization i18n , localization l10n) is not trivial. You should integrate multilanguage support on 3 levels at least. As your application should have MVC layers, your localization should be applied on Model, View and Controller as well. I’m going to write here about strategies to accomplish this on each level.

Model

Let’s say we have simple news application with db table news: news_id, title, content and we want to extend this model to accept Spanish language as well. There are at least 2 approaches:

we can add 2 new fields: es_title and es_content
we can add new table news_translation with columns: translation_id, news_id, language, title, content

While the approach 1. is straightforward 2. is much more flexible – if you want to extend an application to support French for example you don’t have to change database structure again. For each language you have one row in the translation table while original table stores common entity data and primary language translation.

In both scenarios you’re expected to have utility functions to encapsulate db read/write in the context of particular row, for example get_field_value($row,$field_name, $language).

View

It’s expected to have html views (templates) separated from a (php) code. Localized version could use separate templates but it’s always good idea to have as much as possible reusable elements. Instead of have labels and text hard coded you have them populated dynamically based on the current language and common dictionary. The dictionary itself could be implemented as an include file or database table which should be more flexible to be maintained by end users.

News
becomes
{NEWS_HEADING}

Controller

It’s last but not least important part of interationalization of web application. It’s very important that each page for each language has unique URL. Lets say we have a page news.php:

English url: example.com/news.php
Spanish url: example.com/news.php

This is no good! Both languages share the same url, probably distinction is implemented using session variable but it has to be globally unique url. Image you want to send a friend spanish version of this page, and there’s a problem since both links are the same. Also we live the internet run by search engines and they are very confused to have completelly different content in one address – or ost likely they will be unable to get and index one version

English url: example.com/en/news.php
Spanish url: example.com/es/news.php

This is much better. Each file is in separate folder. Note that it doesn’t have to be physically it’s a common solution to use web server’s url rewrite engine and target the same file which takes language code (es, en) as a paramater and produces html output (view + model) based on it.

Still this might not be good enough for search engines. news.php doesn’t mean anything in spanish and words in urls are very imprtant for search engines. So this would be the best version:

English url: example.com/en/news.php
Spanish url: example.com/es/noticias.php

Creating Google Visualization Data Source in PHP

rukavina — Fri, 05 Dec 2008 18:22:36 +0000

Google Visualization

Sooner or later your web application needs some kind of graph, chart or similar. Google has really cool API for this purpose – Google Visualization API. It’s client side javascript library, and the output is SVG or flash SWF depending on particular graph. But like with any output you can control this from php.

It’s pretty simple, here’s an example of html/js source.

So you simply include remote js file:

then load particular “package”:

google.load(‘visualization’, ’1′, {packages:['piechart']});

inform library which method to call on load:

google.setOnLoadCallback(drawChart);

and write that method:

function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn(‘string’, ‘Task’);
data.addColumn(‘number’, ‘Hours per Day’);
data.addRows(5);
data.setValue(0, 0, ‘Work’);
data.setValue(0, 1, 11);
data.setValue(1, 0, ‘Eat’);
data.setValue(1, 1, 2);
//…
var chart = new google.visualization.PieChart(document.getElementById(‘chart_div’));
chart.draw(data, {width: 400, height: 240, is3D: true, title: ‘My Daily Activities’});
}

Note that your HTML needs to have DIV with id chart_div where graph is to show up.

Not too complex, but how to control data, how to dynamically populate chart values from database for example. You can always manipulate html, js output and parse dynamically using php js code lines. It’s possible but it becomes messy soon. It’s much better way to develop data source which outputs JSON and change your code a bit:

function drawChart() {
var dsURL = ‘http://datasourceurl‘;
var query = new google.visualization.Query(dsURL);
//cal query and set handle function
query.send(handleQueryResponse);
}

define callback method to handle response from datasource:

function handleQueryResponse(response) {
if (response.isError()) {
alert(‘Error in query: ‘ + response.getMessage() + ‘ ‘ + response.getDetailedMessage());
return;
}
//get data
var data = response.getDataTable();
var chart = new google.visualization.PieChart(document.getElementById(‘chart_div’));
chart.draw(data,{width: 700, height: 400, is3D: true, title: ‘Sold Cars in 2007′});
}

Key question is how to develop data source? Here google provided specification http://code.google.com/apis/visualization/documentation/dev/implementing_data_source.html

In order to organize my code better I create a simple class class.GVisDS.php which could be helpful. Here’s sample usage:

//create DS object
$ds = new GVisDS();
//define cols
$ds->addColumn(“country”,”string”,”Country”);
$ds->addColumn(“sold”,”number”,”Sold Cars”);
//add data rows
$result = mysql_query(“SELECT * FROM sold_cars_country”);
if($result && mysql_num_rows($result)){
while($l = mysql_fetch_assoc($result)){
$ds->addRow(array(
“country” => $l['country_code'],
“sold” => $l['amount']
));
}
}
echo $ds->getJSResponse();

So it reads data for sample table sold_cars_country which has 2 columns: country_code and amount. At the end it just prints out JS response (JSON array).

Timeline

Take a look at live examples:

How Does Google Make All Those GDATA APIs?

rukavina — Sat, 29 Nov 2008 11:27:44 +0000

GDATA Atom Logo

If you have ever visited this page http://code.google.com/apis you would find impressive number of available APIs to use google services in your own applications. Some of them have specific way to be included in your projects but most of them use a common platform. Google call it GDATA. It’s both format specification for the data to be received and sent to/from clients and the protocol how to do that. Actually there isn’t much of new technology it’s all about xml and http and that’s why it’s simple and great. To be more precise it’s not even new specification but it’s an extension to atom syndication xml format and atom publication protocol (AtomPub). So it’s really great that behind this there is a standard so there must be great tools and libraries to create and use atom based services like google gdata apis.

Google APIs Page

Actually yes and no. Yes, there are a lot of client libraries but what if you want to create your own api – your own atom based service/server? I’m particularly interested in some kind of php framework to do so. Imagine you have great mysql-php web application (SaaS if you feel geeky) and you want to extend it to create another interface, not human readable like web page but to expose data to be processed by other software. Should you write custom interface: custom protocol and custom data? Should you write SOAP web service functions ? Last one could be easy since it has good support for all programming languages and development tools – it’s almost as easy as writing or calling local methods. The problems is that each api has it’s own set of methods and complex in/out parameters. Basically all we need is just 4 methods to manage the world (or any data entity): Create, Retreive, Update, Delete or in http terminology: Post, Get, Put, Delete. Defining data format to be transferred is more complex but atom is good enough to start with. But what about common framework or platform? For example youtube existed before google bought it and provided us youtube api to read and write youtube data, as well as their other service. I’m sure they have common framework to be extended for particular service.

After googling I found these:

http://www.isolani.co.uk/blog/atom/PhpAtomApiImplementation
http://code.google.com/p/php-atompub-server/

While these are great to explore possibilities, I was looking for something MVC like, to share similar philosophy with cakephp, codeigniter etc. but to produce Atom XML input/output instead of human readable (x)html. I decided to start my own project Atom Php Framework. It’s based on just a few classes to be extended to develop custom AtomPub server: controller, parser, model and atom elements.

APF component diagram

I’m looking forward to seeing your comments or maybe “insider” information which could help us answer the heading question. Bottom line is that php community really needs common platform to develop AtomPub services.