WebRunner Vs Adobe AIR shootout : My views

I have been keeping a causal watch of what Mark Finkle has been upto with WebRunner. And this post is in reference to the the debate between the warring camps, mark finkle from mozilla,working on WebRunner and Ryan Stewart with Adobe, talking about Adobe AIR. They have been exchanging some thoughts, I thought i would as well.

Here it is ...

webrunner

adobe air

having site specific browsers seemed like a gud idea. I dont want to open stuff in new tabs . How about having a different desktop Firefox Instance (FYI:i dint say 'process') for every SSB. no "virtual machine"ish sort of setup, but simply is Firefox-tweaked and called WebRunner as the run-time for apps target users: people who like a seperate webrunner for each site upside : (yet to find any !) downside & what i would have liked to see : why on earth would i want something that gives absolutely no value to me as a developer !!! if webrunner concentrated on building a class library with decent system access documentation(sorry to say,i still dont find the mozilla docs on these half as useful or readable compared to say flex docs). forget even building your own, atleast i shud have interfaces in webrunner for all possible classes and then plug'n'play with js libraries like jquery /dojo or hell make a new project on mozilla just to create just the plug'n'play interfaces for webrunner first,and maybe a decent js api for creating,accessing SVG. It really pisses me off every time webrunner is compared to adobe air. its beyond comparison, mozilla and webrunner cannot be sit back on the laurels of firefox for the success of webrunner. instead it shud actually code a class library that can be shipped with webrunners or ssb's or whatever 'schemes' Mark Finkle has on his mind. Coz personally webrunner does'nt even seem like an app worth talking just because it's stripping off the firefox browser. The first Webrunner was prototyped in 06, and not one new feature that was'nt courtesy of firefox! That's sad even compared to the progress made by silverlight - a late entrant! Webrunner, needs to innovate as well, and quick - if it wants to really play with in the big league !

having flash apps work for the desktop seems like a gud idea. I don't want to open a browser for every flash app. How about having a single desktop run-time for all adobe air apps "Virtual Machine"ish Adobe AIR is the run-time for my apps target users: people who like a seperate webrunner for each site downside: another process clobbering with my cpu memory if it becomes popular ! upside : adobe has effectively solved a major porting problem by allowing flash developers to write in a language they prefer, and access the beautiful and growing class libraries for everything from system ,to math,to vector graphics. what i would have liked to see : just keep it going ... and don't bloat the runtime size too quickly!

By the way,i'm not biased towards any one side (or the third - silverlight 8 ) ), but have always respected both mozilla, firefox and everyone involved ; as well as the phenomenal innovation shown by adobe with flex and apollo.

Keep Clicking,
Bhasker V Kode

Export excel sheet data to wiki's and html - Introducing ExcelKoder

The Evening of Junly 16th,2007

Guess ,i could'nt wait for the hackernight/compilers & interpreters collective at barcamp Bangalore happening in a few weeks

Here's a small utility i wrote one evening,while figuring out how to share plans for scheduling of barcamp bangalore. Geeky part, is that everything from css,to js and html written in this demo was done in good ol' notepad 8 )

Here's the link to the ExcelKoder demo. Might even host it up as a google project .hmmm.

Keep Clicking,
Bhasker V Kode

Technorati Tags: javascript, bcb4, barcampbangalore, hack, excel, wiki, export,

Indian Independent music is ALIVE and kicking !!

When i first saw sites like radioverve and gigpad for indian independent music spring up , I wondered who would be creating this kind of music from india . Well, today as a music lover and self-taught guitarist , i'm more than convinced at the amazing changes and advances happening in the indian independent music scene.

Take for instance - my good friend ,Prakash Hariharan has been playing the mandolin for 10 odd years. Sometime in college few years back, he got himself a new acoustic guitar ,and an electric one . And started playing amazing leads on both that led to him drifting towards fusion and little jazz. He and other friends from college like Raghu (Bass,vocals, composition) ,Karthik(vocals,guitar)& Deepak (drums) all from SVCE , have been making demos and jingles and performing at a semi-professional level for some time now .My gf was judged best singer at an inter-college event,and sings for the college band , and i know how she really enjoyed every practice session they had, and admits - its all hard work and patience. She should know - she's been learning classical indian music for the past 15 years ,Prakash for 10 odd years on the mandolin started off classical himself. Some like the pianist junior ,have even made it big in the band called Oxygen. Great to see them win gigs ,be it a fusion at iit,iim or the other events in south india. Hey ,incidently I had a great time myself playing the guitar for while in the western music band. I still do enjoy each minute i spend everyday with my custom made spanish guitar 8 )

Whats new though , is that unlike anyone else i know or anytime before ... Prakash has put away a nice job at a software company to pursue his dream . He joined a radio station to learn production , while spinning his own compositions in his home studio . recording and jamming with other buddies . He's been showing his demo's to people ,even to Guitar Prasanna and hopes to one day join the Berkely school of music . Really awesome to see people passionate and pursuing what they love 8 )

On the same lines, I was really stunned when i heard the awesome potential in indian inde music 8 ) ( songs from red cube, indus creed especially ) .Lot of indian independent music happening ....

Check out

