Reality is a perception. Perceptions are not always based on facts, and are strongly influenced by illusions. Inquisitiveness is hence indispensable

Friday, July 18, 2008

Robust Web Design - part 1

For a change I will speak of Dos and not about Don’ts. Who likes a wailing moron anyway?

On a mark, get…


The first thing to do before we start off into code is to acknowledge and assess ones own competencies. Most often, I see people, who fool themselves into the misconception, that web-design is simple. Well they are not exactly guilty. Most often one can see that HTML is no rocket science. A two day reading of the material is sufficient. Any design can be realized with the knowledge of tables. The challenge is convincing oneself that there are things beyond the obvious, and learning is never obviated (warning: obviate isn’t a synonym of obvious). The litmus test I would use: Ask the developers if they are aware of something called quirks mode.

The first phrase is DOCTYPE and a great leap for design


Neil Armstrong landed on moon, and it was rocket science. Now DOCTYPE doesn’t leave a trail of fire, nor is a achievement telecasted globally. Besides that, DOCTYPE is one part that is capable of setting you on fire and telecast your monumental failure across the group.
The possible DOCTYPE declarations and their effects are well presented in Quirks_mode
My suggestion, use XHTML strict in standards mode. Note that having any comments before DOCTYPE declaration in IE trigger quirks mode. One may occasionally wonder why go to such extremes, the answer is simple: Invest and Profit or Ignore and Pay later. A strict standards adherence guarantees minimal deviation across browsers. ‘Almost strict’ is also desirable though.

Raise and Fall of mark-up – XHTML


The most interesting thing about standards is that they promise huge benefits and deliver little. XHTML is one aspect of standards that raises my suspicions. Just to avoid the notoriety of being an eccentric designer, use XHTML. Who knows, somewhere down the line there may come a day. I bet that Michael Faraday never dreamt of the modern marvels of electricity the day he discovered it.

Thursday, July 10, 2008

Good practice, bad practice

When I was young, I had a nasty habit of biting finger-nails. My parents tried hard to convince me that it was bad, I couldn’t' see what was wrong with that. After all, those are my fingers, aren’t' they? Before I tell you how I quit that habit. I got to tell you, how amused I feel when I think about it. To may amazement, when I get to see people writing crappy code around, I don’t' feel equally amused. Narcissistic SOB, I may be.

I most amusing part is the climax, where you confront them. You get to hear interesting arguments in defence. Some almost child like ones: "But the final affect is the same" or "It works, and what you are telling is not very straight forward". Some rather thoughtful ones: "It’s already tested". Seldom some arrogant ones: "Why doesn’t' he/she do it". Most of the times, the final result is a compromise. The times one sees beautiful code, one can assume that there is egoistic SOB down under. I like these guys. They write code as if they have discipline imbibed into their cerebral cortex, only to find that they can be as sloppy as your neighbour’s cat.

Now don’t' get me wrong. I know that people learn from mistakes. Adaptability is a virtue. The SOBs have had their share of misgivings. Remember the scene from movie MATRIX where neo jumps of the building! no one jumps the first time, not even the ONE. Taking shortcuts harms, but shortcuts are supposed to be short. It is like driving through city center. When you are new to the city, don’t' take shortcuts. Keep to the main road. That is the greatest shortcut. People tend to ignore the greatest shortcut of all, do your research, don’t' wait till you see the river, find out where the river is even before you reach.

A wise man once said that there are no dumb questions. Let me blabber about what I feel about "The final affect is the same". Well is it, is it really. We are forgetting the fact, that two months down the line, when some miscreant changes requirements or finds a new defect. I wouldn’t' like to waste my energy. Nor would I like my brotherhood of #£$$% (fill your own stream) to suffer. Most seriously, I am willing to spend two days right now than slog late into nights for months, later on. The final affect is on you dear, and you effect the affect.

For, "It works, and what you are telling is not very straight forward". You are damn right. So does walking. Why learn cycling or drive a car or take a flight. Knowing things is difficult, but when it can give some real soul satisfaction. Ask any teenager fiddling an engine. "It’s already tested" is the most difficult one to justify. The only excuse I have is that it makes you fall out of habit. For "Why doesn’t' he/she do it", trust me this isn’t' a flight to Moon, even that was repeated. (Or is it?)

