DPI or Dots per inch is for Print. It has nothing to do with web. You should consider about it only when you have print requirement.

Significance of value of DPI for Printer:
First thing first we are talking here about DPI of Printer and should not be associated with DPI of image right now. DPI is used to describe the resolution number of dots per inch in a digital print and the printing resolution of a hard copy print dot gain. A dot matrix printer, for example, applies ink via tiny rods striking an ink ribbon, and has a relatively low resolution, typically in the range of 60 to 90 DPI. An inkjet printer sprays ink through tiny nozzles, and is typically capable of 300-600 DPI. A laser printer applies toner through a controlled electrostatic charge, and may be in the range of 600 to 1,800 DPI.

Printer gets information not in pixel but in physical dimension say printer gets command to print 1 inch by 1 inch rectangle data. A 300 dpi printer would look for 300 dots data in digital data received. Now if the density of digital data (ppi -pixel per inch) is less than 300 (approx since ppi is not exactly equal to dpi) then image quality will be low (300ppi image data will have greater information filled in one inch than 72ppi. Right.) The more the dots printer can print and more the ppi of image the better the result.

Note: Printer doesn’t scale images based on its PPI. It prints what it gets.

Significance of value of DPI for Image:
Now back to digital word, DPI actually has no meaning. Its loosely equated to PPI and is significant when comes to printing data. Lets understand PPI. Say you have to take a picture which of a  square 1inch wide. Now if you want a good quality image you would prefer to have finest detail of that picture captured. You can capture the data using 300 pixels (300ppi) of inch or say using only 72 pixels (72ppi). Which is better? No point for guessing. 300 ppi of-course. What will be the image dimension of these two images in digital world (physical dimension would be 1 inch).   Obviously a you need 300 pixels to display 330 pixels and 72 pixels for 72 pixels So image dimension would be 330 X 300 and 72 X 72 respectively.

Significance of DPI (or PPI) for Printing Software:
Printing/Editing software such as Photoshop utilizes this PPI information embedded in the image to determine the actual print size of image in physical word by equating PPI to DPI.  If not present depending on software used it assumes PPI to 72 or 96ppi. When the data is send to printer this densified data is used by printer to get the print quality.

All above is applicable for Bitmap data and not Vector. Vector doesn’t work on DPI/PPI. For example flash, svg, pdf are vector format. these format takes care of print quality when sending data to printer of all the “vector objects” inside them.

Publish Settings

Now when you Publish this file (Crtl + Enter) you will get an extensive size report which will have a section for fonts used in the file:

To find all these fonts go to Window > Movie Explorer and select Text tab (shown below)

You would wonder why I asked to first generate size report while movie explorer shows all fonts. Reason if there are any text fields which don’t have any text in it (empty text field) then these would not be shown in the Movie Explorer but size report will count them. So now the task is to clear all these text fields till size report is clean with any font report.

Solution – Skin.swc was the culprit. There were some textfield (static, dynamic) used in the skin fla. Skin file should not have any text field. Skin is purely used for rich graphics so if you do use text filed then break part (Ctrl + B) them till they become shape.

Cheers!

e.g. TypeError: Error #1034: Type Coercion failed: cannot convert mx.managers::BrowserManagerImpl@2ee8581 to mx.managers.IBrowserManager.

FIX: Import the class to which the compiler is trying to cast to in the parent application. In this case

import mx.managers.IBrowserManager;
private var bm:IBrowserManager;

Hope this will save some of your time.

Lets briefly cover the some web basics:

W3C -The World Wide Web Consortium (W3C) is an international community where Member organizations, a full-time staff, and the public work together to develop Web standards. W3C develops technical specifications and guidelines through a process designed to maximize consensus about the content of a technical report, to ensure high technical and editorial quality, and to earn endorsement by W3C and the broader community. A few of them are described in next two points.

HTML and CSS– HTML and CSS are the fundamental technologies for building Web pages: HTML (html and xhtml) for structure, CSS for style and layout.

Javascript  -Standard APIs for client-side Web Application development. Scripting can make Web pages more dynamic.  It is based on ECMAscript W3C recommended, JavaScript is officially managed by Mozilla Foundation.

Web browsers - are software primarily used to view a “web” resource (generally HTML). The top browsers are IE, FF, Safari, Chrome and Opera. Out of these FF, Safari and Chrome are partly open source. Browsers are used to display resource (HTML, image, XML etc).

Webkit, Gecko, Trident– These are browser rendering engines. Both Safari and Chrome use Webkit. IE use Trident and Mozilla, Gecko .Webkit is an open source rendering engine which started as an engine for the Linux platform and was modified by Apple to support Mac and Windows.

H.264– H.264 is a high-performance codec that is maintained by the ISO Moving Picture Experts Group (MPEG) as part of the MPEG-4 family. A video codec is software or a device that enables video compression and or decompression for digital video.