1. http://www.split-magazine.com/downloads
2. http://split-magazine.com/radio
3. radioverve
4. gigPad
   

Prakash puts some of his music over at his blog and runs his own podcasts with his music , and I'll ask him to update news on his new band in bangalore .

Here's a demo of Red Cube's single called "some where in the corner".

Cheers to the music,guitars and the free world ! 8 )

Update : Also on similiar lines, is tempostand.com . And here's cheers to Oritus, for their awesome song and now my personal fav indian inde ballad - 'Many a Mile' - by Oriitus.
Keep Clicking,
Bhasker

Technorati Tags: indian, indie, music, pkharry, radioverve, redcube, split,tempostand, oritus,svce, gigpad,bosky101

Top 5 MUST READ Javascript Resources

Some MUST READ javascript links that I thought i'd share.

Excellent Code style tutorial , with easily undertandable code snippets ( Bad Vs Ok examples)
=>From Mozilla, http://wiki.mozilla.org/JavaScript:SpiderMonkey:Coding_Style

Best example of well documented code
=> The YUI Javascript library, start off with reading http://developer.yahoo.com/yui/docs/YAHOO.js.html

Excellent Javascript beginner tutorials
=> from Javascript Guru- Douglas Crockford's stable
===> http://javascript.crockford.com/survey.html
===> http://javascript.crockford.com/code.html

Best ever Advanced javascript & Optimization tutorial
=> from Opera, and probably the most understated article on javascript to date. http://dev.opera.com/articles/view/efficient-javascript/?page=all

Excellent Advanced javascript tutorials
=> http://www.quirksmode.org/js/contents.html

Keep Clicking,
Bhasker V Kode

Technorati Tags: javascript, js, programming, tutorials, bosky101, kode

Introducing toXmlString : Javascript XML DOM to String Conversion

I was surprised to find no function to convert a javascript xml dom object to a string. I did find an upcoming feature added in Javascript 1.6 by the cool folks at Mozilla, but it really did not cater to xml dom objects already created /accessable by javascript.

I've seen PHP's PEAR ,and XML_Parser classes and often like to take part of the xml to resend/reuse later in my application. So since I could'nt find one , I wrote one 8 ) !

toXmlString(xmlObj) : string

/**
* @author Bhasker V Kode
* @name toXmlString
* @description Functional Style Method to Generate XML String from any xml DOMobject .
* @param s (String ) [optional for usage]
* @language Javascript
* @date 25th May ,2007
*/

1. function toXmlString(xy,s){
2. var str = (s==undefined)?'' : s;
   
3. if(xy.nodeValue==undefined){
4. //ur a big moma
5. var multiStr=[],temp='';
6. for(var i=0;i <>
7. // each repeasted node
   
8. if(xy.childNodes[i].nodeName.toString().indexOf('#')<0){
9. var nodeNameStart ='<'+xy.childNodes[i].nodeName;
10. var nodeNameEnd ='';
11. var attsStr=' ',atts = xy.childNodes[i].attributes;
12. if(atts!=undefined){
    
13. for(var j=0;j<>
14. attsStr+=atts[j].nodeName+'="'+ atts[j].firstChild.nodeValue+'"';
15. }
16. }
17. temp = nodeNameStart + ((attsStr==' ')?'':attsStr ) +'>'+toXmlString(xy.childNodes[i],str) + nodeNameEnd;
18. multiStr.push(temp);
19. str = temp;
20. }else{
21. //node Value
    
22. str = toXmlString(xy.childNodes[i],str);
23. multiStr.push(str);
24. }
25. }
26. //end of for loop,time to untangle our results in order of appearance
    
27. str = multiStr.join('');
28. }else{
29. return xy.nodeValue;
30. }
31. return str;
32. }
    

Usage

var str = toXmlString(xmlDomObj) ;

Demo - http://bhaskervk.com/libraries/reusable/demos/xml.php

You might find the functional style of programming familiar from my earlier posts ,where I created a XML writer class where I created an xml string from scratch . So it was only a matter of time before i approached the situation where I might need to create xml from existing objects.

Technorati Tags: kode, ,functional, ,, programming, ,, helper, ,class, ,, toXmlString, ,, bhasker,, xml

Introducing : The Returnable Project

Whats your return type...?
Hi,

I just wanted to share with everyone a new project that i'm launching today .Returnable Project is architecture for using the url as a bridge for chaining 3 traits of the web : content ,their behaviour and its delivery its a personal project but quite a bit of javascript ,php ,url rewrite ,regex and css hacking spread over a few months of research and prototypes . It comes from a few motives:

• tooltips not being able to support html
• existing tooltip implementations catching every mousemove event (while this uses the concept of idempotent events - knowing when to not accept events)
• no simple API for synchronising the delivery of content with its behaviour and content. In other words - allowing the normal user to create intuitive widgets and consume API's easily inside blogs and web pages.

The alpha is live over at returnable.org ,while the project will be otherwise hosted at http://sourceforge.net/projects/returnable/ .

This may appeal to web developers and bloggers . It's a framework to add simple event driven programming for those who dont want to type code. But powerful all the same because of the DSL and API.