The only difference between the nutcases who organise their stuff with the rigmarole of a fascist and the rest of the world is the same one between those willing to till the soil, creates a fertile bed and between other gatherers. All we are speaking of is some interest, planning, discipline and investment.

Thursday, May 8, 2008

When Spring Comes...

Lost in the wind, lost in the thought, not alone am I?
Equally lost are the wandering leaves and cold nights;
Oh dear bright flowers that I see around, tell those friends,
That I miss their sight. The bright sunny days have stolen my sleep.
My slumber time dreams are now just a slimmering gleam.

Friday, February 22, 2008

CSS Magic and Mayhem

Cascading is wonderful thing. It can be fun, like the old times when you used to play with toy trains. It can change colors and act bitchy too. Most CSS designers take short cuts, infact many swear by googling around. This argumentative attitude doesnt' foster creativeness. I strongly believe that we should google around for ideas, not for doing homework! After reading a couple of books here and there, I began to appreciate the ingenuity of the UI designers and the hurdles they face.(I am not yet into CSS, so please excuse the seclusion).

CSS, is as a template for styles. Any aspect of software has three major features at a very high level - 1.) Static 2.) Functions 3.) Behaviour. UI is no exception. Static aspect is the aspect which is fixed in a completed application. It is essentially code that executes. Functionality is the purpose for which the code is written. Behaviour speaks about the variations in which the Functionality is achieved. In W3C UI, html takes the static aspect. Being an UI application, we desire to have loads of eye-candy; images, fonts, flash, gradients, sounds etc. This eye candy needs to be consistent across the application. Who would like to have an application in which a page footer with the same content shows up differently in different pages. Behaviour is affected by the ability of the User agents like availability of scripting, browser version etc.

The CSS best practices include avoiding Classitis, Divitis, spacer-gifs. There are other desirable features that make a developers life simple like; using strict DTDs, overriding browser defaults, using liquid/fluid layouts.

When it comes to managability, I find two very intriguing factors.
1.) Design themes
2.) Seperate concerns, into reusable classes or css scripts for colors, fonts, layouts
3.) Create themes for the design
4.) Negotiate the exceptionally difficult UI features with the client. An example would be interweaved style usage: " Role: Consultant Organisation Charing Cross Hospital
for such instances negotiate for a single uniform style for content and try to move the enhancements to Java script.

As always, I will try to include a small CSS snippet for toying around.
#########################################################

Html content


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="eGMS.accessibility" scheme="WCAG" content="AA" />
<meta http-equiv="Content-type" content=
"text/html; charset=us-ascii" />

<title>This is Sample 1</title>
<link rel="stylesheet" type="text/css" href=
"../css/samplecss.css" />
<SCRIPT language="JavaScript" SRC="../js/footersetting.js"></SCRIPT>
</head>

<body>
<!-- information tag is used to differentiate footer from main content -->
<div id="information">
<div id="banner">
<h1>Banner is being shown</h1>
</div>

<!-- horizontal navigation -->
<div id="horiz_nav">
<ul>
<li>horiz_1</li>

<li>horiz_2</li>
</ul>
</div>

<!-- main content wrapper -->
<div id="school">
<!-- main content -->
<div id="book">

<!-- primary content -->
<div id="rhymes">
I am a little tea pot, Short and stout, This is my CSS,
Please take me out!
</div><!-- secondary content -->
<div id="questions">
Why did johnny eat sugar? Why did London bridge start
falling and when is it going to break its fall? When did
rats learn to repair clocks? Why didnt' jack and jill
call 999?
</div>
</div>

<!-- vertical navigation -->
<div id="vert_nav">
<ul>
<li>vert_1</li>

<li>vert_2</li>
</ul>
</div>
</div><!-- main content wrapper ends -->
</div><!-- information ends -->

<!-- footer -->
<div id="footer">
Thats' all folks!!
</div>
</body>
</html>
##################################################################