So where W3C standards (HTML, CSS and javascript) and above terms fit in the system and who does what when it comes to viewing a web resource? Let’s understand it this way. Suppose you want to create your own browser. Where would you start from? One of the primary roles of a browser is to locate a web resource and render HTML. Since this topic is dedicated to understanding HTML and browsers we will keep the scope limited. Your browser architecture design would consist of UI, browser and or rendering/parser engine (HTML, CSS intepreter), networking layer, UI repository layer (e.g. buttoon), Javascript interpreter and data storage layer.  The rendering engine should understand and comply to the basic ingredients (language) of a web resource i.e. HTML, CSS and javascript. Each of these has their own standards and specifications. The specifications are maintained by W3C organization (hosted by the Massachusetts Institute of Technology Computer Science and Artificial Intelligence Laboratory [MIT/CSAIL] in the United States, at the European Research Consortium for Informatics and Mathematics [ERCIM] in Sophia-Antipolis in France, and at the Keio University Shonan Fujisawa Campus in Japan.).

Firefox uses Gecko – a “home made” Mozilla rendering engine. Both Safari and Chrome use Webkit. IE use Trident and Mozilla, Gecko .Webkit is an open source rendering engine which started as an engine for the Linux platform and was modified by Apple to support Mac and Windows. See http://webkit.org/ for more details.  Essentially your browser should now represent the tags in presentable format. E.g the browser should be able to parse the image tag as per the specifications http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#h-13.2

HTML being opensource and ubiquitous is the language of web. The current version of HTML is HMTL 4 (HTML 5 is in Working Draft). Why HTML 5? Since the time HTML 4 was finalized (1997) the web has turn around to web 2.0 with RIA replacing the web with plugins like Flash, Silverlight etc it became evident that web needs “more” and hence HTML and its fellow languages need to upgrade to have a consistent mode of delivery. Okay so the question arises why plugins came  to existence at all. The answer lies in user experience and dramatic increase in hardware capabilities that deliver web. HTML4 has shortfalls to be in race. So for example HTML 4 doesn’t specify any tag to hold video and therefore browsers weren’t allowed  to render videos of their own. To deliver videos people used <embed> tags specifying the plugin (embedded software) to handle it. And then came plugins like flash which took the web to next level by providing a medium to deliver rich media, enriched user interactions and experience.

In the next post I will cover the codec and Flash HTML5 war that’s going on endlessly.

To install:
Help->Find And Install->Search for new features for install->New remote site
Add Name: subclipse and in URL put http://subclipse.tigris.org/update_1.0.x/

To Checkout the project from SVN:
File->New->Other..->SVN->Checkout projects from SVN->
Click “Next” -> Create a New Repository-> Add URL and then select the project folder

There are couple of ways to create branch. But before that one key note.
Say if you are using Tortoise SVN as your desktop client and subclipse as the the eclipse plugin. There could be version conflicts; so do ensure that you make all commits and checkout through subclipse.

Coming back to branching.
Follow these steps from your desktop client for Branching:

1- Create a new folder in SVN for holding branches e.g. “branches”
2- Right Click the folder (trunk) whose branch need to be created
3- Selected “Branch/Tag” option
4- In “To URL” add the location https://foo.com/svn/foosvn/branches/{foobranch}
Note: Don’t create {foobranch} folder on SVN beforehand. If you do then you might get an error saying “Path Already Exists”.
5- Now select an option the choice e.g.”Head Revision”,  “Working copy” etc.
6- Click OK
This will create a folder named “foobranch” as a branch of trunk

To Switch to branch:

1- Right click the project folder (which you have checkout from trunk) in the Flex Builder IDE
2- Select Team->Switch..
3- Add the branch URL in “To URL”
Press OK and now your project will be on branch. Any changes that you might have made in your local will now get committed in the branch when you make a commit now.

Read more about profiler here: http://livedocs.adobe.com/flex/3/html/help.html?content=profiler_1.html

Okay, so the post is not about what and how profiler works. In most of the cases you just need to click the “profile..app” button in the IDE. But at times you may find it not working. Here I am putting down one possible way to fix it and look out for:

Flex profiler actually listens for messages from the profiler agent. The profiler agent is a swf launched in parallel to your main swf. It is located in your Flex workspace at .metadata/.plugins/com.adobe.flash.profiler/ProfilerAgent.swf.

Now Flex Builder reads a file called mm.cfg which has the location profileragaent.swf. mm.cfg can be located at  c:/users/user (Windows). It should have a name-value pair indicating the location of ProfilerAgent.swf. Create (or edit existing) mm.cfg and add following line

PreloadSwf=Drive:/…/yourworkspace/.metadata/.plugins/com.adobe.flash.profiler/ProfilerAgent.swf?host=localhost&port=9999

In addition to above you can other options which are quite helpful for debugging:

ErrorReportingEnable=1
TraceOutputFileEnable=1

Above options will redirect the trace() output to an external file which can you browse using any text editor.

