PHP Universal Feed Generator (supports RSS 1.0, RSS 2.0 and ATOM)

It’s been a while since I’ve planned on developing a RSS writer that fulfills most my needs by supporting the various feed formats. Although the necessity was the prime force behind it, a discussion with Hasin and Emran has put the actual fire in. We were discussing about what can be added next in the Orchid – “PHP framework for the rest of us” and suddenly it hit me. At last, it’s finally complete and I’ve named it “PHP Universal Feed Generator“, as it generates both ATOM and RSS feeds.

Supported versions:

  • RSS 1.0 (which officially obsoleted RSS 0.90)
  • RSS 2.0 (which officially obsoleted RSS 0.91, 0.92, 0.93 and 0.94)
  • ATOM 1.0

Download:

Features:

  • Generates RSS 1.0, RSS 2.0 and ATOM 1.0 feeds
  • All feeds are are validated by feed validator.
  • Supports all possible feed elements.
  • Simple and easy to define channel and feed items
  • Implements appropriate namespaces for different versions.
  • Automatically converts date formats.
  • Generates UUID for ATOM feeds.
  • Enables usage of subtags and attributes. (example: image and encloser tags)
  • Completely Object oriented in PHP5 class structure.
  • Handles CDATA encoding for required tags.
  • Nearly same code for generating all kinds of feed

A minimum example

It’s a minimum example of using this class. I am generating a RSS 2.0 feed from retrieved data from a MySQL database. There are more examples in the download package for different versions.

<?php
  <span style="color: #008000;">// This is a minimum example of using the Universal Feed Generator Class</span>
  include(<span style="color: #006080;">"FeedWriter.php"</span>);

  <span style="color: #008000;">//Creating an instance of FeedWriter class. </span>
  $TestFeed = <span style="color: #0000ff;">new</span> FeedWriter(RSS2);

  <span style="color: #008000;">//Setting the channel elements</span>
  <span style="color: #008000;">//Use wrapper functions for common channel elements</span>
  $TestFeed-&gt;setTitle(<span style="color: #006080;">'Testing &amp; Checking the RSS writer class'</span>);
  $TestFeed-&gt;setLink(<span style="color: #006080;">'http://www.ajaxray.com/projects/rss'</span>);
  $TestFeed-&gt;setDescription(<span style="color: #006080;">'This is test of creating a RSS 2.0 feed Universal Feed Writer'</span>);

  <span style="color: #008000;">//Image title and link must match with the 'title' and 'link' channel elements for valid RSS 2.0</span>
  $TestFeed-&gt;setImage(<span style="color: #006080;">'Testing the RSS writer class'</span>,<span style="color: #006080;">'http://www.ajaxray.com/projects/rss'</span>,<span style="color: #006080;">'http://www.rightbrainsolution.com/images/logo.gif'</span>);

    <span style="color: #008000;">//Retriving informations from database</span>
    mysql_connect("server", "mysql_user", "mysql_password");
    mysql_select_db("my_database");

$result = mysql_query(“Your query here”);

 

    <span style="color: #0000ff;">while</span>($row = mysql_fetch_array($result, MYSQL_ASSOC))
    {
        <span style="color: #008000;">//Create an empty FeedItem</span>
        $newItem = $TestFeed-&gt;createNewItem();

        <span style="color: #008000;">//Add elements to the feed item    </span>
        $newItem-&gt;setTitle($row[<span style="color: #006080;">'title'</span>]);
        $newItem-&gt;setLink($row[<span style="color: #006080;">'link'</span>]);
        $newItem-&gt;setDate($row[<span style="color: #006080;">'create_date'</span>]);
        $newItem-&gt;setDescription($row[<span style="color: #006080;">'description'</span>]);

        <span style="color: #008000;">//Now add the feed item</span>
        $TestFeed-&gt;addItem($newItem);
    }

  <span style="color: #008000;">//OK. Everything is done. Now genarate the feed.</span>
  $TestFeed-&gt;genarateFeed();
?&gt;

Shhhh….a universal feed reader is on the way 😉

PHP UUID generator function

Universally Unique Identifier is an identifier standard which is used in a varieties of software construction. When I was writing the RSS Writer class for Orchid, I needed to generate UUID to implement with ATOM id. I searched the web for a simple solution, but didn’t find any that suffices my need. Then I wrote the following function to generate it. I’ve use the standard of canonical format here.

Let’s take a look what Wikipedia has to say about the format of UUID :

A UUID is a 16-byte (128-bit) number. The number of theoretically possible UUIDs is therefore 216*8 = 2128 = 25616 or about 3.4 × 1038. This means that 1 trillion UUIDs would have to be created every nanosecond for 10 billion years to exhaust the number of UUIDs.

