The death bed of Adobe Flash Player
I was sitting in my car when I started web browser on my phone and accessed a few websites. It was going fine until I encountered a website furnished with a lot of flash content. It was trying hard to flash some animations on my screen but it failed horribly.
“Oh.. this phone is a curse…” was my first reaction but when I deep penetrated into the cause I found the culprit was the Adobe Flash player either poorly rendering the animations or not rendering at all.
Always in limelight, Adobe Flash Player, was & is the need of the hour as the ant sized plug-in runs giant animations and there is no alternative to it. The animated web world on our desktops is pushed over only because of the Adobe’s slick creation. Over the years, Adobe’s loyal plugin has bagged umpteen popularity and sooner it became the necessity for users from a kid to an entrepreneur. Adobe Flash Player has the potential to run the websites, animations, games and even the campaigns over the websites are driven by a Flash player.
From desktops to laptops, to tablets and to mobile phones, Adobe Flash Player is always a part and parcel of the web world. When all other similar products are failing, Adobe Flash Player was enjoying its monopoly till it was hard brunt by the latest version of HTML language i.e., HTML 5.
W3c(World Wide Web) Consortium claims that HTML 5 is much more advanced and has the potential to play videos, audios, animations and graphics without the support of any such plugins. Woah!! it’s miraculously claiming that now there is no need of Adobe’s Flash player anymore, at least not in the mobile world.
Since no technology comes with negative critics, HTML 5 is also facing a few blows when it encounters age old browsers. It is still lagging behind with the desktops but it has marked its influential presence in mobile phones and the tablets.
Once thriving Adobe Flash player is now in the doldrums as the latest technology in software and hardware is thrashing its shields. Apple’s godfather, Late. Steve Jobs, too went rough on Adobe when he indicated in one of his documents that Apple is eliminating any dependencies on Adobe Flash player in its iPad and iPhones. Even Adobe has declared that it is not going to upgrade its flash player for mobile phones though it will continue its development for desktops.
Now it is realized that the golden days of Flash player are gone now and soon it will be a thing of the past. Finally, lets wait and watch for the time when we will get all the web content in HTML 5.
Top 7 Website Templates Provider
1. Template Monster
Template Monster is a world leader in e-commerce – providing customers with valuable, convenient, relevant and enjoyable online experiences through a diversity of products and services. The main orientation of the company is web design with an emphasis on affordable web design products and services. more
2. Website Templates
Website Templates is a time-proven and still unbeaten web design solution in terms of money and quality. A premade web template is something that can help you to launch a site right away spending time on updating content without any concern about site’s attractiveness. more
3. Templates.com
Templates.com is a brand new and yet very powerful resource for those who are looking for different design products. Everything a designer might possibly need is gathered right here – 3D models, illustrations, icon sets and website templates. more
4. Steves-Templates
Steves-Templates.com offers free website templates and professional premium web templates. Each template is compatible with all current browsers on the market including Firefox, Internet Explorer and Chrome and will fit most any screen resolution used. more
5. Dream Template
DreamTemplate.com offers exclusive premium web content solutions for web developers and webmasters. The templates available on DreamTemplate go through an extensive quality control department before they are available for download and generally have immense visual appeal. more
6. Styllish Templates
StylishTemplates provides free, premium Website Templates which you can download and use on your own website. These are pre-designed Website Templates which you simply download, add your own content, and then simply upload to your web hosting provider. more
7. Best Web Templates
Best Web Templates is a unique gallery of readymade templates which are user-friendly and very flexible for customization. The process works out very well for those who have very limited time to start designing a new site right from scratch and for those who have a limited budget for their projects. more
JSON Tutorial: How to get the key and the value
In my last tutorial GET VALUE FROM JSON OBJECT, I described you the way to get the value from the JSON object. However, it is not enough in the real time situation. In a more dynamic environment, many times we have to display the key also. With the same example that I used in my last tutorial, we will proceed to get the key and the value of JSON object.
var jsonObj = {"department":{
"webdesign":[
{"employeeCode":"EMP1",
"age":22
},
{"employeeCode":"EMP2",
"age":21
}
]
,
"webdevelopment":[
{"employeeCode":"EMP1",
"age":23
},
{"employeeCode":"EMP2",
"age":24
}
]
}
}
for(var key in jsonObj){
alert("key: " + key + ", value: " + jsonObj[key])}
The above loop will give alert the key as department and value as an [object][object]. It means that this loop is running over the first level of this JSON object.
Well now if you want webdesign and webdevelopment to be displayed as keys, you need to run another loop which is nested inside the above loop.
The code is as follows:
for(var key in jsonObj){
for(var subKey in jsonObj[key]){
alert("key: " + subKey + ", value: " + jsonObj[key][subKey]);
}
}
Hence, we will be able to get the key out of the json object using this simple technique. Any comments or suggestions are always welcome. 
2010 in review
The stats helper monkeys at WordPress.com mulled over how DevelopersPage did in 2010, and here’s a high level summary of its overall blog health:
The Blog-Health-o-Meter™ reads Wow.
Crunchy numbers
A helper monkey made this abstract painting, inspired by your stats.
A Boeing 747-400 passenger jet can hold 416 passengers. This blog was viewed about 9,500 times in 2010. That’s about 23 full 747s.
In 2010, there were 10 new posts, growing the total archive of this blog to 17 posts. There was 1 picture uploaded, taking a total of 12kb.
The busiest day of the year was September 21st with 624 views. The most popular post that day was JSON Tutorial: get value from JSON Object.
Where did they come from?
The top referring sites in 2010 were alphainventions.com, google.co.in, en.wordpress.com, awesomerails.wordpress.com, and google.com.
Some visitors came searching, mostly for jquery collapsible panel, json get value, collapsiblepanel jquery, get value from json, and collapsible panel jquery.
Attractions in 2010
These are the posts and pages that got the most views in 2010.
JSON Tutorial: get value from JSON Object May 2010
Collapsible Panel with nice Sliding effect September 2009
4 comments
jQuery Accordion April 2010
1 comment
Add rows dynamically to a table using Javascript August 2009
2 comments
Draggable popup window May 2010
Divs overtook textboxes and textareas
After much usage of standard textboxes and text-areas, it was time for me to scream “Eureka”! Just as I thought of trying something new and creative, I decided to make a div editable. Did you ask Why? Because it was helping me overcome the browser compatibility issues, and fortunately divs behave same in all browsers. So the immediate next question that my mind came across was – Where to start from?
I googled around and found a small piece of code which I am eager to share with you guys. After all, knowledge shared is knowledge gained Copy the code below and paste it inside body tags:
<div onclick="this.contentEnabled='true';"> EDIT THE CONTENT HERE </div>
The above self-explanatory code can be used to make divs editable and behave in the same way a text box or text-area does. While this code solves the purpose of editing inside a div, you can apply some CSS fundas to make it more elegant and aesthetically appealing
Easiest way to reset CSS
CSS reset is one of the most important concept for any UI developer. CSS reset is done to avoid many browser incompatibilities in terms of margins, paddings, vertical alignments, borders, outlining etc.
After a little experimentation with the CSS, I found a very easy one line solution to this concern which I fortunately found browser compatible as well as easy to understand and grab.
In the first line of your CSS file just write the following code and see the magic
*{margin:0; padding:0; border:none; outline:none; font-size:100%;}
The above code will reset the margin, padding, border, outline and font-size of all existing HTML elements to the values defined against them.
Its easy and powerful. right?
I hope this little post will help you a lot. Thanks
Add attributes to an XML node dynamically
If you do not want to hard code the attribute of an xml, then you might have landed on the right page. After trying a lot I succeeded in adding dynamic attributes to an XML node in flex. Let us take an example to do so.
The XML structure we are going to modify is as follows:
var xml:XML = <nodeOne name="node1"> <subNodeOne indicator="Green"></nodeTwo> </nodeOne>;
Now, my target is to obtain and write node1 as an attribute and value of indicator as its value in a new xml. Means I am getting the dynamic attribute for the new xml. After processing, my new XML should look somewhat like this:
<newNode node1="Green"></newNode>
To achieve this, I have written the following, easy to understand, piece of code:
var parentNode = <data></data>; var nodeName:String = xml.@name; var indicatorValue = xml.nodeTwo[0].@indicator; var newNode:XML = <newNode></newNode>; newNode.@[nodeName] = indicatorValue; parentNode.appendChild(newNode);
Description
1. The first line is creating a parent node for the xml.
2. Second and Third lines are getting the required values from the given xml.
3. Fourth line is creating a new tag in XML by the name newNode.
4. The main trick lies in the line FIVE. If I simply write “@nodeName” after period(.) in newNode variable, it will show nodeName as an attribute to newNode in the result, however, when I used Big Brackets around the nodeName, it picked up the string value inside the nodeName variable and added node1 as an attribute to newNode.
newNode.@[nodeName] = indicatorValue;
The above line is the key to dynamically add attributes to any XML format.
5. The sixth line is of course appending the newNode to parent node.
I hope this post will help you in solving the dynamic modifications of an XML
var indicatorValue = xml.nodeOne[0].nodeTwo[0].@indicator;
Indian Rupee gets a symbol
Hey friends, Im gonna post here the new symbol for Indian currency i.e., Rupees. From now onwards it is the official currency symbol of Indian Rupees. Though it will take some time to add a default character for Indian Rupee symbol in special character option but im sharing a link with you where you can download the font for Indian Rupee, which is a great effort done by Foradian. You can use it in Microsoft Word, Adobe Photoshop or any software that has some text editing features. Here we go:
Download Font Here or click on the image below:
Indian Rupee
Steps to download, install and use the font:
1. Click on the download link or the image. A window will pop out asking you for the location to save.
2. Save it on Desktop or any desired location.
3. Now proceed with the following process:
Start >> Click on Run >> type Fonts >> Enter.
4. Here you will see a list of various fonts installed on your system.
5. Copy the downloaded font and paste it here to install…. Now the font is ready to use.
6. Open the text editor and press ( ` ) symbol (its above the tab button and before 1).
Have fun the font!!
Add rows dynamically using Javascript
Developed by: Sandip Makwana
Hey guys there is another useful script that adds a new row to a table during runtime. The previous script Add Rows Dynamically to a table using javascript used DOM elements, however, this is pure javascript. Download the source code and have fun with the script
Demo:
Add Rows Dynamically using Javascript
Compatibility:
Download:
Draggable popup window
Compatibility:
Source:
Just embed the following code in the head section of the page.
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>var dragElement = false;var xDif = 0;var yDif = 0;function mouse_down(event, elementName){var leftDim = document.getElementById(elementName).offsetLeft;var topDim = document.getElementById(elementName).offsetTop;dragElement = true;xDif = event.clientX - leftDim;yDif = event.clientY - topDim;}function dragWin(event, elementName){if(dragElement == true){document.getElementById(elementName).style.left = event.clientX - xDif + 'px';document.getElementById(elementName).style.top = event.clientY - yDif + 'px';}}function mouse_up(event, elementName){dragElement = false;document.getElementById(elementName).style.left = event.clientX - xDif + 'px';document.getElementById(elementName).style.top = event.clientY - yDif + 'px';}$(document).ready(function(){$(".close").click(function(){$("#popupWin").fadeOut('slow');})$("#showWin").click(function(){$("#popupWin").fadeIn('fast');})$("#minWin").click(function(){$(".content").slideUp("slow");$(this).hide();$("#maxWin").show();})$("#maxWin").click(function(){$(".content").slideDown("fast");$(this).hide();$("#minWin").show();})})</script>
Description:
Before getting into the description first of all you need to download the latest jquery-1.3.2.min.js file. Embed this file in the page and dont forget to give the right location.
The logic behind this code is very simple. On mouse down, I am taking the difference between the left and top offsets of the window and the x and y position of the mouse. event.clientX and event.clientY are responsible for giving the x and y position of mouse pointer respectively. Also, I have taken a flag ‘dragElement’ and set it to true. Now, when the flag is true the onmousemove function called on body will get active which leads to the movement in the popup window. Well apart from this I have used a little bit of jQuery to add the effects to the window.
Download popup window