Sample CSS


/* undoing browser defaults */
:link,:visited {text-decoration: none;}

ul,ol {list-style: none;}
h1,h2,h3,h4,h5,h6,pre,code,p {font-size: 1em;}

ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {margin: 0; padding: 0;}

a img,:link img,:visited img {border: none;}

address {font-style: normal;}
/* undoing completed */

#banner h2 {
float: left;
clear: both;
color: #006;
width: 100%;
}

#horiz_nav {
float: left;
clear: both;
width: 100%;
}

#horiz_nav ul {
background-color: #099;
}

#horiz_nav ul li {
display: inline;
}

#school #book {
float: right;
clear: right;
color: #606;
width: 75%;
}

#school #vert_nav {
float: left;
clear: left;
color: #606;
width: 20%;
}

#school #book #rhymes{
float: left;
clear: left;
color: #698;
width: 48%;
}

#school #book #questions{
float: right;
clear: right;
color: #698;
width: 48%;
}

#footer {
float: left;
width: 100%;
clear: both;
text-align: center;
position: relative;
bottom: 0%;
left: 0%;
}
Above is supposed to work independent of browser being used. Anomalies would be there but changing the defaults is easier in CSS structured in this fashion, If one wants to have a close look at the way the boxing is done use the following
################################################

Samplecss.css with boxes


/* undoing browser defaults */
:link,:visited {text-decoration: none;}

ul,ol {list-style: none;}
h1,h2,h3,h4,h5,h6,pre,code,p {font-size: 1em;}

ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {margin: 0; padding: 0;}

a img,:link img,:visited img {border: none;}

address {font-style: normal;}
/* undoing completed */

#banner h2 {
float: left;
clear: both;
color: #006;
border-style: dotted;
width: 100%;
}

#horiz_nav {
float: left;
clear: both;
width: 100%;
border-style: solid;
}

#horiz_nav ul {
background-color: #099;
border-style: solid;
}

#horiz_nav ul li {
border-style: solid;
display: inline;
}

#school #book {
float: right;
clear: right;
color: #606;
border-style: dotted dashed;
width: 75%;
}

#school #vert_nav {
float: left;
clear: left;
color: #606;
border-style: dotted dashed;
width: 20%;
}

#school #book #rhymes{
float: left;
clear: left;
color: #698;
border-style: dashed;
width: 48%;
}

#school #book #questions{
float: right;
clear: right;
color: #698;
border-style: dashed;
width: 48%;
}

#footer {
float: left;
width: 100%;
clear: both;
border-style: solid;
}

Sunday, February 17, 2008

RCP Ideas

Enterprise applications are typically not meant for every one. The users targeted are specialized and knowledgable. The application providers can exploit this aspect and deliver optimized systems for this section of users. Rich UI and client side processing are the exploitable aspects. The problem of connecting client systems to servers is still open. Writing custom socket code or coming up with custom user agents are some solutions. If re-inventing the wheel is not your cup of tea, then the following is for you.

The idea is to use Http unit to communicate with web-apps. Httpunit is developed with the intention of testing webapps on the lines of junit. The interface functionality is tested here. A brief overview of Http unit before we dwell into the facts.
1. The core of http unit is WebConversation, This is equivalent to the application browser window.
2. The requests sent are WebRequests, these carry parameters with them. In webapps, Form submission is one example of request submission.
3. The responses are sent by WebServer, these are WebResponses

WebConversation defines a context within which WebRequests and WebResponses are exchanged. These form a conversational state.

Enough with httpunit, we will look at the possible strategies for RCP UI.

Well designed webapps are typically layered. Presentation layer is the one which feeds the UI. We can retain a simple html based pres layer, without any client validations and build an RCP presentation model on it.

Or, We can do away with the Presentation layer and straight away handle web conversations from the RCP code.

I personally prefer a html layer, It ensures a proper seperation of concerns. Note that this UI need not adhere to the W3C standards. It need not even look visually appealing, (read no complex CSS). No need to bother about client side validations either. (With the advent ot scripting to desktop apps from jdk6, we are seeing new evolutions. We now have new areas like Ajax, flash to add all the gloss).

