MindFusion diagramming Part 2 - adding shapes list

In the previous example, I show you how to add simple diagram to your web forms. Now I am going to show you how to add a simple shapes list, containing all the shapes that comes with the MindFusion product.

It is very simple, actually, only 1-2 lines of markup:

<ndiag:ShapeListBox ID="shapeList" runat="server" Style="left: 810px; width: 160px; position: absolute; top: 1px; height: 320px; background-color: white" />

This should be added to the code you built in the previous example : http://donchevp.blogspot.com/2009/04/mindfusion-diagramming-part-1-adding.html.

Let's see what we got now:

MindFusion diagramming Part 1 - adding simple diagram to the form.

We worked quite a bit with this product and I must say it is a good one.
It can be used to easilly draw diagrams. It has a lot of built-in shapes and a designer to draw new one.
Let's add a digaram on the form.
First of all, download the product from here : http://mindfusion.eu/download-netdiagram.html and install them.
Add the following lines to your web.config:

In page / controls section, add the following:
<add tagPrefix="ndiag" namespace="MindFusion.Diagramming.WebForms" assembly="MindFusion.Diagramming.WebForms"/>

Then add reference to :
MindFusion.Common
MindFusion.Diagramming
MindFusion.Diagramming.WebForms

Open your page and add the following markup to create a diagram:

<ndiag:DiagramView ID="diagramView" runat="server" Style="left: 0px; width: 800px;
position: absolute; top: 0px; height: 505px" Behavior="DrawControls" BackColor="White" AllowInplaceEdit="true" />

I added few additional properties to decorate and set behaviours. We will discuss them later. I also allowed InplaceEdit, which means that when you double click on a shape, you will be able to edit the text.
Finally, copy the JDiagram.jar into your root directory (you can place it in a directory of your choice, but you will need to set the JarLocation property to point to this file.

Let's see what we did so far:





Pretty nice for 1 minute of work, huh?
There is more ;). This product seems to come from Bulgaria, so there will be no problem with it :).

Make telerik controls work with IE 8

A friend of mine told me she has problems running telerik controls under Internet Explorer 8. I recalled reading somewhere there is a tag you need to add to your page in order to force IE 8 behave like IE 7 (where telerik controls work great), I did some search and here is the tag:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

Add it to your pages head section and you should be ok with telerik controls.

Edit: as Veskoni commented out, telerik controls are fully compaitable with IE 8 since Q1 2009 SP1, so it will be a lot better to upgrade to that version (or above).

Using JavaScript functions over a string in C#.

I needed to find a way to invoke the real escape / unescape javascript function over a string in C#.
It appeared to be easy to do so by using the Microsoft.JScript namespace classes.

Add a reference to it and then you can simply do something like this:

string escaped = Microsoft.JScript.GlobalObject.escape("This will be JS escaped for sure!");

"escaped" variable will then have the value of :

This%20will%20be%20JS%20escaped%20for%20sure%21

I am still very new to this namespace, there were a lot of things to find out there ...

Check it out. It may appear to be very useful for those of you who are processing JS on-the-fly...

ASP.NET PRO readers choice awards

You can vote for ASP.NET readers choice awards here:

http://www.aspnetpro.com/awards/default.asp

give a hand to your favorite components, controls, utilities, editors and so on!

Nice UML Diagram

Here is a very nice and informative UML diagram I created while I was bored ;)






Just kidding :)

Removing the left "placeholders" in telerik radMenu (where the images should be)

I needed to remove this placeholder as our menu was without icons. First I thought it is impossible, but then I found very helpful thread in telerik forums.
It says you need to apply the following CSS to your form:

.RadMenu_[SkinName] .rmGroup .rmLink
{  
   padding-left: 0px !important;  
}  
    
.RadMenu_[SkinName] .rmGroup .rmLink .rmText
{
   padding-left: 5px !important;  
}  
.RadMenu_[SkinName] .rmGroup
{
   border: 1px solid #979797 !important;  
   background: #f0f0f0 !important;
}

Where [SkinName] stands for the skin of the menu.


By the way - it happens this to be my post #100! ;). Hope I helped someone with all my posts :).

Read various elements from the connection string.

I saw a question in ASP.NET forums. There was a guy asking how to extract the Username and Password from a connection string, stored in the web.config.

I recalled doing something like this but was not able to recall which class I used.

After about a day another guy posted an answer on this question - the class was SqlConnectionStringBuilder. You can use this class to easilly manage SqlConnection string properties such as DataSource, Username, Password etc.