The flashlog.txt file will be created in the following location: C:\Documents and Settings\username\Application Data\Macromedia\Flash Player\Logs\flashlog.txt

Let me know if this post saved your couple of hours

Waterfall and Agile are “principles” whereas Scrum and XP are “practices” for project management. By definition “prinicple” is a rule or law concerning a natural phenomenon or the function of a complex system. It doesnt provide concrete steps, roles and responsibilities and parts of a system.

Waterfall – More correctly it is a software development “model” which talks about principle and flow of system. Waterfall is a sequential software development process where progress flows from top to bottom. Below is the flow in Waterfall:
     REQUIREMENTS –> DESIGN –> IMPLEMENTATION –> VERIFICATION –> MAINTAINENCE
 Only and only when the first step is complete and signed-off the project moves to next. The customer feedback appears very late in SDLC.

Agile – Waterfall talks about sequence whereas Agile favours iteration, quick results, incorporating changes early in the SDLC.
Some of the principles behind the Agile Manifesto are (reference http://en.wikipedia.org/wiki/Agile_software_development):

• Customer satisfaction by rapid, continuous delivery of useful software
• Working software is delivered frequently (weeks rather than months)
• Working software is the principal measure of progress
• Even late changes in requirements are welcomed
• Close, daily cooperation between business people and developers
• Face-to-face conversation is the best form of communication (co-location)
• Projects are built around motivated individuals, who should be trusted
• Continuous attention to technical excellence and good design
• Simplicity
• Self-organizing teams
• Regular adaptation to changing circumstances

 To sum up Agile welcome “Changes”.

Scrum - Is “methodology” to implement Agile software development. It defines processes, roles and responsibilites to carry out Agile development. The three main roles are:

• Scrum master
• Product Owner
• Team

Scrum master facilitates the process by monitoring it. Product owner is the one who priotizes the requirements and defines a sprint. Scrum Team do not have any heirarchy. Everone in the team has features to work on and owns it.  Scrum being agile believes in quickly showing the outcome. All requirements are not frozen before development and with an overall picture of software and initial requirements; the development starts. These requirements are then priotized and broken down in “sprints”. Each sprint is delivered (working software) in 2-3 weeks. This way customer feedback of each sprint is incorporated early in SDLC.

Extreme Programming (XP) – XP is another methodologies for agile development. It advocates frequent “releases” in short development cycles. XP can also be implemeted together wiith Scrum.
XP is more about how to program (code) in agile development. XP is about simplicity, discipline, ownership of your code and following best practices without fail. 
One of the key principle of XP is to always design and code for today and not for tomorrow. Since it talks of quick development. XP programmers need to ensure stable, reliable and faster code development.
Some key components are: Pair Programmng, Write test before code, collective code ownership, refactor often and continous integration.

Most of the in-house product develoment companies are adopting Agile while service companies still either works in Waterfall model or a mix of Agile and Waterfall. The main reason Agile adoption is difficult is that it requires a learning curve both for the vendor and customer. Agile is fluid cost model and if not properly controlled could overshoot time and cost.

_objLoadedAppSystemManager = SystemManager(_objLoader.content);
trace(_objLoadedAppSystemManager.application) //null

The SystemManager’s ‘application’ property holds the reference to the application loaded. The problem is if you try to access this property once the SWF is loaded (by listening SWFLoader’s COMPLETE or INIT event) you will get null since the loaded ‘application’ didnt get initialized properly. One of the solution is to listen to the SystemManager’s APPLICATION_COMPLETE event.

_objLoadedAppSystemManager.addEventListener(FlexEvent.APPLICATION_COMPLETE, onLoadedAppInit);
...
...
private function onLoadedAppInit(objEvent:FlexEvent):void
{
	_objApplication = (_objLoadedAppSystemManager.application) as Object;
	_objApplication["functionname"](param);
}

Now you would be able to call the function (e.g. “functionname” as shown above). This function should be defined the main application file/class of the loaded application.

...
instancetextObj.htmlText = "<font size='28' face='Arial' >Hello <b>How</b> <font
size='28' face='SomeOtherFontFace' >Are </font> You</font>"
...
<mx:Text id="instancetextObj" />

I ensured that the fonts used above are embedded. My css look like:

@font-face {
    src      : url("asset/font/embed_fonts.swf");
    font-family    :  "SomeOtherFontFace";
}

@font-face {
    src      : url("asset/font/embed_fonts.swf");
    font-family    :  "Arial"; 

}

The swf has all the necessary fonts embedded (all required font-weight/typefaces). But somehow it didn’t worked.

Solution:
The solution is that the texfield requires a default font family defined which is embedded
So if you make a simple change to the mxml definition of your textfield like this:

<mx:Text id="instancetextObj" fontFamily="Arial" />

It will work.
The better solution is to defined the font family in a “global” style name in css

global
{
     font-family   :   "Arial"
}

I hope this might save your few hours!