Install ibrowser

http://seoroot.com/blog/computing/programming/tinymce-ibrowser-plugin.html

Ever wanting to have an interface to manage your images in TinyMCE editor? Then this could be what you were looking for, the iBrowser plugin. iBrowser allows you to manage your image files via web browser (so far i have it tested only on IE and Firefox browsers, but other browser should work well). It will enable you to do the following.

• Create directories
• Upload, rename and delete images
• Change image attributes such as image size and orientation

Requirements

PHP 4.x/5.x compiled with GD library support (how to install GD with php coming soon).

Installing iBrowser on TinyMCE WYSIWSYG editor

• Download the iBrowser package and decompress it in your tinyMCE plugins directory/tiny_mce/plugins/ibrowser
• Inside the ibrowser/config directory, open config.inc.php and change the following to reflect to your setup

$cfg['ilibs'] = array ( // image library path with slashes; absolute to root directory - please make sure that the directories have write permissions
array (
'value' => '/path/to/your/wwwroot/images/',
'text' => 'Site Pictures',
),
array (
'value' => '/path/to/your/wwwroot/gallery/',
'text' => 'Gallery',
),
);

• Copy the tinyMCE.editor_plugin.js (you can find it under ibrowser/interface) and rename it to editor_plugin.js. Then copy and paste editor_plugin.js to editor_plugin_src.js ( you should have both the editor_plugin.js and editor_plugin_src.js files)
• Change directory permissions of the following directories to 755 or 777. ibrowser/temp and ibrowser/scripts/phpThumb/cache (only for unix/linux systems)
• In your tinyMCE initialization line (tinyMCE.init), look for the plugins line then add “ibrowser” (without quotes). Then look for the “theme_advanced_buttons(N)” and add “ibrowser”. see example below:

tinyMCE.init({
mode: "exact",
elements: "template_content",
theme: "advanced",
plugins : "aibrowser",
theme_advanced_buttons2 : "ibrowser"
});

If everything works fine, you should be able to click the  icon and a popup window will appear.

To upload an image click on the  icon to display the browse/file upload field.

Troubleshooting

TinyMCE

http://www.tinymce.com/wiki.php/Installation

Creating Read and Write Methods with IBinarySerialize

When you choose UserDefined serialization format, you also must implement the IBinarySerialize interface and create your own Read and Write methods. The following procedures from the Currency UDT use the System.IO.BinaryReader and System.IO.BinaryWriter to read from and write to the UDT

// IBinarySerialize methods
// The binary layout is as follow:
//    Bytes 0 - 19:Culture name, padded to the right 
//    with null characters, UTF-16 encoded
//    Bytes 20+:Decimal value of money
// If the culture name is empty, the currency is null.
public void Write(System.IO.BinaryWriter w)
{
    if (this.IsNull)
    {
        w.Write(nullMarker);
        w.Write((decimal)0);
        return;
    }

    if (cultureName.Length > cultureNameMaxSize)
    {
        throw new ApplicationException(string.Format(
            CultureInfo.InvariantCulture, 
            "{0} is an invalid culture name for currency as it is too long.", 
            cultureNameMaxSize));
    }

    String paddedName = cultureName.PadRight(cultureNameMaxSize, '\0');
    for (int i = 0; i < cultureNameMaxSize; i++)
    {
        w.Write(paddedName[i]);
    }

    // Normalize decimal value to two places
    currencyValue = Decimal.Floor(currencyValue * 100) / 100;
    w.Write(currencyValue);
}
public void Read(System.IO.BinaryReader r)
{
    char[] name = r.ReadChars(cultureNameMaxSize);
    int stringEnd = Array.IndexOf(name, '\0');

    if (stringEnd == 0)
    {
        cultureName = null;
        return;
    }

    cultureName = new String(name, 0, stringEnd);
    currencyValue = r.ReadDecimal();
}