Skip to main content

Posts

Book review: Steve Jobs Way by Jay Elliot

I finally completed reading ‘Steve Jobs Way’ by Jay Elliot. I wanted to know how Apple became so innovative and so successful and I knew that Steve did an awesome job to bring this company to a state which is very well known today. Before I started reading this book I had a notion that this book would focus on how hard work or dedication would pay off and all that stuff that one would generally see in any book. This book was different. Different in a way that it taught me the qualities a leader in any industry should have.

CSS media queries in JavaScript

I like the media queries feature added to CSS 3, that allows web application developers or designers to define styling sheets for a range of output devices. A media query consists of a media type and one or more expressions that limits the style sheet scope. I was wondering if JavaScript can be used to update the elements in page, say changing the source attribute of an image based on the device width. Turns out there is a function matchMedia which accepts a media query string as input and returns the result.

Using HTML5's FullScreen API

I've been looking into ways in which a web application can be made more user friendly and HTML5 does include some powerful features such as PageVisibility, Navigation Timing, etc,. that can be used to provide good user experience. Today I was looking into FullScreen API that allows you show any of the elements in the DOM in Full-Screen mode. Suppose you have a HTML5 video embedded in a page and would like to play that video in full-screen mode then it is now possible with the FullScreen API. Similarly say if you have an image element, it can also be shown in full screen mode.

ColdFusion 10: Application specific VFS

I’ve always liked the Virtual File System (VFS) implementation in ColdFusion, but I always griped about one thing. The files written to the VFS are available at the Server level and are not specific to an application. However, ColdFusion 10 now includes support for Application specific in-memory file system. This means that, if you write a file to the virtual file system, only those files in the same application can access it. If an attempt is made by another application to access this file, the server would happily throw an error.

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.

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.

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.