Here is my post on how to get a connection string from the web.config:
Read connection string from web.config

Here is some more info about SqlConnectionStringBuilder from MSDN:
SqlConnectionStringBuilder class

Combining both resources will help you manage your connection strings easilly.

Read the connection string from the web.config file

Here is this code, it is replicated bilions of time in Internet, yet I fill obliged to paste it here...

This is the first way, which I took from Microsoft.
It checks if there is a connection strings section, then it checks if the count of connection strings is more than zero:

        System.Configuration.Configuration rootWebConfig = System.Web.Configuration.WebConfigurationManager.OpenWebConfiguration("/MyWebSiteRoot");
        System.Configuration.ConnectionStringSettings connString;
        if (0 < rootWebConfig.ConnectionStrings.ConnectionStrings.Count)
        {
           connString =
             rootWebConfig.ConnectionStrings.ConnectionStrings["MyConnectionString"];
           if (null != connString)
           {
             // Do something with the string, for example - create SqlConnection object:
             SqlConnection con = new SqlConnection(rootWebConfig.ConnectionStrings.ConnectionStrings["MyConnectionString"].ConnectionString);
           }
        }


This one is the short line (no checks if anything fails, after all if you don't have a connection string in 99% of the scenarios you will want to have exception rised).

string cString = System.Web.Configuration.WebConfigurationManager.ConnectionStrings["mine"].ConnectionString;

Fixing sup - sub for radEditor example

I made few posts on telerik radEdit. There was something I considered a small issue. Which actually may appear not to be issue, but to me it was.
So i decided to get a bit more familiar with the telerik radEdit client side scripting API (thanks to Tervel for his valuable comments).
So the problem for me was that if you type normal text, then click on the sub icon to make index and then click on the sup to raise to the power of something, the result was a text on the same level as the normal text.

Digging a bit in the client API of radEdit I found that you can obtain the editor undo manager. You can also fire commands so the problem should be easy to fix (I should mention here that I am really happy with the architecture of radEditor, it has everything a developer may need in order to extend the control to fit his / her needs.

Ok, now to the problem. I thought all I need to do is to make radEdit check if a sup is selected when you click sub and switch it off if so. Same thing should happen for sub. Luckily radEdit has client side event handler OnClientCommandExecuting which is rised prior command execution. So you will need an event handler like this:

OnClientCommandExecuting="cmdPreExec"

Having the eventhandler attached, you need to write a function to check if the user clicks either sup or sub. Then to check if the other command was recently fired, if so - it will fire it again to switch it off. Here are the functions:

     function cmdPreExec(editor, args) {
        var strCommand = getLastCommandReal(editor);
        if (strCommand) {
           cmd = args.get_commandName();
           if (cmd == "Superscript") {
             if (strCommand == "Subscript") {
                editor.fire("Subscript");
             }
           }
           if (cmd == "Subscript") {
             if (strCommand == "Superscript") {
                editor.fire("Superscript");
             }
           }
        }
     }

     function getLastCommandReal(editor) {
        var manager = editor.get_commandsManager();
        var commands = manager.get_commands();
        var lastCommand = null;
        
        if (!commands) {
           return null;
        }
        else {
           for (i = commands.length - 1; i > -1; i--) {
             if (!commands[i]) {
                return null;
             }
             if (commands[i]._title != "Typing...") {
                return commands[i]._title;
             }
           }
        }
     }

The second function is to get the last command name from the undo manager, excluding the "Typing..." which is also registered there.
Please note that I see some potential problems which I haven't considered yet, you may have some side effects.
This post is more to show you how to work with some of the client side objects / events and methods than to use in real life.

Actually I am 99.99999 % sure there will be a problem with this code ;). This code was written in abouth 15 - 20 minutes so there should be a bug for sure. I can think of at least two bugs ;).

Here is a video on how this code performs for me:

tinyMCE has the sup - sub issue too

Just to inform you that tinyMCE cannot handle the sup / sub correctly also.

Here is a video:

Telerik radEditor, it is not a bug... but wait ...

Okay, yesterday I wrote a small post showing a small malfunction in telerik radEditor.

The problem was using Sub - Sup...

I got a comment from Tervel - a guy who works on the editor.

As the comment is in Bulgarian I will add a free translation in english (I will ommit hi, pavel and so on and will translate only the things that have relation to this post).

"The way you are changing the commands, it seems to me that the problem is in the browser RichText edit engine.
Sup and Sub commands are sent from telerik radEditor to the browser for further processing." (I think there was something like execCommand("commandName") in JavaScript, this is what he is talking about.