In its canonical form, a UUID consists of 32 hexadecimal digits, displayed in 5 groups separated by hyphens, in the form 8-4-4-4-12 for a total of 36 characters.

Enough said. Here is the function.

<span style="color: #008000">/**</span>
<span style="color: #008000">  * Generates an UUID</span>
<span style="color: #008000">  * </span>
<span style="color: #008000">  * @author     Anis uddin Ahmad &lt;admin@ajaxray.com&gt;</span>
<span style="color: #008000">  * @param      string  an optional prefix</span>
<span style="color: #008000">  * @return     string  the formatted uuid</span>
<span style="color: #008000">  */</span>
  <span style="color: #0000ff">function</span> uuid($prefix = <span style="color: #006080">''</span>)
  {
    $chars = md5(uniqid(mt_rand(), true));
    $uuid  = substr($chars,0,8) . <span style="color: #006080">'-'</span>;
    $uuid .= substr($chars,8,4) . <span style="color: #006080">'-'</span>;
    $uuid .= substr($chars,12,4) . <span style="color: #006080">'-'</span>;
    $uuid .= substr($chars,16,4) . <span style="color: #006080">'-'</span>;
    $uuid .= substr($chars,20,12);

    <span style="color: #0000ff">return</span> $prefix . $uuid;
  }

 

Example of using the function –

<span style="color: #008000">//Using without prefix.</span>
echo uuid(); <span style="color: #008000">//Returns like ‘1225c695-cfb8-4ebb-aaaa-80da344e8352′ </span>
 
<span style="color: #008000">//Using with prefix</span>
echo uuid(‘urn:uuid:’);<span style="color: #008000">//Returns like ‘urn:uuid:1225c695-cfb8-4ebb-aaaa-80da344e8352′</span>
 

 

See you.

UPDATE : The PHP Universal Feed Generator class, for which I wrote this function is released.

UPDATE : The method of getting random string changed based on Davids comment. (Thanks to David)

How to avoid POSTDATA resend warning

"POSTDATA resend" warning is a common problem when developing web applications. Before discussing about the solution, let’s know what is the problem actually and when it arises.

About the problem :

We see this warning when we try to revisit a page that has accepted POSTDATA using browser’s history mechanism. Usually we do it by browser’s BACK button or refreshing a page. When a page in browser history requested with POST method, the browser thinks this POSTDATA is important to process this page. So, it asks the user if he wants to send the POSTDATA again or not. Different browsers show this warning differently. For example, the images below shows how Firefox and Internet Explorer show this warning.

POSTDATA_resend_mozilla

POSTDATA resend warning in Mozilla Firefox

POSTDATA_resend_ie

POSTDATA resend warning in Internet Explorer

 

Now, If the user accepts the confirmation, the page is reloaded with previously sent data using POST method; otherwise some browsers don’t take any action and some shows a "Webpage has expired" message. In some situations, this re-submitting is useful, but most of the times it’s not expected. It’s more harmful when user accepts it without understanding and causes multiple entries of previously entered data in database.

The easy solution :

The easy solution is simply redirecting. When we redirect a page, the target page is loaded without any POST data that comes with request.

Let’s solve this problem by hand. Say we have 2 pages – A and B. A has a feedback form which submits data by POST request method to B. B inserts the information into database and shows a success message.

Now, if the user try to reload the page by refresh, back button or any other way, browser will show the confirmation message. If user accepts this, the message will inserted again. But after inserting to database, If we redirect to another page C and C shows the success message, the problem will not occur. Because, in the final output to the browser will come from C which didn’t use any POST request data. The code should be something like this:

&lt;?php
<span style="color: #0000ff">if</span>($_POST)
{
  <span style="color: #008000">/* Form validation, Inserting to database or anything you want goes here */</span>
  
  <span style="color: #008000">/* Now redirect to another page */</span>
  header(<span style="color: #006080">'Location: http://yoursite.com/success.php'</span>);
}
?&gt;

 

Extending the solution :

The solution I explained above can show just an static message like "Thanks for your feedback" or "Registration completed successfully" etc. But usually we like to include some information about sender or submitted information in the success of failure message. For example:

Hi Andrew, your registration is successfully completed. An email is sent to you at andy001@yahoo.com with more information.

In the above message, the purple colored information has to be taken from POST data. But the POST data will be lost when redirecting. So, it’s not possible by the above solution.

What we can do to solve this is that we can use SESSION to store those data which we want to display with message in redirected page. Just like this:

&lt;?php
session_start();
&#160;
<span style="color: #0000ff">if</span>($_POST)
{
  <span style="color: #008000">/* Form validatio, Inserting to database or anything you want goes here */</span>
  
  <span style="color: #008000">//Store data to session</span>
  $_SESSION[<span style="color: #006080">'name'</span>]   = $_POST[<span style="color: #006080">'name'</span>];
  $_SESSION[<span style="color: #006080">'email'</span>]  = $_POST[<span style="color: #006080">'email'</span>];
  
  <span style="color: #008000">//Now redirect to another page </span>
  header(<span style="color: #006080">'Location: http://yoursite.com/success.php'</span>);
}
?&gt;

 
In the target page, when showing the success message, we can get the information from SESSION easily.
 
Hope this will solve your problem. Please tell me if any confusion or question with this article.  See you again.

Interactive character limit for textarea using Jquery

For a textbox, character of a field can easily be limited with maxlength attribute. But maxlength doesn’t work for  a textarea. So, It needs an alternate way. For one of my project, I wrote a function for this purpose where I used jQuery. Here I am explaining how I did it.

Let’s look an example of this interactive solution here

OK. Now we will make this in 2 easy steps.

1. Import your jQuery file and write the function "limitChars(textid, limit, infodiv)" in the head section of your page.

This function takes 3 parameters. They are:

  • textid : (string) The ID of your textarea.
  • limit : (num) The number of character you allow to write.
  • infodiv : (string) The ID of a div, in which limit information will be shown .

  Here is the function:

<span style="color: #606060"> 1:</span> &lt;script language=<span style="color: #006080">&quot;javascript&quot;</span> src=<span style="color: #006080">&quot;Jquery.js&quot;</span>&gt;&lt;/script&gt;
<span style="color: #606060"> 2:</span> &lt;script language=<span style="color: #006080">&quot;javascript&quot;</span>&gt;
<span style="color: #606060"> 3:</span> <span style="color: #0000ff">function</span> limitChars(textid, limit, infodiv)
<span style="color: #606060"> 4:</span> {
<span style="color: #606060"> 5:</span> <span style="color: #0000ff">var</span> text = $(<span style="color: #006080">'#'</span>+textid).val(); 
<span style="color: #606060"> 6:</span> <span style="color: #0000ff">var</span> textlength = text.length;
<span style="color: #606060"> 7:</span> <span style="color: #0000ff">if</span>(textlength &gt; limit)
<span style="color: #606060"> 8:</span> {
<span style="color: #606060"> 9:</span> $(<span style="color: #006080">'#'</span> + infodiv).html(<span style="color: #006080">'You cannot write more then '</span>+limit+<span style="color: #006080">' characters!'</span>);
<span style="color: #606060"> 10:</span> $(<span style="color: #006080">'#'</span>+textid).val(text.substr(0,limit));
<span style="color: #606060"> 11:</span> <span style="color: #0000ff">return</span> <span style="color: #0000ff">false</span>;
<span style="color: #606060"> 12:</span> }
<span style="color: #606060"> 13:</span> <span style="color: #0000ff">else</span>
<span style="color: #606060"> 14:</span> {
<span style="color: #606060"> 15:</span> $(<span style="color: #006080">'#'</span> + infodiv).html(<span style="color: #006080">'You have '</span>+ (limit - textlength) +<span style="color: #006080">' characters left.'</span>);
<span style="color: #606060"> 16:</span> <span style="color: #0000ff">return</span> <span style="color: #0000ff">true</span>;
<span style="color: #606060"> 17:</span> }
<span style="color: #606060"> 18:</span> }
<span style="color: #606060"> 19:</span> &lt;/script&gt;

Remember, the script is using jQuery. So be careful about the path of jquery at first line of this script.
 
2. Bind the function to the keyup event of your textarea. Do this in jQuery’s ready event of document. Just like this:
<span style="color: #606060"> 1:</span> $(<span style="color: #0000ff">function</span>(){
<span style="color: #606060"> 2:</span> $(<span style="color: #006080">'#comment'</span>).keyup(<span style="color: #0000ff">function</span>(){
<span style="color: #606060"> 3:</span> limitChars(<span style="color: #006080">'comment'</span>, 20, <span style="color: #006080">'charlimitinfo'</span>);
<span style="color: #606060"> 4:</span> })
<span style="color: #606060"> 5:</span> });

Here my textarea’s id is ‘comment’ , limit of characters is 20 and limit information will shown in a div whose id is ‘charlimitinfo’. That’s all, we have made an "Interactive character limiter" for our textarea using Jquery.
 