This being said the problems of managing versions and providing updates to application clients forces new processes to be setup. One of the major benifits that a system provider would get are related to resource usage. If we design for application models on client end, we can save memory and processig speed on server side. Light weight sessions and complex algorithemic computations can be delegate to client. The server would be a data provider and a access provider.

How popular RCP is going to be, only time can tell

Saturday, December 22, 2007

Xbox 360

I bought a xbox 360, never thought that it should be blogged :) I am doing it anyway. The seventh generation of consoles are absolute number crunchers. If any one has worked on a graphics program like adobe photoshop or gimp, they would understand it. Most computers of yester years were good at things like browsing, drafting documents and playing media files. The graphic programers always went for a extra special offering called apple. Any good rendering involves operations that are cpu hungry and memory hungry. Now a days the chasm is being bridged but the divide still exists.

Coming back, the xbox sits like a cute little puppy in the drawing room just beneath the TV. It at time looks melancholic as well. All this changes in a spur of a moment, just switch on the power and insert your favourite game (mine being Gears of war). There is no thunder or lightning, apart from the noise made by the cooling unit. The graphics and visual effects at times dazzle me. I often wonder whose idea was the rocking controller. I have a strong feeling that the 3.2 Ghz 6 core machine will stay with me for a long time.

Jibx with Netbeans

There are times when we face the need to marshall and unmarshall java objects. What better than XML for this! Most programmers can write their own XML parsers and unparsers, why do that when we have a beautiful utility tool. Infact there are several tools. Jibx is one of them, it is offers better performance than many other rivals by using the pull-event mechansim, to top that it is free for use and opensourced. Jibx essentially asks the users to provide a mapping between java objects and xml data. This mapping is provided by users in form of xml file. Lets call it binding xml. Then the users are asked to compile the the project and compile the bindings. The byte code is modified (another reason for the high performance) during this process.

A sample code snippet:
##############################

package ajibx_learning;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.util.ResourceBundle;

import org.jibx.runtime.BindingDirectory;
import org.jibx.runtime.IBindingFactory;
import org.jibx.runtime.IMarshallingContext;
import org.jibx.runtime.IUnmarshallingContext;
import org.jibx.runtime.JiBXException;


public class Main {
/**
* Unmarshal the sample document from a file, then marshal it back out to
* another file.
*/
public static void main(String[] args) {
String ajibxProperties = "ajibx_learning.bizProperties";
String fileInput = "fileOutput";
String fileOutput = "fileInput";
String className = "className";
File fOut = null;
File fIn = null;
Object bean = null;
try {

ResourceBundle rbundle = ResourceBundle.getBundle(ajibxProperties);

fOut = new File(rbundle.getString(fileInput));
fIn = new File(rbundle.getString(fileOutput));
Class c = Class.forName(rbundle.getString(className));
bean = c.newInstance();
} catch (Exception ex) {
ex.printStackTrace();
System.out.print("Exiting ...");
return;
}
System.out.print("Unmarshalling ...");
// unmarshal customer information from file
bean = unMarshall(fIn, bean);
// you can add code here to alter the unmarshalled customer
System.out.print("marshalling ...");
// marshal object back out to file (with nice indentation, as UTF-8)
marshall(bean, fOut);
}

public static Object unMarshall( File fileIn, Object bean){
boolean status = true;
try {
// note that you can use multiple bindings with the same class, in
// which case you need to use the getFactory() call that takes the
// binding name as the first parameter
Class beanClass = bean.getClass();
IBindingFactory bfact = BindingDirectory.getFactory(beanClass);
// unmarshal customer information from file
IUnmarshallingContext uctx = bfact.createUnmarshallingContext();
if(!fileIn.exists()) {
System.out.println("File doesnt' exist: "+fileIn.getAbsoluteFile());
return status=false;
}
FileInputStream in = new FileInputStream(fileIn);
bean = uctx.unmarshalDocument(in, null);
in.close();
} catch(Exception e){
status = false;
e.printStackTrace();
} finally {
if(status)
return bean;
else
return null;
}

}

public static boolean marshall( Object bean, File fileOut){
boolean status = true;
try {
// note that you can use multiple bindings with the same class, in
// which case you need to use the getFactory() call that takes the
// binding name as the first parameter
Class beanClass = bean.getClass();
IBindingFactory bfact = BindingDirectory.getFactory(beanClass);
// marshal object back out to file (with nice indentation, as UTF-8)
IMarshallingContext mctx = bfact.createMarshallingContext();
mctx.setIndent(2);
if(fileOut.exists()){
fileOut.delete();
}
if(fileOut.createNewFile()) {
System.out.println("Creating file: "+fileOut.getAbsoluteFile());
}
else {
System.out.println("Failed to create file: "+fileOut.getAbsoluteFile());
return status=false;
}
FileOutputStream out = new FileOutputStream(fileOut);
mctx.marshalDocument(bean, "UTF-8", null, out);
out.flush();
out.close();
} catch(Exception e) {
status = false;
e.printStackTrace();
} finally {
return status;
}
}
}
###############################