For bloggers who are looking for an easy way to have tooltips (in javascript enabled blogs) ,this could be a great utility. You can go through the site to see demos on how to create intuitive tooltips (and more apps coming soon) with just one line of code (apart from the script node to be added initially )

Here's how to add Returnable elements into your blog:

1. Step1 : Add the script element
   
   This preferably need to be done only once (at the template of the blog/site /header,etc )
   
   
2. Step 2 : Add the Returnable elements
   <span><returnable href="http://onhover.returnable.org/tooltip.text/hello">Hover over this for some widgety magic</returnable></span>
   
   
3. Step 3 : Done !
   Thats all there is ,load up you blog/ page .
   

I finally have the working prototypes ,and the project website website on sourceforge,as well as the official website (returnable.org) running since then. I plan to add support for storage of tooltips on the server , new returnable types like widgets, maps , and so on which will be much easier now that the main architecture is working across browsers 8 )

Keep Clicking,

Bhasker V Kode

Technorati Tags: returnable, opensource, javascript, tooltip, returntype, india, widgets, bloggers

IE JS hack :Catching the Maximise / Minimise event

Here's a little hack to find out whether the user has maximised or minimised the window .This can then be used to trigger other useful chain of events of your choice .

Explanation:
The screenX, and screenY properties of the event corresponds to the the x and y coordinates of the mouse pointer's position relative to the user's screen respectively .

Now comes the juicy part ....

IE forces a mouse move whenever you change the focus of the window .So the interesting point to note is that - a mousemove event is forced even though the mouse co-ordinates dont actaully move ! So if you are able to track the previous mouse co-ords and catch the point where a mouse move is called - but at the same time the values dont change - bingo ! 8 )

var logs ,x=-1, y=-1 ,ctr = 2;
document.onmousemove = catchmaxmin;

function catchmaxmin(ev){
logs = document.getElementById('logs');
var e = (ev!=undefined)?ev:event;
if(e["screenX"]==x && e["screenY"]==y && ctr%2==0 ){
logs.innerHTML+= '
maximized /minimized ! ';
}
ctr++;
x = e["screenX"];
y = e["screenY"];
}

I've been looking for a similiar hack in firefox ,but i guess this useful bug has'nt been introduced into the Mozilla camp . 8 ) Here's a working demo ( tested on ie6 , ie7 ) of the 10 odd lines of code needed .

Keep Clicking,
Bhasker V Kode

Technorati Tags: javascript, event, maxmin, ie, window, bosky101, bhasker, kode, hack

CS / IT MUST READ : "Google summer of code"

The "Google summer of code" deadline is approaching, and basically is an attempt to inspire projects from students across the world ,by organisations(> 130) suggesting project ideas which they will then mentor.

This is perfect for doing your final year project . Guys who are into coding, dont miss out on this chance - get a group of like minded friends and register , read through the norms,and the whole process of applying, and working on open source projects is an experience in itself . Last year, Google funded over 600 students in 93 countries to work with 100 open source groups.


About the Google SOC 2007
The accepted Google SOC 2007 mentors list is now complete at the Summer of Code website — 131 projects could use your help. Student applications are open and the end date is March 26. Google has an application guide in the Summer of Code Announce discussion group that provides more information on the application process.


Advice for students applying:
http://code.google.com/p/google-summer-of-code/wiki/AdviceforStudents

Application guide :
http://groups.google.com/group/google-summer-of-code-announce/web/guide-to-the-gsoc-web-app-for-student-applicants

Home page:
http://code.google.com/soc


Who's eligible to participate as a student in Google Summer of Code?
in order to participate in the program, you must be a student. (colleges, universities, masters programs, PhD programs ). You should be prepared, upon request, to provide Google with transcripts from your accredited institution as proof of enrollment or admission status. Computer Science does not need to be your field of study in order to participate in the program.

If you however miss the dates,its still an experience to spend the summer hols doing a project in your area of interest ,and build up for your final project.

Keep Clicking,
Bhasker V Kode
(FYI : SVCE 2002-2006 IT Dept )

Technorati Tags: svce, it, cs, finalyear, project, btech, india, google, soc, bosky101, kode

Introducing tvHtmlHelper and TagCreator

I just saw this helper class called pQuery on ajaxian today .written by vikas from delhi ,that offers a very modest way of generating your html code with the necessary attributes for the html elements ,etc .

The good news is that its nice to see someone featured on ajaxian . (both vikas and myself are 23 btw...cheers to that ! ). The bad news ,i knew he could do better .

The API needed a little bit more extensibility and scalability . And thats how i got on a hacking marathon to show how to integrate this class ive made to make ...say a tag creator .Here is vika's code usage :

PHP implementation of pQuery:

1. =$pquery->form_remote_tag(array('url'=>'index.php?task=ajax','update'=>'#idtoupdate'));?>
2. Field : "field"
3. < type = "submit">

   
   

My first comments ? Very shabby !

Here my custom built html helper , i write - that would not only go with jQuery ,but heck i use it for spitting out everything from body tags with onload 's , to hr tags , and tables -tr's running in reccursive loops .

Demo of tvhtmlHelper.php:

/**
* @description - A simple Tag creator written in php that uses tvHTMLHelper
* @author Bhasker V Kode
* @date Feb23,2007
* @copyright Some Rights Reserved
*/
class TagCreator extends tvHTMLHelper{
public function addTag($type=NULL , $tag=NULL){
switch($type){
case 'technorati':
/*OUTPUT :will output the html for a tag .
return $this->insert('a','start',array("href"=> "http://www.technorati.com/tags/$tag" ,"rel"=>"tag")) . $tag . $this->insert('a','end') ;
break;
/*
case 'youtubeVideoLink':
// follow similiar style to embed a youtube video , or so on for other widgets of your choice .
*/
}
}

$myInstant = new TagCreator;
echo $myInstant->addTag('html','start');
echo $myInstant->addTag('body','start',array("onload"=>"init();" , "class"="bC");
echo $myInstant->addTag('technorati','tvhtmlhelper');
echo $myInstant->addTag('technorati','bosky101');
echo $myInstant->addTag('technorati','php');
echo $myInstant->addTag('body','end');
echo $myInstant->addTag('html','end');

Notice the following design differences pQuery and tvHTMLHelper:

1. Inheritance is good for you !
   Primary usage pattern would be to extend this class where you deal with html a lot.
2. To echo or not to echo !
   If youve noticed ,in pQuery it prints instead of returning . Mine does not echo on its own .but return the html string instead ! .This can be used when you need to generate html to be used later ,like writing concatenating to a string /or sending mail /etc . Being generic never does any harm in helper classes. This i feel is a big pitfall in pQuery .
   
3. Clear cut definition boundaries of beginning and ending .
   The API has a startEnd for obvious reasons. This might be a major fallout in pQuery . If you do attempt to seperate presentation from logic , then why make it half way ? do it well or its better off not to do it at all .
   
4. Scalability.
   Now tvHtmlHelper does not limit you to jQuery but basically every web page . Heck ,i even use it for a custom build stringToXML class ive written where i could use the API in loops like this :
• $myInstant->insert('channels','start',array("length"=>1,"foo"=>"bar") );
• OR links
• $myInstant->insert('a','start',array("href"=>$link1,"id"=>"foo","class"=>"fadeClass") );
5. Useful across file types : xml ,html , tagging ,and link generation !
   You could even extend tvHtmlHelper to replace the < > symbols with custom ones or words .like ,what ever you pass through the API will come out as a technorati tag !
   

Ive put a demo page ,which you can check out . Ive ported tvHTMLHelper to both php4 as well as php5 . Have a look at the sourcecode ( rar file) !

I'd love to get any feedback on this ,or places where you might be able to use this .

Keep Clicking,
Bhasker V Kode

Technorati Tags: php, pQuery, ajaxian, tvHTMLHelper, bhaskervk, bosky101, code, tags, technorati, youtube, code

Adding Idempotent Event Handling to your Javascript Toolkit

Idempotent transactions are ones which may be repeated without affecting anything. You may have heard of this term when it comes to online banking ,where idempotent transactions are required ,and basically care needs to be taken to rollback , and not accidently charge twice for the same purchase .

So im trying to extend this to a javascript scenario ,where clicking on a button twice in quick succession will be ignored . This may well be used in a registration / payment / complex timed ui / or any other critical operation . Or basically to add a bit of fun to anything event driven !

Explanation

Let us assume that you dynamically add an event to an object . Now with Reusable.DeferredEvent , it throws a similiar api , gives you an option to specify your existing addEvent code -.Popular version of which are :

• quirksmode 's John Resig /Scott Andrew version of addEvent
  
• the Yahoo.Event
• script.aculo.us /Prototype's Event.observe .

So basically what i have is a plug'n play support for handling idempotent events , using your existing javascript toolkits corresponding dynamic event handling capabilities . In the demo page , I have shown how to integrate with these frameworks by uncommenting the suitable line of code as needed.

Which means for configure listenEvent event for every listenTill seconds , for any listenObj object .


In the demos , you will find two scenarios :

• Only unique button click's on Button1 in the range of 1 seconds will be recognised !
• Only unique mouseouts on Button2 in the range of 3 second will be be recognised.

//@param name of instance
//instantName = new Reusable.IdempotentEvent(instantName);
// Step 1 : Instantiation
responsive = new Reusable.IdempotentEvent('responsive');


//@param listenObj - DOM listenTillelement or element id
//@param listenEvent string - Event name (as per your toolkit nomenclature )
//@param listenTill int / string - how frequency to accept event triggers
//@param callBack string - What function to callback eventually

// Step 2 : Exeuction
//responsive.register( listenObj , listenEvent , listenTill , callBack );
responsive.register( btn1, 'click' , btn1.getAttribute('onclickwhen'), 'clicked' );
responsive.register( btn1, 'mouseout' , 1000, 'hovered' );

Demo and Code here .

Technorati Tags: javascript, events, idempotent, code, bhasker, kode, bosky101,

A Profile of TechEnclave

So, I've also always wondered if the portal a handful of '20-something year old' geeks and myself have built over the years totally in our spare time - would figure as being part of the Indian web innovation revolution .

It's called TechEnclave , famed for its forums ... ( http://www.techenclave.com/forums ) Being a moderator for the forum , we're all excited that the member base that Team TechEnclave have been really building the community from 2002-03 onwards with experience gained from a temporary hosted forums ,to other experiements through '04, - 05 and finally fixed on the TechEnclave brand ,and have stuck to it ever since the end of 2005 .

The reason why i 'm talking about it now - is also to highlight the transition we've seen with the web 2.0 revolution hitting the indian plains . Sure , we did implement ajax based forum search options before it became cool , and we do have some forum regulars like a calendar that the 10k displaying birthdays ,user meets ,and so on . We've even had our TE user meets where we get to interact with the members dating to early 2005 . And with over 25- 30 of them across the country over the years - its not really tough to see why the unconferencing theme dint take too long to pick up in India. Today TechEnclave has over 25 forum sections covering hardware overclocking to gaming , portable devices and Tech News from across the world .If TechEnclave as become what it is today , it has been off the strength ,quality and relevence of its Forums - be it for the tech noobie , geek gurus or the persistent troubleshooter .

---

Some other statistics TechEnclave as of Nov 3 , 2006
Members: 13,500 +
Threads: 27,229
Posts: 292,544,
Most users ever online was 1,363, 28 Nov 05 2005 at 01:18 PM.

So ...coming back to how TechEnclave fits in as a interesting collage of user-feedback inspired product innovation built inhouse...

1 ) TE Spy
an inhouse clone of digg spy ,developed in ajaxian ishtyle , and shows in real time when new posts made at techenclave ... currently for premium members only . But the amount of content we throughout the day ensure that the TE spy functions like a charm . If you are registering at TechEnclave , we'll be happy to upgrade you to a premium membership .Just let me know your user id ,and then you can check out TE Spy for yourself .









2 ) TechEnclave Addons & Initiatives
The TechEnclave ToolBar , A nifty little addon for Firefox helps our users search and naviagate across the site better . We also have an exclusive download manager apart from the recently added hardware benchmarking software located at http://www.techenclave.com/forums/superprime/ as well as numerous other nifty utilities like bookmarklets , feed aggregator widgets ,newletters , rss feeds , and so on .


