eCoolSoft had kept focusing on MFC for the development of Windows GUI for a while. eCoolSoft had changed its mind to focus on ASP.NET and DHTML for the web client GUI development.
This is mainly because the controls in ASP.NET are server side controls, and they don't have the same capability as the Windows GUI on the browser.
After eCoolSoft made a search, eCoolSoft found that the combination of ASP.NET and DHTML is the best choice to develop client side ASP.NET components.
eCoolWebPanelBar now supports the collection properties of both
Items in VS.NET properties box. This means that you can define
eCoolWebPanelBar properties from both XML file and the properties of VS.NET IDE.
Also, version 188.8.131.52 supports the bold or non-bold font to the letter of the menu head and adding the left image of the menu head.
This demo consists of three files called eCoolWebPanelBar.dll, MenuRef.xml and WebPanelBarScript.js.
- MenuRef.xml is an XML file to fulfill the properties of the menu head and menu item of
eCoolWebPanelBar to shrink and expand the panel actually.
- eCoolWebPanelBar.dll is the custom control created by ASP.NET.
SPAN tag if we use his code with ASP.NET control. This is mainly because ASP.NET creates
OnClick event to the
Label control, for example.
To solve this bug, eCoolSoft adds the array object declared
realMenuObj defined by
SPAN ID named
x represents the number.
X (count) is generated by
Render function through the number of Menu Head defined by MenuRef.xml.
After this, only
realMenuObj is considered to process to shrink or expand the menu item.
for (var i = 0; i < objSpanCollection.length; i++)
var objSpan = objSpanCollection(i);
if(objSpan.id .indexOf("ecool") != -1)
realMenuObj[nCount] = objSpan;
menuHeightCollection[nCount] = objSpan.childNodes.item(1).clientHeight;
realMenuObj[nCount].childNodes.item(0).onclick = ControlMenu;
if(nCount != 0) realMenuObj[nCount].childNodes.item(1).style.display = "none";
eCoolWebPanelBar.dll is almost same structure as Mr. yanhao's code after eCoolSoft confirms that the raw HTML code shows Outlook style bar.
Render function has the same HTML code in
HtmlTextWriter to make loops by Group and Item count by MenuRef.xml.
This time, eCoolSoft can't provide the source code of eCoolWebPanelBar.dll mainly because eCoolSoft fails to create the different versions of code. This seems to be very frustrating to keep developing the new version with the same
TagPrefix of the custom control.
eCoolSoft gets the error message saying that
eCool:Goup is defined at multiple places in same directory. As a result, eCoolSoft keeps working with the same project of
eCoolWebPanelBar. This means that eCoolSoft doesn't have the same code of this eCoolWebPanelBar.dll any more.
eCoolSoft tries to support the collections property at design time. MS Press Book - Developing Microsoft ASP.NET Server Controls and Components gives eCoolSoft many hints to solve the collection property at design time.
However, this book uses
IList base class, and then eCoolSoft must write the code by
CollectionBase class approach. This solution is shown in a later paragraph.
How to work CollectionBase class in eCoolWebPanleBar
Before eCoolSoft makes
CollectionBase class work to the collection properties, eCoolSoft tries to find the sample code for this. However, eCoolSoft never finds any good article about this. One sample has the code for tab collection control, but tab actually has its object because tab control object is created at the other place.
That is, at
eCoolWebPanelBar has the following relationship.
Groups object is the collection of
Group object is the parent of
Items object is the collection of
Item are not GUI objects, so we have to take care of the creation of these objects by ourselves.
- How to relate
CollectionBase class object to collection property at design time?
public class Groups : System.Collections.CollectionBase, IStateManager
public class Items : System.Collections.CollectionBase
After we declare
Items class, we need define
GroupsEditor class derived from
public class GroupsEditor : CollectionEditor
public GroupsEditor(Type type) : base(type)
protected override Type CreateNewItemTypes()
Type types = new Type
After this, we must map
GroupEditor class to
Groups class for the design editor to understand the relationship between these.
So, last issue is how we make the design editor know the parent and child relationship between
public class Group : IStateManager
Without the above code, eCoolSoft gets the error message saying that
eCool:Items is not defined ...
Another issue is that eCoolSoft has to face the conflict between XML format and the design editor format. That is, if we add the new group to
eCoolWebPanelBar by the design box, the duplication happens, and then one more
Item are created. To solve this issue, eCoolSoft changes the location to load the data from XML file in
OnRender(...) function. Before, this happened in constructor in
As a result, we can now define the data from both XML file and the design tool.
How to use eCoolWebPanelBar
- Put MenuRef.xml to C:\Inetpub\wwwroot\aspnet_client\eCoolSoft\MenuRef.xml.
- Put WebPanelBarScript.js to /aspnet_client/eCoolSoft/, and / represents the virtual directory putting your .aspx file with eCoolWebPanelBar.dll.
- Put eCoolWebPanelBar.dll to the bin directory of the root or the virtual directory with your aspx file.
eCoolWebPanelBar to Toolbox of VS .NET by clicking the right mouse button on the panel which you want to add in, selecting "Customize Toolbox" and choosing eCool.WebPanelBar.dll after browsing the file in .NET tab selection.
- Drag and drop
eCoolWebPanelBar to WebForm.
//This is the content of MenuRef.xml.
<menudata> <menuhead id="Product" caption="OutLook" imageurl="./images/up.gif">
<menuitem id="item10" caption="Today"
url="www.ecoolsoft.com/products.aspx" imageurl="./images/Today.gif" />
<menuitem id="item11" caption="Calendar"
url="www.ecoolsoft.com/product_2.aspx" imageurl="./images/Calendar.gif" />
<menuitem id="item12" caption="Inbox"
url="www.ecoolsoft.com/product_3.aspx" imageurl="./images/Inbox.gif" />
//eCoolWebPanelBar doesn't support target of html tag of URL yet.
You can modify MenuRef.xml to point to a different image file, caption and URL as long as you keep the same format.
eCoolWebPanelBar works only with IE5.5 and its later versions.
- Don't modify
Item properties in IDE design box. If you modify these,
eCoolWebPanelBar doesn't work.
eCoolWebPabelBar shows, we see that the panels except the first one shrink
eCoolWebPanelBar doesn't work for
Group and It
em collection properties of design box yet.
Currently, eCoolSoft is working to fix these bugs except Netscape and IE5.0 support.
Future Issue [184.108.40.206]
eCoolSoft focuses on the following issue to protect ASP.NET against the decompiler.
- XML file should be loaded from resx file ?
- DHTML code should be loaded from XML format to XSLT?
eCoolSoft notices that several competitors use this kind of approaches to protect their intellectual rights. Furthermore, XSLT expands the capability of XML file for the reusable code.