Flex panel with Maximize, Restore capability

var addthis_pub = ‘prosenjit23′;

Recently I have been working with Adobe Flex 3 for a project of mine. Flex offers a lot of UI components out-of-the-box that can be used as is. One of them is the Panel control. The Panel is essentially a container to house other components like data grids, etc. Panels are useful when creating dashboard applications. Unfortunately Flex does not offer inbuilt maximize or restore functions on the Panel controls. Rather it is left to the developers to devise their own  mechanisms. Long story short, I had a need for it and Flex did not offer it. And so I started scouring the net for samples. There were loads of good ones but their implementations were much too complicated for my needs. Reluctantly I started working on my own prototype.

<pre style="text-align:justify;"><?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
	width="598" height="620">
	<mx:Script>
		<![CDATA[
			import mx.core.UIComponent;
			import mx.managers.SystemManager;
			import mx.controls.Alert;
			import mx.collections.ArrayCollection;
			import mx.managers.PopUpManager;
			import mx.containers.TitleWindow;
			import mx.core.IFlexDisplayObject;
			import mx.containers.Panel;

			// Button constants
			private static const _RESTORE_LABEL_:String = "Restore";
			private static const _MAXIMIZE_LABEL_:String = "Maximize";

			[Bindable]
			private var currWidth:int; // Stores the current width of the panel to be resized
			[Bindable]
			private var currHeight:int; // Stores the current height of the panel to be resized
			[Bindable]
			private var currTop:int; // Stores the current y coordinate of the panel to be resized
			[Bindable]
			private var currLeft:int; // Stores the current x coordinate of the panel to be resized
			[Bindable]
			private var isMaximized:Boolean = false; // Stores the current state of the panel as a boolean
			[Bindable]
			private var currIndex:int; // Stores the current index of the panel to be maximized

			/**
			 * This function orchestrates what method
			 * is called on the button click event depending on
			 * its label value.
			 */
			private function maxRestore(thePanel:Panel, minRestorBtn:Button):void
			{
				if(minRestorBtn.label == _RESTORE_LABEL_)
					restore(thePanel, minRestorBtn);
				else if(minRestorBtn.label == _MAXIMIZE_LABEL_)
					maximize(thePanel, minRestorBtn);
			}

			/**
			 * This method maximizes the specified panel to occupy the
			 * whole displayed screen area. This method can be tuned to
			 * occupy the area of its parent component rather than the parent
			 * application.
			 */
			private function maximize(thePanel:Panel, minRestorBtn:Button):void
			{
				if(!isMaximized)
				{
					// Save previous position info
					currWidth = thePanel.width;
					currHeight = thePanel.height;
					currTop = thePanel.y;
					currLeft = thePanel.x;
					currIndex = thePanel.parentApplication.getChildIndex(thePanel);

					// Set the maximized flag to true
					isMaximized = true;

					// Set current info
					thePanel.width=this.width;
					thePanel.height = this.height;
					thePanel.x = 0;
					thePanel.y = 0;

					var parentApp:UIComponent = thePanel.parentApplication as UIComponent;
					parentApp.removeChildAt(currIndex);
					parentApp.addChild(thePanel);

					// Set the button properties
					minRestorBtn.label = _RESTORE_LABEL_;
				}
			}

			/**
			 * This method restores the panel to its original location
			 * and size on the screen.
			 */
			private function restore(thePanel:Panel,minRestorBtn:Button):void
			{
				if(isMaximized)
				{
					var parentApp:UIComponent = thePanel.parentApplication as UIComponent;
					// Set the maximized flag to false
					isMaximized = false;

					// Set the button properties
					minRestorBtn.label = _MAXIMIZE_LABEL_;

					// Restore the original size and location information
					thePanel.width = currWidth;
					thePanel.height = currHeight;
					thePanel.x = currLeft;
					thePanel.y = currTop;

					// Now relocate the panel to its original position
					// in the child stack.
					parentApp.setChildIndex(thePanel,currIndex);
				}
			}
		]]>
	</mx:Script>

    <mx:Resize id="resize" /> <!-- This helps in the resize effect -->
    <mx:Move id="moveEffect" /> <!-- This helps in the move effect -->

	<mx:Panel id="upperPanel" x="47.5" y="35" width="500" height="142" layout="absolute"
		resizeEffect="{resize}"
		moveEffect="{moveEffect}" backgroundAlpha="1.0"
		borderAlpha="1.0" title="Top Panel">
		<mx:TextInput x="136" y="19"/>
		<mx:Button x="304" y="19" label="Button"/>
		<mx:ControlBar width="100%" alpha="1.0">
            <mx:Spacer width="100%" alpha="1.0"/>
            <mx:Button id="upperPanelMaxBtn" label="{_MAXIMIZE_LABEL_}" click="maxRestore(upperPanel, upperPanelMaxBtn)"/>
        </mx:ControlBar>
	</mx:Panel>
	<!-- This panel has the capability to maximize and restore -->
	<mx:Panel id="maxminPanel" name="maxminPanel" x="47.5" y="195" width="500" height="184"
		layout="absolute" resizeEffect="{resize}"
		moveEffect="{moveEffect}" backgroundAlpha="1.0"
		borderAlpha="1.0">
		 <mx:title>Middle Panel</mx:title>
		 <mx:DataGrid top="10" right="10" bottom="10" left="10">
		 	 <mx:columns>
		 	 	 <mx:DataGridColumn headerText="Column 1" dataField="col1"/>
		 	 	 <mx:DataGridColumn headerText="Column 2" dataField="col2"/>
		 	 	 <mx:DataGridColumn headerText="Column 3" dataField="col3"/>
		 	 </mx:columns>
		 </mx:DataGrid>
		 <mx:ControlBar width="100%" alpha="1.0">
            <mx:Spacer width="100%" alpha="1.0"/>
            <mx:Button id="maxminPanelMaxBtn" label="{_MAXIMIZE_LABEL_}" click="maxRestore(maxminPanel, maxminPanelMaxBtn)"/>
        </mx:ControlBar>
	</mx:Panel>
	<mx:Panel id="lowerPanel" x="47.5" y="403" width="500" height="197" layout="absolute"
		resizeEffect="{resize}"
		moveEffect="{moveEffect}" backgroundAlpha="1.0"
		borderAlpha="1.0" title="Bottom Panel">
		<mx:TextInput x="104" y="35"/>
		<mx:ControlBar width="100%" alpha="1.0">
            <mx:Spacer width="100%" alpha="1.0"/>
            <mx:Button id="lowerPanelMaxBtn" label="{_MAXIMIZE_LABEL_}" click="maxRestore(lowerPanel, lowerPanelMaxBtn)"/>
        </mx:ControlBar>
	</mx:Panel>
