Recently I was doing some practice in asp.net data access layer. It is great technique to access your database objects.

I was trying to bind my hyrarchial database table (recursive table) to an asp.net treeview control and I wanted something very simple. Interestingly I couldn’t find any direct databinding methods for a treeview to the recursive table. Atleast there’s no simple method to make the binding with the treeview (correct me if I am wrong) unlike other controls like datagrid, datalist etc.Since ASP.net Treeview understands only hyrarchial dataset, I have to find a way to convert my dataset to a hyrarchial dataset.

On further dig, I found a nice article by Ralph Varjabedian. He wrote an ASP.net class to convert the dataset to a hyrarchial dataset. Thanks to Ralph!

And finally I was successfull to bind the control with the dataset in the way I wanted.

Here is the Code I wrote

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using DataSet1TableAdapters;

public partial class Campaigns : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{   DataSet dataSet = new DataSet(); //Dataset
TableAdapter CampaignTableAdapter = new TB_campaignTableAdapter(); // data table adapter
dataSet.Tables.Add(CampaignTableAdapter.GetData()); // populating the dataset
tvCampaign.DataSource = new HierarchicalDataSet(dataSet, "ID", "id_parent", 0); // converting to hyrarchial dataset
tvCampaign.DataBind();
tvCampaign.CollapseAll();            // Collapsing all nodes by default
}
}

And I am interested to learn if there’s any other better solution for this.

Here’s a small Javascript function which enables animated highlighting effect on the navigation (lavalamb effect) with the help of jquery easing plugin

$.fn.lavalamb = function(ImgPath){
/* ImgPath:  Path of the image which you need to animate when you hover over a navigation link
   this can be a shadow png image or a pointer image or underline image which you want to animate with a mouseover / mouseout action on a link

   Add css class "Highlight" to the node which is currently active, so the image will always be animated back to this node on mouseout
*/
var LeftPos;
$(this).append('<div id="lavalamp"><img src="'+ImgPath+'" alt="" /></div>'); //Appending lavalamb image to the html, this div can be skinned in the css.
$(this).parent().css({position: "relative"}); //setting the position
$("#lavalamp").css({
position: "absolute",top: $(this).height() // These css values can be edited to vertically position the lavalamb image
});
  $(this).find("li").hover(  //Link hover function
function(){ 	//Rollover
LeftPos = $(this).offset().left - $(this).parent().offset().left; //calculating the left position
LeftPos = (LeftPos - ($("#lavalamp").width()/2) + ($(this).width()/2)); //calculating the left position
$("#lavalamp").animate({left: LeftPos},{queue:false,duration:700,easing: "easeInQuart"}); //Animating the image from the start position to the current mouseover position
},
function(){
   LeftPos = $(this).parent().find("li.Highlight").offset().left - $(this).parent().offset().left; // Getting the position of the highlighted node
 	 $("#lavalamp").animate({left: LeftPos},{queue:false,duration:700,easing: "easeOutQuart"}); //Animating the image back to the start position from the current mouseover position
  });
}

And call this function in the html page

<script type="text/javascript">
$("#Navigation").lavalamb("Images/Background/NavShadow.png"); // Navigation is an id of the <UL> list which has navigation nodes
</script>

Here’s an example
Example1

Browsers lack good, consistent native audio/video support. (HTML 5’s audio and video are on the way, but not universal yet.)
Here’s Sound Manager 2, a nice Javascript API via Flash + ExternalInterface to add audio & video to your website.

http://www.schillmania.com/projects/soundmanager2/doc/getstarted/#intro

Demo Audios
http://www.schillmania.com/projects/soundmanager2/demo/page-player/

Demo Videos
http://www.schillmania.com/projects/soundmanager2/demo/video/

here is a live example …
http://paris.conciergerie.com/

Just found a cool tip to aviod default page zoom in iPhone . Just add the following tag

<meta name=”viewport” content=”width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;”/>

on further dig I found some useful apple development guides describes about the iphone viewport and customizing style-sheets

http://developer.apple.com/iphone/library/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

http://developer.apple.com/iphone/library/documentation/AppleApplications/Reference/SafariWebContent/AdjustingtheTextSize/AdjustingtheTextSize.html