I decided to use the following properties file
#bizProperties.properties
# the input file is the source of xml data
fileInput = D:\\temp\\jibx-gen\\Example1.xml
# the outfile is written by the program
fileOutput = D:\\temp\\jibx-gen\\Gen-Example1_2.xml
# the bean which I intended to use
className = beandef.Person
###############################

I then decided to use the good old 'ant' script to compile this. The issue with ant scripts was that, the code cannt be debugged straight away in IDE. So, I decided to have look at the IDE generated ant script. This itself deserved another posting!!. The expressive power of ant is better illustrated in such examples. The modifications done to build.xml are given below. Note that I was using Netbeans5.5.1
##############################

blah blah of netbeans...
Please replace < with <

<!-- modified for the sake of Jibx bindings -->
<property file="nbproject/buildExample1.properties"/>
<!-- JiBX binding compiler task definition -->

<taskdef name="bind" classname="org.jibx.binding.ant.CompileTask" classpath="${file.reference.jibx-bind.jar}"></taskdef>
<!--
-->
<target name="-post-compile">
<echo message= "${file.reference.jibx-bind.jar}" >
</echo>

<!-- Run JiBX binding compiler -->
<bind verbose="true" load="true" >
<classpath path="${run.classpath}"></classpath>
<bindingfileset dir="${binding.dir}" includes="${binding.filenamepattern}" >
</bindingfileset>
</bind>

</target>
</project>
</quote>
###################################

The modifications are done to the "-post-compile" target. The prefix "-" indicates that this target cannot be called directly. This also uses a "buildExample1.properties" file. The binding information is given this file. The bindings are compiled using this information. In case you are perplexed, the actual information for build is given in build-impl.xml. The build.xml is just a wrapper. Some of the tasks are exposed to the user for allowing customisation and in this case "-post-compile" was choosen.
The contents of buildExample1.properties:
##################################
# The directory containing binding files
binding.dir= D:\\temp\\jibx-gen
# for nested files use **/*binding*.xml, for this example we dont' need it
binding.filenamepattern = *binding*.xml
###################################
The complete code for bean and xml used are also given
##############################
package beandef;

import beandef.Address;

public class Person {
private String name;
private String surname;
private Address address;
/** Creates a new instance of Person */
public Person() {
}

}

package beandef;

public class Address {

private String houseno, street1, street2;
/** Creates a new instance of Address */
public Address() {
}

}
##################################
A good source for learning jibx is http://jibx.sourceforge.net/tutorial/binding-tutorial.html. The above mechanism shows how we can debug projects using netbeans even when there is a need for custom ant tasks.

Popular Posts

Labels

About Me

Well for a start, I dont' want to!. Yes I am reclusive, no I am not secretive; Candid? Yes; Aspergers? No :). My friends call me an enthusiast, my boss calls me purist, I call myself an explorer, to summarise; just an inquisitive child who didnt'learn to take things for granted. For the sake of living, I work as a S/W engineer. If you dont' know what it means, turn back right now.