"You can check other editors to verify this behaviour. Strictly, I don't think this is a bug, IE does include sup / sub tags in the context of the current tag, not as a parrent element of the current tag. The result is logical and correct. Whether this is intuitive behavior is another question offcourse. By the way, I think it is."

So here is what I think:
I think that Tervel is right - this is the behavior of IE. And the behavior of FireFox. I checked it too. And this is not a bug.
Yes it is not very intuitive.
Yes it takes another click.

But to me this behavior can be fixed in Telerik making their editor even more intuitive and easy to use.
I don't see any situation in which one would like to have both : sup and sub tags selected. Why would we do that?

Here is what I think can be done in the editor, if someday the guys have some spare time:

Click on sup scnario:
1. Check if the sub command is added (probably it will be but just check for sure).
2. If yes - unselect it.

Same can happen for sub.

Here is a video in which I am trying to input formula with two variables:



And last but not least - this is not an issue for the editor. I just wanted to share my opinion as Tervel left comment.

And once again - we love radEdit ;).

Small bug in telerik radEditor

This one I found while I was playing with the telerik radEditor:



I don't think it is a big deal. You can live with it. Still I consider telerik radEditor one of the best web editors available.

Microsoft SQL Management Studio - Saving changes is not permitted error message.

If you are using Microsoft SQL Management Studio 2008 you may have across this message while trying to edit a table in database:

Saving changes is not permitted. The changes you have made require the following tables to be dropped and re-created. You have either made changes to a table that can't be re-created or enabled the option Prevent saving changes that require the table to be re-created.



It is so self exlpanatory still a lot of people have problems to solve it.



You can follow the steps bellow to fix this:

Select "Options" from the Tools menu:



Then Uncheck the "Prevent saving changes that require table re-creation" option and click OK:

MCTS : Windows applications achieved today!

I got this badge officially today:



I am already entitled as a MCPD: Web Applicaionts but I wanted to achieve the MCPD : Enterprise Developer also so I needed to pass the windows thing.
In order to get there I only need to pass one more exam - the Distributed Applications exam.
Wish me luck!

Test images

Few pictures ...

Your site suddenly stops to save cookies?

I am currently developing an application. One of the requirements is the user to be able to change the language. I added a dropdown to hold the languages. Upon change a cookie is sent to the client with the language selected so when the user visits the site next time his / her language can be auto adjusted. It worked as a charm until today.

It suddenly stopped. I was wondering who to blame, when I saw a small baloon tooltip on the taskbar. It said I am running out of disk space ;).
I deleted my cookies in IE and everything started working correctly again.

(I just wonder if the disk space was the reason why under Firefox worked fine?)

Telerik RadSkinManager doesn't persist the Skin.

If you programatically change the Telerik RadSkinManager Skin property it won't get persisted in the key you added.
This is because probably in telerik asumed if there is no skin chooser the skins won't change and will be loaded from the markup. It is not a bad decision.
However, you may find yourself in need to programatically change the skin and want it persisted.
To do the things tidy I did a small code to persist the skin where it should be persisted.
Here is the code:
        switch (rsMgr.PersistenceMode)
        {
           case RadSkinManagerPersistenceMode.Cookie:
             // Create a cookie to persist the skin selection for the session only:
             HttpCookie cookieSkin = new HttpCookie(rsMgr.PersistenceKey, rsMgr.Skin);
             Response.Cookies.Add(cookieSkin);
             break;
           case RadSkinManagerPersistenceMode.Session:
             // Create a session variable with the same name:
             Session[rsMgr.PersistenceKey] = rsMgr.Skin;
             break;
           case RadSkinManagerPersistenceMode.ViewState:
             // View state variable:
             ViewState[rsMgr.PersistenceKey] = rsMgr.Skin;
             break;
        }

where rsMgr is RadSkinManager.
Now you may paste this code in a method and call this method after you programatically assign skin to the manager. I needed this because I wanted to allow the user to change from some of the skins (not all of them) I couldn't find a way to only hide few skins and display others so I can use the standard functionality of the SkinChooser proerty so I added my own RadCombobox with the skins I want displayed.

Hope this helps someone out there...

Nice little tool to help me with twitter.

I created a small twitter software what it does is to check each hour if I am listening to Winamp, get the song if possible and write it in twitter for me and the people who are eventually interested in what I am listening.
Here is the deal:



You can download it from here:
TWamp - Nice little twitter software

You can follow me on twitter from the following url:
My twitter profile

Please note: TWamp isn't very user friendly. You need to get along with it in order to use it ;).