3 ) TE Rig Gallery
TERig was an idea that we at techenclave had for a long time. We wanted to give , the tech enthusiast a medium to showcase your rig to the world. From our feedback on the forums ,we understood that the true potential of your rig can only be shown when your rig details are presented in a well formatted manner and with the all important pictures of your rig. So our admins Safin and QuickFire , went about hacking just that . Not only will you be able to put your rig specs in a well formatted manner, but also will be able to view where your rig stands vis-a-vis other's. Till date ,we are the first forum to have such a versatile system ...check it out at http://www.techenclave.com/forums/RigGallery.html
transcending the role of a forum .

---

4 ) TE iTrader ( Market )
A custom built environment that provides a better showcase of the product that users put up for sale .










5 ) TE Price Guide
Based on feedback over the years ,we even felt the need for a comprehensive and updated price guide for hardware ,whatever be the city you are in india. So welcome another custom built app . the TE Price Guide located at http://www.techenclave.com/forums/hardware-prices.html which has now attained a sort of lengendary status of sorts over at the "Build Your Own Rig" followers in India . We even have a seperate Market Section where users can swap their new and old stuff .This initiative has gathered a lot of traction for genuine buyers and sellers especially ,for reaching users in the the non metros .


The TE Family
Apart from helping troubleshooting across 20 odd forum sections ,being part of the Techenclave , has helped bridge distance for the indian techie and transcend geekdom !
TechEnclave 's depth of quality in its reviews and experienced members helped it become a source to present demos at hardware branding and launch expos . Infact ,name any piece of hardware or software ,and you can be sure that theres someone from techenclave whos' got it first or swears by their favourite utility . Also of note is the sister forum that we've created called FunEnclave over at www.funenclave.com