</mx:Application></pre>

This is, like I said, just a prototype. The MXML file contains a couple of methods that take in the Panel controls as parameters and work their magic. For production use, I would surely extend the Panel control to create a custom one and wire it up with the necessary behavior. I would have loved to upload my SWF file to this blog but unfortunately WordPress does not permit that (for some ridiculous reason).

The moment a UI library offers widgets like panels and windows it becomes quite obvious that people would want to have minimize, maximize, restore and resize capabilities on them (and no the resize and move effects do not help much since they do not manipulate the z-ordering of components).Unfortunately Adobe does not think it is necessary. Personally I think the guys at Adobe are being extremely lazy about this. Of course there is always an excuse of being busy doing bigger and better things. Well so much for making lives easier for developers.

var addthis_pub = ‘prosenjit23′;

Business rules: The good and the bad

Couple of weeks back I attended a conference on business rules. Needless to say there were technologies on display that were brilliant to say the least.

There were presentations by some of the most well known people in the business rules community. Personally I found Professor Simchi-Levi and Steve Demuth’s presentations quite brilliant. Both of them emphasized on the need of using optimization tools alongwith business rules to make a business more agile. And I totally agree with them. Agility is of utmost importance in today’s world and it should be considered by each and every business.

Professor Jan Vanthienen’s presentation on decision tables was simply brilliant. He was lucid in his explanations and easily got across to people, some of whom did not have much experience in business rules. Sun Microsystem’s presentation on how they used a rules based strategy for risk mitigation was also very interesting. 

The ones I mentioned above were the ones that I found particularly interesting. But all the presentations had to offer some pearls of wisdom.

And of course, there were some fantastic products on display. The big ones like Ilog and Fair Isaac’s Blaze Advisor displayed their latest versions that offered many advanced features. Also there were some smaller players like Delta-[R] and InRule whose products were also equally interesting. Open source was represented by JBoss Drools and Open Rules. Needless to say, the guys at Drools and Open Rules have quite compelling propositions. Open Rules for instance allows business rules to be specified in spreadsheets and have application code evaluted against these spreadsheets!!! Quite a novel way of thinking and doing things. Spreadsheets are, after all, the most popular tool amongst business users.

A common drawback of all the systems was the lack of migration capabilities. For instance if you are running Ilog and want to switch to Open Rules, there isn’t any easy migration paths available. Most of the vendors did offer to do the migrations for me but none had a software solution. The question is why? And the answers seems to be lying in the lack of standards in business rules.

Till now every rules engine vendor has its own proprietary way of handlling rules. There are no standards for this. The Object Management Group (OMG) is currently working on a specification for business rules. This is called Semantics of Business Vocabulary and Business Rules or SBVR. SBVR seems to be a step in the right direction but it is still far away from being accepted as the standard by all the vendors. 

Quite a few people are of the opinion that standards would hurt the profitability of the rules engine vendors. I think its actually the opposite. Standards always give the users a certain peace of mind when using technology products. Take for instance the Java Enterprise Edition platform or JEE. JEE is essentially a specification and different vendors like Red Hat, Oracle and IBM offer servers that are compliant with this specification. Are these companies any less profitable? The benefit of standards far surpasses the disadvantages. A standards based approach is always more attractive to users since they can choose to move on to a different product in future. This flexibility, even though not commonly exercised, is very important. 

Business rules should adopt the path taken by JEE and have a community driven process to develop standards and also coax vendors to make their products compliant. The vendors, on their part, can offer added features and services that can make the life of a user easier. That’s what would determine which product is better than the others. For now, due to the lack of standards, an apples-to-apples comparison of different rules products is difficult.

Business rules are used by some of the largest companies in their mission critical applications. The potential that business rules has is huge. However, to live up to its full potential, business rules needs to have standards and they need those standards soon.