If you are not using jQuery for your site, it will not be wise to include it only for this script. You can get the same functionality from javascript without jquery. Look at this example. It looks like and works 100% as the previous though not using jquery.
Here you need just 2 changes. First, change the function "limitChars" as follows :
<span style="color: #606060"> 1:</span> <span style="color: #0000ff">function</span> limitChars(textarea, limit, infodiv)
<span style="color: #606060"> 2:</span> {
<span style="color: #606060"> 3:</span> <span style="color: #0000ff">var</span> text = textarea.value; 
<span style="color: #606060"> 4:</span> <span style="color: #0000ff">var</span> textlength = text.length;
<span style="color: #606060"> 5:</span> <span style="color: #0000ff">var</span> info = document.getElementById(infodiv);
<span style="color: #606060"> 6:</span>&#xA0; 
<span style="color: #606060"> 7:</span> <span style="color: #0000ff">if</span>(textlength &gt; limit)
<span style="color: #606060"> 8:</span> {
<span style="color: #606060"> 9:</span> info.innerHTML = <span style="color: #006080">'You cannot write more then '</span>+limit+<span style="color: #006080">' characters!'</span>;
<span style="color: #606060"> 10:</span> textarea.value = text.substr(0,limit);
<span style="color: #606060"> 11:</span> <span style="color: #0000ff">return</span> <span style="color: #0000ff">false</span>;
<span style="color: #606060"> 12:</span> }
<span style="color: #606060"> 13:</span> <span style="color: #0000ff">else</span>
<span style="color: #606060"> 14:</span> {
<span style="color: #606060"> 15:</span> info.innerHTML = <span style="color: #006080">'You have '</span>+ (limit - textlength) +<span style="color: #006080">' characters left.'</span>;
<span style="color: #606060"> 16:</span> <span style="color: #0000ff">return</span> <span style="color: #0000ff">true</span>;
<span style="color: #606060"> 17:</span> }
<span style="color: #606060"> 18:</span> }

 
And finally, call the function manually on keyup event of your textarea. Use "this" keyword for textarea instead of id when calling the function. example:
<span style="color: #606060"> 1:</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">textarea</span> <span style="color: #ff0000">name</span><span style="color: #0000ff">=&quot;comment&quot;</span> <span style="color: #ff0000">id</span><span style="color: #0000ff">=&quot;comment&quot;</span> <span style="color: #ff0000">onkeyup</span><span style="color: #0000ff">=&quot;limitChars(this, 20, 'charlimitinfo')&quot;</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 2:</span> <span style="color: #0000ff">&lt;/</span><span style="color: #800000">textarea</span><span style="color: #0000ff">&gt;</span>

Finished. We made the solution again without dependency of any javascript framework.

Please let me know if you have an idea to make it better. 

jQuery controlled Dependent (or Cascading) Select List 2

Thank you all. Thanx for using, commenting and visiting my script jQuery controlled Dependent (or Cascading) Select List from my old bolg http://php4bd.wordpress.com and here.

I am getting a lots of request and questions from visitors about adding some features and some other problems. Sometimes I faced some problem when using this script myself. So, I have made some changes here. I hope, this change will help you to overcome some problems of previous version of this script. The main features added in this version are:

  1. It will keep in child list box only sub items of selected parent value when initializing.
  2. Added a 4th parameter to input a selected value for child list box.
  3. When "isSubselectOptional" is true, add a default value ‘none’ for ‘– Select –‘ option of child list box.
  4. Automatically focus the child list box when a value is selected from parent list box.
  5. More effective for multilevel association.

Click here to see a demo of multilevel association using this function. here is same demo for jquery 1.3.x users.

Here is the modified function (for < jquery 1.3):