The people behind TechEnclave ( http://www.techenclave.com/forums/staff.html ) are dedicated enthusiasts who came together because of their expertise and being identified as uber geeks and experts by their peers ,combined with a blend of effective management , marketing and creative abilities - to make things happen . We take pride in building one of India's Biggest Technology Forums from scratch without any commercial backing or investment by putting back all ad generate revenue back into getting better servers , bandwidth and so on .( You can see a brief history and evolution of techenclave over at http://www.techenclave.com/forums/techenclave-history-and-evolution-720.html ) And we hope to keep the quality and members right up there ,to take TechEnclave to greater heights ! 8 )


If TechEnclave does not fit into the realm of indian innovations - we will understand . But If you think that this community has evolved ,then do let us know ,and drop in at the forums and find out for yourself . See you there...


Keep Clicking,
Bhasker V Kode ,

PS : If you do want to explore advertising options ,feel free to go through the page at http://www.techenclave.com/forums/advertisewithus.html .

This is a post meant to act as Profile of TechEnclave . So while it very well would be in the public domain,i'd appreciate the linkback .

Technorati Tags: techenclave, bosky101, india, tech, geeks, forums, portal

Good to be back in Chennai

Me in chennai for a few days...after a long break ,and the weekends been gr8 so far.

Attended the alumni meet and committed to helping out in the alumni site setting up as well .those guys are really stepping on the networking ,and the urgency is more so to gear up fto celebrate SVCE's 25th year of graduation to be in 2010 .

Showed off my new black dual-core 120 gb sata with dvd writer hp laptop to everyone at home here . its damn mobile and very sleek . am absolutely in love with it,and still think it was a better option that going for a mac ! (incidenly we just got another acbook ,bring the total to two now in our -10 odd strong develoepr & testing army at tutorvista's only office ( stpi ,electronic city,bangalore )

good news continues with my bro getting into Georgia tech, TAMU ,and Duke for his industrial engineering as well . Hes still waiting for stanford ,yale and darthmouth . All the best Bhargav !

Wrote a nice piece that i think a lot of my juniors at SVCE could use , and i think spend some time thinking about ,especially if your in a CS / IT department and contemplating a career in web based development.

Speaking of TE, the member base at TechEnclave has passed 13,500 geeks and looking good , We just completed a deal with Reliance Webworld for a banner display,and completed a small announcement deal with Rashmi Bansal - Editor, Jammag as well .

on the work front ,tutorvista just celebrated its first year anniversay at HINT, in bangalore central .a disc /pub that we booked all for ourselves and EVERYthing on the house !!! : ) . that was a freaking awesome party ! Getting into some new projects in office as well with the newsletter, feed syndication,apart from the now deployed googlish Calendar utility released live to our 2500+ paid customers. We're expanding on the hiring front as well - tutors,operations , developers ... conducted my first phone interview myself ;) ,plus its exciting that after our secodn round of funding of 10mln ,we're now going from the incubated unit at stpi to a full fledged 33 story byulding of our in the heart of Bangalore's corporate zone off the airport road.


went for a nice long move - salame ishq ,entertaining , india Vs west indies cricket match happening live here in chennai . and so is the cult fest saarang here at iit-madras campus.met up with my old buddies from school , called a few more . had a nice day out with my family and nrought my gf to my house for the first time to my mom and grand mom. spoke to my dad who's sailing after a long time . Madhu will continue to be in Biocon,bangalore till she leaves for her MS. And i think its time i thought about my plans for the near and distant future as well -education wise, health wise , personal life, wise in all respects ... Salsa classes have been doing me good as well....

Cheers to a rocking start to 2007 ....life is beautiful .... 8 )

Keep Clicking,
Bhasker V Kode

Technorati Tags: india, chennai, bangalore, tutorvista, techenclave, bhasker, kode, bosky101, svce, life

Live Blogging a Javascript hackers first dive into Erlang

There comes a time in every developers life ,when you want to find out for himself ,what ,how and why the hell people swear by their languages .Especially when its not one that youve ever worked with . For me ,it started off with Paul Graham godfathering Lisp . No i havnt Lisp/scheme land yet .But i have instead gone into another one , inspired by the one paradigm that has got everyone from languages all over the place going gaga.

Functional Programming . And the language im talking about ........is Erlang.

Now being a javascript 'n DOM hacker myself, Ive always wanted to take on any claim that other framework combinations (read django,ruby on rails , pylon ,and the rest) have to well...claim as far as im concerned by quoting improved performance , rapid prototyping , and ease .

Do i think a well informed programmer javascript /DOM hacker is any less equipped to implement ANYTHING that a ruby on rails coder can ?

my answer is No. not yet anyway . Either that or i havent seen anything so exclusive to a ruby on rails that cannot be implemented otherwise .( Let the rants begin ..he he ... 8 P )


Coming back to Erlang .What im going to attempt to do is :

• show the erlang example from the nice folks at erlang.org
• rewrite the same in javascript ,
  
• rewrite the same in javascript ,attempting a FP style.

erlang code for factorial

-module(tut1).
-export([fac/1]).

fac(1) ->
1;
fac(N) ->
N * fac(N - 1).

Execution

tut1:fac(4).

a modest javascript equivalent of erlang code

