Apr 18, 2012

Pushing HTML5 Video content over ColdFusion WebSockets

I’ve been playing with the WebSocket feature introduced in ColdFusion 10 for some time now. I was trying out pushing images over a ColdFusion WebSocket channel and it worked just fine. But this time I wanted to put WebSockets to test and wanted to push large data at regular intervals. I thought maybe I can push video data over WebSockets and it turned out that there is no direct way to stream video data to many clients. I came across the function - drawImage that can be used to draw an Image or Video on a HTML5 Canvas. Once an image is drawn on the Canvas, it’s base64 encoded data can be obtained by calling the toDataURL function on the Canvas object.  This data can then be transferred over a ColdFusion WebSocket to all subscribers who can then use this  data to draw the image(video frame) on a Canvas.

Apr 13, 2012

Anchor elements in jQueryMobile referring to the same page retain the state

This week I started to learn jQueryMobile and was going through the online documentation that explained the basics. While I was trying out the sample examples, I came across an issue that I thought I’ll share with you. I had posted this on the jQueryMobile forum but I didn’t receive any solution to this. The issue here is when you have two anchor elements with its ‘href’ attribute pointing to the same div (#child data-role=”page”) with one marked as a button and the other marked as a popup dialog, then which ever button you choose first its action will be applied to the other button as well. Say if you click the second button that shows the dialog box containing the page it works fine, but now when you click the first button it shows the dialog box instead of showing it as a page. This is how it works the other way too i.e. if you click the first button the page is shown (as expected), but on clicking the second button it shows the page instead of displaying it as a dialog box.

Apr 2, 2012

Content flow in CSS3 regions

Today I was reading about CSS3 and I stumbled upon CSS3 regions. I was completely flabbergasted with what I saw and learnt today. Imagine that you’re trying to build a website for a magazine containing multiple columns (say 3). It would be arduous to fix the textual content on a particular column and then move the rest of the text to other columns. Now with Content Flow mechanism, the extra content can be moved to other columns in the layout with ease. There are just a couple of properties that you need to define in the styling sheet and you’re done. But this is not it. When you resize the browser window, the content automatically flows to other regions depending on the browser size.