<span style="color: #606060"> 1:</span> <span style="color: #0000ff">function</span> makeSublist(parent,child,isSubselectOptional,childVal)
<span style="color: #606060"> 2:</span> {
<span style="color: #606060"> 3:</span> $(<span style="color: #006080">&quot;body&quot;</span>).append(<span style="color: #006080">&quot;&lt;select style='display:none' id='&quot;</span>+parent+child+<span style="color: #006080">&quot;'&gt;&lt;/select&gt;&quot;</span>);
<span style="color: #606060"> 4:</span> $(<span style="color: #006080">'#'</span>+parent+child).html($(<span style="color: #006080">&quot;#&quot;</span>+child+<span style="color: #006080">&quot; option&quot;</span>));
<span style="color: #606060"> 5:</span> 
<span style="color: #606060"> 6:</span> <span style="color: #0000ff">var</span> parentValue = $(<span style="color: #006080">'#'</span>+parent).attr(<span style="color: #006080">'value'</span>);
<span style="color: #606060"> 7:</span> $(<span style="color: #006080">'#'</span>+child).html($(<span style="color: #006080">&quot;#&quot;</span>+parent+child+<span style="color: #006080">&quot; .sub_&quot;</span>+parentValue).clone());
<span style="color: #606060"> 8:</span> 
<span style="color: #606060"> 9:</span> childVal = (<span style="color: #0000ff">typeof</span> childVal == <span style="color: #006080">&quot;undefined&quot;</span>)? <span style="color: #006080">&quot;&quot;</span> : childVal ;
<span style="color: #606060"> 10:</span> $(<span style="color: #006080">&quot;#&quot;</span>+child+<span style="color: #006080">' option[@value=&quot;'</span>+ childVal +<span style="color: #006080">'&quot;]'</span>).attr(<span style="color: #006080">'selected'</span>,<span style="color: #006080">'selected'</span>);
<span style="color: #606060"> 11:</span> 
<span style="color: #606060"> 12:</span> $(<span style="color: #006080">'#'</span>+parent).change( 
<span style="color: #606060"> 13:</span> <span style="color: #0000ff">function</span>()
<span style="color: #606060"> 14:</span> {
<span style="color: #606060"> 15:</span> <span style="color: #0000ff">var</span> parentValue = $(<span style="color: #006080">'#'</span>+parent).attr(<span style="color: #006080">'value'</span>);
<span style="color: #606060"> 16:</span> $(<span style="color: #006080">'#'</span>+child).html($(<span style="color: #006080">&quot;#&quot;</span>+parent+child+<span style="color: #006080">&quot; .sub_&quot;</span>+parentValue).clone());
<span style="color: #606060"> 17:</span> <span style="color: #0000ff">if</span>(isSubselectOptional) 
<span style="color: #606060"> 18:</span> $(<span style="color: #006080">'#'</span>+child).prepend(<span style="color: #006080">&quot;&lt;option value='none'&gt; -- Select -- &lt;/option&gt;&quot;</span>);
<span style="color: #606060"> 19:</span> $(<span style="color: #006080">'#'</span>+child).trigger(<span style="color: #006080">&quot;change&quot;</span>); 
<span style="color: #606060"> 20:</span> $(<span style="color: #006080">'#'</span>+child).focus();
<span style="color: #606060"> 21:</span> }
<span style="color: #606060"> 22:</span> );
<span style="color: #606060"> 23:</span> }

Again, here is the function for jquery 1.3.x. Thanks a lot to TuxX for tuning up it to work with jquery 1.3.x.

[javascript]
function makeSublist(parent,child,isSubselectOptional,childVal)
{
$("body").append("<select style=’display:none’ id=’"+parent+child+"’></select>");
$(‘#’+parent+child).html($("#"+child+" option"));

var parentValue = $(‘#’+parent).attr(‘value’);
$(‘#’+child).html($("#"+parent+child+" .sub_"+parentValue).clone());

childVal = (typeof childVal == "undefined")? "" : childVal ;
$("#"+child).val(childVal).attr(‘selected’,’selected’);

$(‘#’+parent).change(function(){
var parentValue = $(‘#’+parent).attr(‘value’);
$(‘#’+child).html($("#"+parent+child+" .sub_"+parentValue).clone());
if(isSubselectOptional) $(‘#’+child).prepend("<option value=’none’ selected=’selected’> — Select — </option>");

$(‘#’+child).trigger("change");
$(‘#’+child).focus();
});
}
[/javascript]

And initialize the association on ‘$(document).ready’, as following example:

<span style="color: #606060"> 1:</span> $(document).ready(<span style="color: #0000ff">function</span>()
<span style="color: #606060"> 2:</span> {
<span style="color: #606060"> 3:</span> makeSublist(&#x2019;parentID&#x2019;,<span style="color: #006080">'childID&#x2019;, true, '</span>selected_val_of_child');
<span style="color: #606060"> 4:</span> });

If you want to create multilevel association, start the initialization from child most order. such as:

<span style="color: #606060"> 1:</span> $(document).ready(<span style="color: #0000ff">function</span>()
<span style="color: #606060"> 2:</span> {
<span style="color: #606060"> 3:</span> makeSublist(<span style="color: #006080">'child'</span>,<span style="color: #006080">'grandson'</span>, <span style="color: #0000ff">true</span>, <span style="color: #006080">''</span>); 
<span style="color: #606060"> 4:</span> makeSublist(<span style="color: #006080">'parent'</span>,<span style="color: #006080">'child'</span>, <span style="color: #0000ff">false</span>, <span style="color: #006080">'3'</span>); 
<span style="color: #606060"> 5:</span> });

For details instruction and example of using this script, please visit the previous version. Feel free to ask me if any problem with using this script or any bug you found.

UPDATE [09/10/09] : Updated function added for jquery 1.3.x

Ruby on Rails: Begin with the easiest tutorial

When I have been hearing a lot about Ruby and thinking to give it a try, I searched for a beginners tutorial over Internet. I found a lot. But luckily, I started with the easiest and solid one. It successfully drive me through an exciting way of learning ruby and lift me from installing to a functional "online cookbook" application. The best part of this tutorial was, it teach everything really "step by step" and you have to turn back to a previous step for never. 2 parts of this great tutorial is here –

part-1 : Rolling with Ruby on Rails

part-2 : Rolling with Ruby on Rails, Part 2

Ok. It’s confirming your successful starting. For the next step, I am listing here some essentials of learning Ruby on Rails.

  1. http://tryruby.hobix.com/ : This is an interactive interface for learning Ruby. They said,"Got 15 minutes? Give Ruby a shot right now!".
  2. What is ruby on Rails – This is another tutorial from http://www.onlamp.com/ describing amazing features of Ruby on Rails.
  3. Four Days on Rails (PDF) : This PDF goes through building a "To-Do List" Application. The steps of building a ruby applications are explained here excellently.
  4. http://wiki.rubyonrails.com/rails : Ruby on Rails Wiki : The community-driven Rails documentation! A place where you will get everything about Ruby on Rails.
  5. http://api.rubyonrails.com/ : The details documentation of Rails API.
  6. http://rubyforge.org/ and http://raa.ruby-lang.org/index.html: These are the world’s richest  collection of open source ruby project.
  7. Seeing is believing : Screencasts of Ruby on Rails application. Makes a programmer interested on Ruby on Rails in just 01 minute.
  8. Ajax on Rails : This is the 3rd part of the introducing tutorial. A must read to work with Ajax in Rails framework.

Windows Live Writer : Blogger’s life made easy

Windows says, "Windows Live Writer Beta is a desktop application that makes it easy to publish rich content to your blog". Really that. I have been using it recently and found it as an exclusive tool for blogging. But remember, a blogger can use windows live writer only when his blog is build on an organized blog system like WordPress, Blogger, LiveJournal, TypePad, Moveable Type, Community Server, and many other weblog services.

image   image

Windows Live focus themselves on five feature of this writer. They are:

  1. Compatible with your blog service
  2. WYSIWYG editing
  3. Rich media publishing
  4. Powerful editing features and
  5. Offline editing

Ok. Now I am going to tell you what features of this software impressed me most. First I should mention that, before using Windows Live Writer, I have been using WordPress and I was satisfied on It’s editing options. But now, I get the powerful yet easiest application for writing blog and I’m going to stay on it. Here goes my share of the praise:

  1. Offline control on everything: It has powerful editor to write/edit blogs, manage my categories etc on offline. So, it’s fast and easy. Only one thing I have to do is, just tell the writer to publish it. Then it will connect to the blog over online and automatically publish it. Moreover, it lets me see the editing post in different views which helps me to visualize how it will look like at online on my installed theme.
  2. Working with images is easiest than ever:  I get rid from the terrible duty of uploading and managing images to use them in a blog post by using writer. It lets me use image in a post and edit them just like MS Word. When an image containing post published, it manages everything.
  3. More control on Html elements: The web’s WYSIWYG editors are simply nice. But not comparable with writer’s editing facilities. It’s more than a web editor and near about a word processor. It offers smooth and flexible visual building.  
  4. Special inserting tools: Writer’s inserting tools are really rich. It can insert and smoothly manage tables, images, videos, maps(from virtual earth), colorize code snippet(need a free plug-in) etc.
  5. Rich and free Plug-ins: Though Windows Live Writer is at beta version yet, it has a large number of free plug-ins. They may solve more than a blogger needs. You can get the plug-ins here:
  6. http://gallery.live.com/results.aspx?c=0&bt=9&pl=8&st=5

Moreover, who are blogging on hosted version of WordPress, Blogger etc blogging site, they have some limitations of using plug-ins there. Writer may be a great solution for them. It also provides the ping functionality which is very important for promoting a blog.

See more details here: http://get.live.com/en-us/betas/writer_betas

You can download it from here: http://windowslivewriter.spaces.live.com/

“How to add archive functionality to your PHP app”

“An archive refers to a collection of records, and also refers to the location in which these records are kept. Archives are made up of records which have been created during the course of an individual or organization’s life.” – Wikipedia.

Archive is an essential feature of a well defined blog system. If you have a blog in blogger or wordpress, you’ll get built-in archive feature there. But if you are making a blog yourself or any similar application, you might need to add this function yourself. These are some ideal example of archives:

Omar Al Zabir www.phpfour.com somewherein bangla blog

I’ve done it for one of my app and here I am telling you the time saving tip: creating an archive function in 3 easy steps.

1. Generate organized archive data: Generally, archives are created on create date of contents. Let’s say, your blogs table has a field named create_date which holds the timestamp of the post. Now, you can get your archive data in very organized format with this simple yet powerful query (it’s in MySQL):

SELECT COUNT(id) total, MONTHNAME(create_date) month, YEAR(create_date) year

FROM blogs

GROUP BY MONTH(create_date), YEAR(create_date)

ORDER BY create_date

Note that you’ll need to use where clauses if there are any condition. The output of your query should look like this:

Query to retrieve archive data The result
image image

 

2. Use the archive data: After you have retrieved the archive data, you can display them in any sidebar of your application. A sample code can be as follows:

 

<span style="color: #606060"> 1:</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">h4</span><span style="color: #0000ff">&gt;</span>Older Entries<span style="color: #0000ff">&lt;/</span><span style="color: #800000">h4</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 2:</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">ul</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 3:</span> <span style="color: #0000ff">&lt;?</span><span style="color: #800000">php</span> <span style="color: #ff0000">foreach</span> ($<span style="color: #ff0000">archive</span> <span style="color: #ff0000">as</span> $<span style="color: #ff0000">month</span>)<span style="color: #ff0000">:</span> ?<span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 4:</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">li</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 5:</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">a</span> <span style="color: #ff0000">href</span><span style="color: #0000ff">=&quot;&lt;?php echo $month['year'] . &quot;</span>/&quot; . $<span style="color: #ff0000">month</span>[<span style="color: #0000ff">'month'</span>] ?<span style="color: #0000ff">&gt;</span>&quot;<span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 6:</span> <span style="color: #0000ff">&lt;?</span><span style="color: #800000">php</span> <span style="color: #ff0000">echo</span> $<span style="color: #ff0000">month</span>[<span style="color: #0000ff">'month'</span>] . <span style="color: #0000ff">&quot; &quot;</span> . $<span style="color: #ff0000">month</span>[<span style="color: #0000ff">' year'</span>] .<span style="color: #0000ff">&quot;(&quot;</span> . $<span style="color: #ff0000">month</span>[<span style="color: #0000ff">'total'</span>] .<span style="color: #0000ff">&quot;)&quot;</span> ?<span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 7:</span> <span style="color: #0000ff">&lt;/</span><span style="color: #800000">a</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 8:</span> <span style="color: #0000ff">&lt;/</span><span style="color: #800000">li</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 9:</span> <span style="color: #0000ff">&lt;?</span><span style="color: #800000">php</span> <span style="color: #ff0000">endforeach</span>; ?<span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 10:</span> <span style="color: #0000ff">&lt;/</span><span style="color: #800000">ul</span><span style="color: #0000ff">&gt;</span>

So, what’s done here? Well, it displays the archive sets with an appropriate link. Note that the link are created in “clean URL” style, i.e. yourdomain.com/2007/july – if you are using an MVC framework like CodeIgniter or CakePHP, you may find it easy to integrate. You can of course create it in the old style, by changing the above code in this way:

<span style="color: #606060"> 1:</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">li</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 2:</span> <span style="color: #0000ff">&lt;</span><span style="color: #800000">a</span> <span style="color: #ff0000">href</span>=&quot;<span style="color: #ff0000">blog</span>.<span style="color: #ff0000">php</span>?<span style="color: #ff0000">year</span>=&lt;<span style="color: #ff0000"></span>?<span style="color: #ff0000">php</span> <span style="color: #ff0000">echo</span> $<span style="color: #ff0000">month</span>[<span style="color: #0000ff">'year'</span>] ?<span style="color: #0000ff">&gt;</span>&amp;month=<span style="color: #0000ff">&lt;?</span><span style="color: #800000">php</span> <span style="color: #ff0000">echo</span> $<span style="color: #ff0000">month</span>[<span style="color: #0000ff">'month'</span>] ?<span style="color: #0000ff">&gt;</span>&#x201D;<span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 3:</span> <span style="color: #0000ff">&lt;?</span><span style="color: #800000">php</span> <span style="color: #ff0000">echo</span> $<span style="color: #ff0000">month</span>[<span style="color: #0000ff">''</span><span style="color: #ff0000">month</span><span style="color: #0000ff">'] . &quot; &quot; . $month['</span> <span style="color: #ff0000">year</span> <span style="color: #0000ff">'] .&quot;(&quot; . $month['</span><span style="color: #ff0000">total</span>'] .<span style="color: #0000ff">&quot;)&quot;</span> ?<span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 4:</span> <span style="color: #0000ff">&lt;/</span><span style="color: #800000">a</span><span style="color: #0000ff">&gt;</span>
<span style="color: #606060"> 5:</span> <span style="color: #0000ff">&lt;/</span><span style="color: #800000">li</span><span style="color: #0000ff">&gt;</span>

3. Display related posts: And now you’ll need to handle the fetching of appropriate posts based on the passed archive information (year and month), but that’s something that only you can figure out, as I don’t know what you have in there.

Happy Blogging…Happy Archiving 🙂

Hello World!

Hellow World! Now I am here…. at ajaXray.

I have been blogging on wordpress for a short time as http://php4bd.wordpress.com/. Though it’s a nice experience, I am facing some limitations there. Moreover, I have been thinking for a domain to share, test and explore my works and experience on an unique web identity. As a result, I get the domain ajaXray.

Behind the name : The name “ajaXray” comes from 2 words.

  1. ajax: AJAX, is a web development technique used for creating interactive web applications. This is the current crazes of web technologies.
  2. X-ray: X-rays (or Röntgen rays) are a form of electromagnetic radiation with a wavelength in the range of 10 to 0.01 nanometers. generally, its known to us for it’s power of scanning. I choose the word after ajax to express the interest of exploring the web technologies in such a scanning depth.

And the last thing… this domain+hosting is gifted by my (30%)boss, (30%)teacher and (40%) friend Emran Hasan aka phpfour.today is his birthday. HAPPY BIRTHDAY TO PHPFOUR.

Ajax-like Unobtrusive File Upload

We use AJAX whenever we need to communicate with the server, without reloading the page. But this doesn’t function in the case of File Upload. In usual view, uploading files with AJAX is impossible! (FireFox/Mozilla can do this after change a setting in “about:config” – which we cannot guarantee for a lot of users).

When I was searching for any technique to upload file without reloading page, I found a script in www.webtoolkit.info . But it seemed very complex to me. Then I try to simplify their technique and its working great. So I thought why not share the technique with everybody?

First, look at the demo here to see how it works.

OK. Let’s get into the deep. What happens when we submit a form? The form is submitted to the action page and that page loaded in current frame of window. If the “target” attribute of form indicate “_blank” or any frame name of the window, the page loads in a blank window or in the named frame or inner frame. Here we’ll be using the second method.

First, take an inner frame in anywhere of the page. And set the display property of this frame as “none”:

    <iframe name="hiddenFrame" id="hiddenFrame" 
    src="about:blank" style="display:none" >
    </iframe> 

Now, just set this frame as the target of your uploading form.

<form name="testForm" id="testForm" enctype="multipart/form-data" 
    action="upload.php" method="post" target="hiddenFrame">
        <input type="file" name="name" /> 
        <input type="submit" value="Upload!" />
    </form>

If we submit this form now, it will submit the file to the target script on the server (can be in php, asp etc.). The script will upload the file and will load the response in the frame “hiddenFrame”. As the frame is not visible, nothing about this loading will be seen by the visitors. Now, as the uploading page displays nothing after uploading your file, the response can be immediate. Although it’s not AJAX, this technique will upload your file without (visually) reloading page.

What more?

For many purpose, we might need a callback function when using AJAX. For this file uploading technique also, we will try to create something like that. First, we’ll write the callback function as a simple JavaScript function in the header of the uploading page:

<script language="javascript">
function trackThis()
{
var resultDiv = 
    window.frames.hiddenFrame.document.getElementById(‘result’);
var uploadedImage = document.getElementById(‘UploadedImage’);

uploadedImage.src = resultDiv.innerHTML; 
uploadedImage.style.display="block";

alert("File Uploaded :" + resultDiv.innerHTML);
}
</script>

When the uploading of the server page is complete, it should print the JavaScript code in the hidden iframe, to call the callback function with the reference “window.top”. Any other required information also can be printed in specific DIVs. It will enable us to retrieve any response information using the innerHTML of any specific DIV (as shown in example callback function).

Example:

<?php
print_r($_FILES["name"]);
if(move_uploaded_file($_FILES["name"]["tmp_name"], 
            dirname(__FILE__)."/".$_FILES[‘name’][‘name’]))
{
echo "Your uploaded file is: <div id=’result’>".$_FILES[‘name’][‘name’]." </div>";
}           
else
{
    echo "<div id=’result’>Sorry! Error occured!</div>";  
}
echo <<<test
<script type="text/javascript">
window.top.trackThis()
</script>
test;
?>

Well, that’s it. This technique has already saved my ass once, see if it can save yours also when you need.