/**
* @author Bhasker V Kode
* @description a modest javascript equivalend of the erlang factorial example.
* @date Jan3 ,2007
*/
function fac1(number){
var total = 1;
for(var N=0 ; N <>

Execution:

alert(fac(4));

javascript equivalent of erlang code with a modest Functional Programming Style

/**
* @author Bhasker V Kode
* @description a modest javascript equivalend of the erlang factorial example.
* @note : oh erlang gods ! please let me know if this could have been more erlangish.
* @date Jan3 ,2007
*/
function fac(total,number){
if(number >1 ){
fac(total+number,number-1);
}else{
return total;
}
}

Execution:

alert(fac(1,4));

Now as the nice documentation said - what ive atttempted to do with this erlang program OR rather the highlight of functional style would be the limited need/scope of variables and instead the fact that the argument to a function can be the result of another function. Pretty wicked huh!

Now i know ive gone wrong somewhere . So if any erlanger / FP guru happened to see this ,they might know ?

• if you cud make the js above with just one argument ?
  
• if you should rather keep increasing the arguments being sent instead of increasing the sum
  

Lets move on to a more cryptic example of embedding functional style of programming into predominantly OOPs based javascript.

XmlWriter : a Javascritpt Class that uses minimalistic Functional Programming Styles

/**
* @author Bhasker V Kode
* @date Jan 4 ,2006
* @description Uused to create xml structures as a string ,and get a string form at any node level ,easily add nodes ,attributes and values.
*/
function XmlWriter(root){
this.totalNodes=new Number(0) ;

this.addNode = function(parent,nodeName,value){
if(nodeName!=undefined){
this.totalNodes++ ;
var len = this.index.length - 1 ;
this.index[this.totalNodes] = new Object() ;
if(value!=undefined){
this.index[this.totalNodes][nodeName] = new Node(nodeName,this.getDepth(parent)+1,value,this.totalNodes) ;
}else{
this.index[this.totalNodes][nodeName] = new Node(nodeName,this.getDepth(parent)+1,this.totalNodes) ;
}
this.index[this.getIndex(parent)][parent].array.push(nodeName) ;
}
}

this.getRoot = function(){
return this.root ;
}

this.getNode = function(parent){
var len = this.index.length ;
return this.index[len - 1 ][parent] ;
}
this.getIndexElem = function(id,assoc){
if(id < 0){
id=0 ;
}
return this.index[id][assoc] ;
}

this.printXML = function (node,str){
if(str==undefined){
var str = new String('') ;
}
var tempArrElem = this.getIndexElem(this.tempIndex,node) , tempArr = tempArrElem.array ;
// this.jsAlert('going to call start tag for this.index['+this.tempIndex +'having name '+ tempArrElem.name+' and attribs '+ tempArrElem.attribs) ;
str+= this.startTag(node,tempArrElem.attribs) + tempArrElem.value ;

if(tempArr.length > 0 ){
for(var j=0 ; j < tempArr.length ; j++){
//this.jsAlert('j='+j+',node :'+node+',this.tempIdex is '+this.tempIndex+'so tempArr is : this.index['+this.tempIndex+']['+node+'] = '+tempArr[j]) ;
this.tempIndex++ ;
// this.jsAlert('going to call printXML with node:'+tempArr[j]+',cuurent str is '+str) ;
str = this.printXML(tempArr[j],str) ;
}
// this.jsAlert('done with filled'+ node+'this.printed = ' + str) ;
str+= this.endTag(node) ;
return str ;
}else{
// this.jsAlert('done with empty'+ node+'this.printed = ' + str + this.endTag(node)) ;
str+= this.endTag(node) ;
return str ;

}

}

this.startTag = function(nodeName,attribs){
if(attribs==undefined){var attribs='' ; }
return ' < '+nodeName+attribs+'>'
}
this.endTag = function(nodeName){
return ' < /'+nodeName+'>'
}

this.getDepth = function(nodeName){
for(var i =0 ; i < this.index.length ; i++){
for(var node in this.index[i]){
if( this.index[i][node].name==nodeName){
return this.index[i][node].depth ;
}
}
}
}

this.getIndex = function(nodeName){
var tempRet=0 ;
for(var i =0 ; i < this.index.length ; i++){
for(var node in this.index[i]){
if( this.index[i][node].name==nodeName){
tempRet = i ;
}
}
}
return tempRet ;
}

this.getXML = function(nodeName){
if(nodeName==undefined){
var nodeName = this.root ;
}
this.tempIndex=0 ;
return(this.printXML(nodeName)) ;
}
//constructor
//adding root node
this.printed = new String() ;
this.index = new Array() ;
this.index[0] = new Object() ;
this.index[0][root] = new Node(root,0) ;
this.root = root ;

}

function Node(nodeName,depth,params,index){
this.array = new Array() ;
this.depth = depth ;
this.name = nodeName ;
this.index = index ;
if(params!=undefined){
if(params.value!=undefined){this.value=new String(params.value) ; }else{this.value=new String('') ; }
if(params.attribs!=undefined){
this.attribs=new String(' '+params.attribs) ;
}
}else{
this.value=new String('') ;
this.attribs=new String('') ;
}
return this ;
}

Execution:

var x = new XmlWriter('channels');
x.addNode(x.getRoot(),'channel',{attribs:'preferred="ndtv"'});
x.addNode('channel','shows');
x.addNode('shows','show',{attribs:'date="05:01:2006" title="waynes world"',value:'21:00:00'});
x.addNode('shows','show',{attribs:'date="05:01:2006" title="cnn news"',value:'22:00:00'});
alert ( x.getXML('channels') );

As you can see with the above example . This class can generate a consistent xml file from any particular node, handle attributes (although i need to add better error checking / escape character into the system) .The interesting part comes in the printXML function where ive implemented a minimalistic function style of programming where . Now ofcourse ive put in plenty of Object oriented javascript as evident with the use of the this keyword generously . But what ive also done is make the final printing of xml darn simple !

In essence my recursive function printXML does the following:

(XmlWriter.printXML in pseudoCode)

1. write the start tag of this node .
   
2. add the attributes
   
3. if this node has a child node ? goto 1 , else goto 4
4. write the end tag of this node
   

So now ....im convinced that javascript has done a good job in imbibing some tips from the erlang examples. The beauty of javascript is that since its pretty native as far as the browser is concerned ,you can write anything or implement any paradigm that isnt native to the langauge yourself . But as many wise ones have echoed over the years that the very fact that you code in a functional programming language style, could change the way you think about programming .

Cheers to my erlang and like my first experiment with functional programming ,the javascript hacker in me is up to the challenge as well 8 ) .

Keep Clicking,
Bhasker V Kode

PS : special thanks to Ricky Clarkson for hinting me to check the code again . i was coding the sum of N numbers although i started out wanting to do the factorial of N numbers ! d 'oH ! : P .... thanks ! I hate bloggers code formatting as well !

Technorati Tags: javascript, erlang, functional, programming, FP, bhasker, kode, bosky101, factorial, programming

Presenting - Proto.in Widget

I hacked this scriptlet today for proto.in ...

To add the following widget into your blog or webpage ,simply add the following line scriptlet into your html code , to get your own proto.in widget...

<script id="protoWidget" src="http://proto.in/protoWidget/protoWidget.js" type="text/javascript" language="'javascript"></script>

Developer Notes:
I used the following 4 files...

protoWidget.css , protoWidget.js , protoWidget.gif, protoLoad.php

I Initially used iframes and the xmlhttp to read cross domain ,but even though i could get around the infamous ' cross domain same origin ' policy ,couldnt pass the data between the iframe and the parent window . SO ,decided to shift to a dynamic script tag and json format where i spit out the feed xml using php into javascript which was dynamically appended to the dom .A word of caution if you are planning to make your own feed reader ! Dont fall for the unterminated string error .xml as you know will be nicely formatted with elements in different lines ,et cetera . But once you pass this into javascript ,line breaks are a strict NO NO .

Then again ,there 's a hack against this as well. Heres my version of how to retrive cross -domain feed/data without NO hassles of security ,NO browser prompts ,and NO script signing needed. Here you go.(PS: sorry for the code not being aligned properly,but hope u can get a gist of it )

protoLoad.php

var fullXML={bosky:101};

/* reading feed as string into json form */
var _xml={data:'/* pass any site / feed here as querystring. */
if($site){
$fp = fopen($site, "r");
$buffer = "";
// get output in buffer variable
if ($fp) {
while(!feof($fp)) {
$buffer .= fread($fp, 1076);
}
}
$buffer = str_replace("\n","", $buffer);
$buffer = str_replace("\r","", $buffer);
$buffer = str_replace("\t","", $buffer);
$buffer = str_replace("'};

/* ok so now we have the xml string in xml.data . Now to DOM ify it ! */
getXMLTree(_xml.data,'item');

function getXMLTree(xmlStr,nodeName)
{
var xml;
this.load = function (nodeName){
if (window.ActiveXObject)
{
xml = new ActiveXObject("Microsoft.XMLDOM");
xml.async="false";
xml.loadXML(xmlStr);
}
// code for Mozilla, etc.
else if (document.implementation && document.implementation.createDocument)
{
var vParser = new DOMParser();
xml= vParser.parseFromString(xmlStr,"text/xml");
}

if(nodeName!=undefined){
fullXML = xml.getElementsByTagName(nodeName);
}else{
return (xml);
}
}
this.load(nodeName);
}

/* ok so now we have the xml node in fullXML . Now to send it back to client */
parent.window.readData(fullXML);

protoWidget.js

./* client side that initiates the script tag to call protoLoad.php*/

/** METHOD 1 */
** @description This method uses hidden iframe and xmlhttp to read the feed.But it is limited since you cannnot reference data from a child iframe of url location A to the parent window of url location B. You can do this only if you set document.domain explicitly , or the are in the same domain . not very useful !
*/
protoWidget.prototype.readCrossDomain = function(){
this.iF = document.createElement('iframe');
this.iF.id='protoWidgetHost';
var iS = this.iF.style;
iS.border='0px';
iS.width='0px';
iS.height='0px';
this.iF.type='hidden';
this.iF.src = this.crossDomainSrc;
this.add('insert',this.script,this.iF);
}

/** METHOD 2 */
** @description This method uses a dynamically added script tag , which is actually a php file that splits out the feed and puts that into a javascript variable. no securty violations ,no issues . very useful !!!
*/
protoWidget.prototype.readJSON = function(){
var head = document.getElementsByTagName("head").item(0);
var oScript = document.createElement("script");
oScript.setAttribute("src",this.remoteURL);
oScript.setAttribute("id","src1");
this.add('append',head,oScript);
/* makes a call to protoLoad.php here */
}

protoWidget.prototype.add = function(type,addTo,obj){
if(type=='insert'){
addTo.parentNode.insertBefore(obj,addTo);
}else{
addTo.appendChild(obj);
}
}
.
.
.
/* this is called when reading feed is done .in otherwords this is the callback.*/
function readData(_fullXML){
/* thats it ._fullXML is the xml node of the feed ,carry on with the parsing,et cetera . cross browser issue solved . 8 )*/
}

For the full version of the protoWidget.js check it out here .

Oh ,theres no feeling for a geek to substitute writing beautiful code..... 8 )

Keep Clicking,
Bhasker V Kode

Technorati Tags:proto, javascript, bhasker, ajax, widget, rss, blog, bhasker, kode, bosky