<%@ Control Language="C#" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI.Editor" TagPrefix="tools" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI.Widgets" TagPrefix="widgets" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI.Dialogs" TagPrefix="dialogs" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<dialogs:UserControlResources id="dialogResources" runat="server" />

<script type="text/javascript">
Type.registerNamespace("Telerik.Web.UI.Widgets");

Telerik.Web.UI.Widgets.MediaPreviewer = function(element)
{
	Telerik.Web.UI.Widgets.MediaPreviewer.initializeBase(this, [element]);
	this._currentItem = null;
	this._currentMediaItem = null;	
	this._properties = null;
	
	this._toolbar = null;
	this._toolbarClickDelegate = null;
	
	this._mediaPropertiesPane = null;
	this._mediaPreviewPane = null;
	
	this._classIdCheckBox = null; 
	this._classIDText = null;
	this._classIDLi = null;
	this._mediaWidth = null;
	this._mediaHeight = null;
	this._mediaAlign = null;
	this._mediaProperties = null;
	this._propertyValuePane = null;
	this._propertyValueDescription = null;
	this._propertyElementsWithHandlers = new Array();
	
	this._localization = {
	    Description : "Description: ",
		AllowChangeDisplaySize : "This property specifies or retrieves a value indicating whether the display size can be changed.",
		AllowScan : "This property specifies or retrieves a value indicating whether scanning is enabled for files that support scanning (fast-forwarding and rewinding).",
		AnimationAtStart : "This property specifies or retrieves a value indicating whether animation runs before the first image displays.",
		AudioStream : "This property specifies or retrieves the stream number of the current audio stream.",
		AutoRewind : "This property specifies or retrieves a value indicating whether the Windows Media Player control automatically returns to the clip's starting point after the clip finishes playing or has otherwise stopped.",
		AutoSize : "This property specifies or retrieves a value indicating whether the Windows Media Player control automatically resizes to accommodate the current media item at the size specified by the DisplaySize property.",
		AutoStart : "This property specifies or retrieves a value indicating whether to start playing the clip automatically.",
		Balance : "This property specifies or retrieves a value indicating the stereo balance.",
		CCActive : "This property specifies or retrieves a value indicating whether closed captioning is on or off.",
		ClickToPlay : "This property specifies or retrieves a value indicating whether the user can toggle playback on and off by clicking the video image.",
		ColorKey : "This property specifies or retrieves the color key being used by the DVD playback.",
		CurrentAngle : "This property specifies or retrieves a number identifying the current camera angle.",
		CurrentAudioStream : "This property specifies or retrieves a value indicating the current audio stream.",
		CurrentCCService : "This property specifies or retrieves a value indicating the current closed captioning service.",
		CurrentMarker : "This property specifies or retrieves the current marker number.",
		CurrentPosition : "This property specifies or retrieves the clip's current position, in seconds.",
		CurrentSubpictureStream : "This property specifies or retrieves a value indicating the current subpicture stream.",
		CursorType : "This property specifies or retrieves a value indicating the current subpicture stream.",
		DefaultFrame : "This property specifies or retrieves a value representing the default target HTTP frame.",
		DisplayBackColor : "This property specifies or retrieves the background color of the display panel.",
		DisplayForeColor : "This property specifies or retrieves the foreground color of the display panel.",
		DisplayMode : "This property specifies or retrieves a value indicating whether the status bar displays the current position in seconds (Yes) or frames (No).",
		DisplaySize : "This property specifies or retrieves the size of the image display window.",
		EnableContextMenu : "This property specifies or retrieves a value indicating whether the context menu appears when the user clicks the right mouse button.",
		Enabled : "This property specifies or retrieves a value indicating whether the Windows Media Player control is enabled.",
		EnableFullScreenControls : "This property specifies or retrieves a value indicating whether Windows Media Player displays controls in full-screen mode.",
		EnablePositionControls : "This property specifies or retrieves a value indicating whether the position controls are enabled on the control bar.",
		EnableTracker : "This property specifies or retrieves a value indicating whether the trackbar control is enabled.",
		Hidden : "This property specifies or retrieves a value indicating whether the player is visible in the browser.",
		InvokeURLs : "This property specifies or retrieves a value indicating whether the Windows Media Player control automatically invokes URLs in a browser (URL flipping).",
		Language : "This property specifies or retrieves a value indicating the current locale used for national language support.",
		Mute : "This property specifies or retrieves the current mute state of the Windows Media Player control.",
		PlayCount : "This property specifies or retrieves the number of times a clip plays.",
		PreviewMode : "This property specifies or retrieves a value indicating whether Windows Media Player is in preview mode.",
		Rate : "This property specifies or retrieves the playback rate of the clip.",
		SelectionEnd : "This property specifies or retrieves the time within the current clip at which playback will stop. This property cannot be set or retrieved until the ReadyState property (read-only) has a value of 4.",
		SelectionStart : "This property specifies or retrieves the time within the current clip at which playback will begin.",
		SendErrorEvents : "This property specifies or retrieves a value indicating whether the Windows Media Player control sends error events.",
		SendKeyboardEvents : "This property specifies or retrieves a value indicating whether the Windows Media Player control sends keyboard events.",
		SendMouseClickEvents : "This property specifies or retrieves a value indicating whether the Windows Media Player control sends mouse click events.",
		SendMouseMoveEvents : "This property specifies or retrieves a value indicating whether the Windows Media Player control sends mouse move events.",
		SendOpenStateChangeEvents : "This property specifies or retrieves a value indicating whether the Windows Media Player control sends open state change events.",
		SendPlayStateChangeEvents : "This property specifies or retrieves a value indicating whether the Windows Media Player control sends play state change events.",
		SendWarningEvents : "This property specifies or retrieves a value indicating whether the Windows Media Player control sends warning events.",
		ShowAudioControls : "This property specifies or retrieves a value indicating whether the audio controls appear on the control bar.",
		ShowCaptioning : "This property specifies or retrieves a value indicating whether the closed caption area is visible and closed captioning is enabled.",
		ShowControls : "This property specifies or retrieves a value indicating whether the control bar is visible.",
		ShowDisplay : "This property specifies or retrieves a value indicating whether the display panel is visible.",		
		ShowGotoBar : "This property specifies or retrieves a value indicating whether the Go To bar is visible.",		
		ShowPositionControls : "This property specifies or retrieves a value indicating whether the position controls appear on the control bar.",
		ShowStatusBar : "This property specifies or retrieves a value indicating whether the status bar is visible.",
		ShowTracker : "This property specifies or retrieves a value indicating whether the trackbar is visible.",
		SubpictureOn : "This property specifies or retrieves a value indicating whether the subpicture is displayed.",
		TransparentAtStart : "This property specifies or retrieves a value indicating whether the Windows Media Player control is transparent before play begins and after play ends",
		VideoBorder3D : "This property specifies or retrieves a value indicating whether the three-dimensional video border effect is enabled.",
		VideoBorderColor : "This property specifies or retrieves the color of the video border.",
		VideoBorderWidth : "This property specifies or retrieves the width of the video border, in pixels.",
		Volume : "This property specifies or retrieves the volume, in hundredths of decibels.",
		Yes : "Yes",
		No : "No",
		None : "None",
		DefaultCaption1 : "Default. Caption1",
		Caption2 : "Caption2",
		Text1 : "Text1",
		Text2 : "Text2",
		ExtendedDataServices : "Extended Data Services (XDS)",
		Arrowhourglass : "Standard arrow and small hourglass",
		Standardarrow : "Standard arrow",
		Crosshair : "Crosshair",
		TextIbeam : "Text I-beam",
		SlashedCircle : "Slashed circle",
		Fourpointedarrow : "Four-pointed arrow",
		DoublepointedNESW : "Double-pointed arrow NE-SW",
		DoublepointedNS : "Double-pointed arrow N-S",
		DoublepointedNWSE : "Double-pointed arrow NW-SE",
		DoublepointedWE : "Double-pointed arrow pointing W-E",
		Verticalarrow : "Vertical arrow",
		Hourglass : "Hourglass",
		Handpointing : "Hand with pointing index finger",
		NoColor : "No Color",
        Black : "Black",
        Blue : "Blue",
        Green : "Green",
        Orange : "Orange",
        Red : "Red",
        White : "White",
        Yellow : "Yellow",
        Custom : "Custom",
        Samesize : "Same size as the source image",
        HalfSourceImage : "W and H are one-half of the source image",
        DoubleSourceImage : "Double the dimensions of the source image",
        EntireScreen : "Size of the entire screen",
        DesignTime : "Size specified at design time",
        SixteenthScreen : "One-sixteenth the size of the screen",
        QuarterScreen : "One-quarter the size of the screen",
        HalfScreen : "Half the size of the screen",
        NA : "N/A",
        Note : "Note: ",
        ValidateNumber : "Please, enter only numeric values.",
        ValidateNumber10000 : "Please, enter a value ranging from –10,000 to 10,000.",
        ValidateNumberHex : "Please, specify a hexadecimal value.",
        ValidateAudio : "Please, enter a value ranging from zero to seven indicating the current audio stream, or 0xFFFFFFFF if no stream is selected.",
        ValidateLCID : "Please, specify a numeric value that corresponds to an LCID identifying a locale for national language support.",
        ValidateNumber10 : "Please, enter a value ranging from –10.00 to 10.00.",
        Nosubpicturestream : "There is no subpicture stream",
        Customh : "Custom - ",
        AlertValue : "Please, provide valid property value!"
    };
}

Telerik.Web.UI.Widgets.MediaPreviewer.prototype = {
	initialize : function() 
	{
		Telerik.Web.UI.Widgets.MediaPreviewer.callBaseMethod(this, "initialize");
		this._initializeChildren();
		this._initializeChildEvents();
	},
	
	_initializeChildren : function()
	{
		this._toolbar = $find("MediaPreviewToolBar");
		
		this._mediaPropertiesPane = $get("mediaPropertiesPane");
		this._mediaPreviewPane = $get("mediaPreviewPane");
		
		this._classIdCheckBox = $get("ClassID"); 
	    this._classIDText = $get("ClassIDText");
	    this._classIDLi = $get("ClassIDLi");
	    this._mediaWidth = $get("mediaWidth");
	    this._mediaHeight = $get("mediaHeight");
	    this._mediaAlign = $get("mediaAlign");
	    this._mediaProperties = $get("mediaProperties");
	    this._propertyValuePane = $get("propertyValuePane");
	    this._propertyValueDescription = $get("propertyValueDescription");
	},
	
	_initializeChildEvents : function()
	{
		this._toolbarClickDelegate = Function.createDelegate(this, this._toolbarClickHandler);
		this._toolbar.add_buttonClicked(this._toolbarClickDelegate);
		$addHandlers(this._classIdCheckBox, {"click" : this._classIdClickHandler}, this);
		$addHandlers(this._mediaProperties, {"change" : this._propertyChangeHandler}, this);
	},
	
	_toolbarClickHandler : function(sender, args)
	{
		var buttonValue = args._item.get_value();
		switch (buttonValue)
		{
			case "Properties":
				if(this._currentItem && this._mediaPropertiesPane.style.display == "none")
				{
					if(this._currentMediaItem)
					{
						this._mediaPreviewPane.innerHTML = "";
						this._currentMediaItem = null;
					}
					this._switchPanes("none", "block");
				}
			break;
			case "Preview":
				if(this._currentItem && this._mediaPreviewPane.style.display == "none")
				{
					//The timeout is necessary in order for the movie to play in IE6.
					var thisObject = this; 
					setTimeout(function()
						{
							thisObject._mediaPreviewPane.innerHTML = thisObject._createMediaElement();
						}
						, 0);
					this._switchPanes("block", "none"); 
				}
			break;
			default:
			break;
		}

	},
	
	_classIdClickHandler : function(e)
	{
	    if(this._classIdCheckBox.checked)
	    {
	        this._classIDLi.style.display = "";
	    }
	    else
	    {
	        this._classIDLi.style.display = "none";
	    }
	},
	
	_propertyChangeHandler : function(e)
	{
	    this._clearPropertyElementsHandlers();
	    this._propertyValuePane.innerHTML = "";
	    this._propertyValuePane.style.display = "none";
	    this._changeProperty(this._mediaProperties.value);
	},
	
    _getParams : function(element)
    {
        var params = {};
        if (element == "object")
        {
            params["FileName"] = this._currentItem.getUrl();
        }
        else
        {
            params["src"] = this._currentItem.getUrl();
            if(isNaN(parseInt(this._mediaWidth.value, 10)) || parseInt(this._mediaWidth.value, 10).toString() != this._mediaWidth.value)
            {
                this._mediaWidth.value = "150";
            }
            params["width"] = this._mediaWidth.value;
            if(isNaN(parseInt(this._mediaHeight.value, 10)) || parseInt(this._mediaHeight.value, 10).toString() != this._mediaHeight.value)
            {
                this._mediaHeight.value = "150";
            }
            params["height"] = this._mediaHeight.value;
            if (this._currentItem.extension == ".qt")
            {
                params["type"] = "movie/quicktime";
                params["pluginspage"] = "http://www.apple.com/quicktime/download";
            }
            else
            {
                params["type"] = "application/x-mplayer2";
                params["pluginspage"] = "http://www.microsoft.com/Windows/MediaPlayer";
            }
        }
        if (this._mediaAlign.value && this._mediaAlign.value.toLowerCase() != "baseline")
            params["align"] = this._mediaAlign.value;
        var properties = this._getProperties();
        for (var property in properties)
        {
            var item = properties[property];
            if(item[1] != null)
            {
                params[property] = item[1];
            }
        }
        return params;
    },

    _getObjectAttributes : function()
    {
        var objectParams = {};
        if(this._classIdCheckBox.checked && this._classIDText.value && this._classIDText.value.length>0)
        {
            objectParams["classid"] = this._classIDText.value;
        }
        else
        {
            objectParams["classid"] = "clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95";
        }

        if(isNaN(parseInt(this._mediaWidth.value, 10)) || parseInt(this._mediaWidth.value, 10).toString() != this._mediaWidth.value)
        {
            this._mediaWidth.value = "150";
        }
        objectParams["width"] = this._mediaWidth.value;
        if(isNaN(parseInt(this._mediaHeight.value, 10)) || parseInt(this._mediaHeight.value, 10).toString() != this._mediaHeight.value)
        {
            this._mediaHeight.value = "150";
        }
        objectParams["height"] = this._mediaHeight.value;

        if (this._mediaAlign.value && this._mediaAlign.value.toLowerCase() != "baseline")
        {
            objectParams["align"] = this._mediaAlign.value;
        }
        objectParams["type"] = "application/x-oleobject";

        return objectParams;

//            if (this._currentItem.extension == ".qt")
//        {
//            objectParams["type"] = "movie/quicktime";
//        }
//        else
//        {
//            objectParams["type"] = "application/x-mplayer2";
//        }
    },

    _createMediaElement : function()
    {
        var sb = new Sys.StringBuilder("");
        sb.append("<object");

        //set object attributes
        var objArguments = this._getObjectAttributes();
        for (var argument in objArguments)
        {
            sb.append(String.format(" {0}=\"{1}\"", argument, objArguments[argument]));
        }
        sb.append(">");

        //set object params
        var params = this._getParams("object");
        for (var member in params)
        {
            sb.append(String.format("<param name=\"{0}\" value=\"{1}\">",member, params[member]));
        }

        //set embed attributes
        sb.append("<embed");
        params = this._getParams("embed");
        for (var member in params)
        {
            sb.append(String.format(" {0}=\"{1}\"", member, params[member]));
        }
        sb.append("></embed>");


        sb.append("</object>");

        return sb.toString();
    },

	_setInitialValues : function()
	{
	    this._classIDLi.style.display = "none";
	    this._classIdCheckBox.checked = false;
	    this._mediaPreviewPane.innerHTML = "";
	    this._currentMediaItem = null;
	    
	    this._propertyValuePane.innerHTML = "";
	    this._propertyValuePane.style.display = "none";
	    this._propertyValueDescription.innerHTML = this._localization.NA;
	    this._clearPropertyElementsHandlers();
	    
	    this._classIDText.value = "";
	    this._mediaWidth.value = "150";
	    this._mediaHeight.value = "150"; 	   
	    this._mediaAlign.selectedIndex = 0;
	    this._mediaProperties.selectedIndex = 0; 
	},
	
	_setToolbarEnabled : function(enabled)
	{
		this._toolbar.get_items().forEach(function(item){
			item.set_enabled(enabled);
		});
	},
	
	_switchPanes : function(previewMode, propertiesMode)
	{
	    this._mediaPreviewPane.style.display = previewMode;
	    this._mediaPropertiesPane.style.display = propertiesMode;
	},
	
	setItem : function(item)
	{
	    this._setInitialValues();
	    
	    if (item.type == Telerik.Web.UI.Widgets.FileItemType.Directory)
	    {
		    this._setToolbarEnabled(false);

		    this._currentItem = null;
		    this._mediaPreviewPane.style.display = "none";
	        this._mediaPropertiesPane.style.display = "none";
	    }
	    else
	    {
		    this._setToolbarEnabled(true);
	        this._currentItem = item;
		    this._switchPanes("none", "block");
	    }
	},
	
	getResult : function()
	{
	    if (this._currentItem && this._currentItem.type == Telerik.Web.UI.Widgets.FileItemType.File)
		{
	        return this._createMediaElement();
		}
		return null;
	},

	populateObjectProperties : function(selectedObject)
	{
		//WARNING: Currently tested only in IE7:
		if (selectedObject.object)
		{
			if (selectedObject.classid)
			{
				this._classIdCheckBox.click();
				this._classIDText.value = selectedObject.classid;
			}
			this._mediaWidth.value = (selectedObject.width) ? parseInt(selectedObject.width).toString() : "";
			this._mediaHeight.value = (selectedObject.height) ? parseInt(selectedObject.height).toString() : "";
			this._selectOptionByValue(this._mediaAlign, selectedObject.align, false, 0);
			//TODO:Populate the properties also!
		}
	},

	_getProperties : function()
    {
	    if (!this._properties)
	    {
		    this._properties = {
		        "AllowChangeDisplaySize": new Array(this._localization.AllowChangeDisplaySize, null, "radio", "boolean", "true"),
		        "AllowScan": new Array(this._localization.AllowScan, null, "radio", "boolean", "true"),
		        "AnimationAtStart": new Array(this._localization.AnimationAtStart, null, "radio", "boolean", "true"),
		        "AudioStream": new Array(this._localization.AudioStream, null, "text-regexp", "^[0-9]*$", this._localization.ValidateNumber, ""),
		        "AutoRewind" : new Array(this._localization.AutoRewind, null, "radio", "boolean", "true"),
		        "AutoSize" : new Array(this._localization.AutoSize, null, "radio", "boolean", ""),
		        "AutoStart" : new Array(this._localization.AutoStart, null, "radio", "boolean", "true"),
		        "Balance" : new Array(this._localization.Balance, null, "text-range", "({text} >= -10000) && ({text} <= 10000)", this._localization.ValidateNumber10000, 0),
		        "CCActive" : new Array(this._localization.CCActive, null, "radio", "boolean", "false"),
		        "ClickToPlay" : new Array(this._localization.ClickToPlay, null, "radio", "boolean", "true"),
		        "ColorKey" : new Array(this._localization.ColorKey, null, "text", "", this._localization.ValidateNumberHex, ""),
		        "CurrentAngle" : new Array(this._localization.CurrentAngle, null, "select-range", 1, 9, 1),
		        "CurrentAudioStream" : new Array(this._localization.CurrentAudioStream, null, "text-range", "((({text} >= 0) && ({text} <= 7)) || ({text} == '0xFFFFFFFF'))", this._localization.ValidateAudio, 0),
		        "CurrentCCService" : new Array(this._localization.CurrentCCService, null, "select", new Array(0, 1, 2, 3, 4, 5), new Array(this._localization.None, this._localization.DefaultCaption1, this._localization.Caption2, this._localization.Text1, this._localization.Text2, this._localization.ExtendedDataServices), 0),
		        "CurrentMarker" : new Array(this._localization.CurrentMarker, null, "text-regexp", "^[0-9]*$", this._localization.ValidateNumber, 0),
		        "CurrentPosition" : new Array(this._localization.CurrentPosition, null, "text-regexp", "^[0-9]*$", this._localization.ValidateNumber, ""),
		        "CurrentSubpictureStream" : new Array(this._localization.CurrentSubpictureStream, null, "select-special", new Array(this._localization.Streamisvalid, "range", 0, 31), new Array(this._localization.Nosubpicturestream, "value", 63), 0),
		        "CursorType" : new Array(this._localization.CursorType, null, "select", new Array(32650, 32512, 32515, 32513, 32648, 32646, 32643, 32645, 32642, 32644, 32516, 32514, 1), new Array(this._localization.Arrowhourglass, this._localization.Standardarrow, this._localization.Crosshair, this._localization.TextIbeam, this._localization.SlashedCircle, this._localization.Fourpointedarrow, this._localization.DoublepointedNESW, this._localization.DoublepointedNS, this._localization.DoublepointedNWSE, this._localization.DoublepointedWE, this._localization.Verticalarrow, this._localization.Hourglass, this._localization.Handpointing), ""),
		        "DefaultFrame" : new Array(this._localization.DefaultFrame, null, "text", "", "", ""),
		        "DisplayBackColor" : new Array(this._localization.DisplayBackColor, null, "select-color", 0xFFFFFF),
		        "DisplayForeColor" : new Array(this._localization.DisplayForeColor, null, "select-color", 0xFFFFFF),
		        "DisplayMode" : new Array(this._localization.DisplayMode, null, "radio", "integer", 0),
		        "DisplaySize" : new Array(this._localization.DisplaySize, null, "select", new Array(0, 1, 2, 3, 4, 5, 6, 7), new Array(this._localization.Samesize, this._localization.HalfSourceImage, this._localization.DoubleSourceImage, this._localization.EntireScreen, this._localization.DesignTime, this._localization.SixteenthScreen, this._localization.QuarterScreen, this._localization.HalfScreen), ""),
		        "EnableContextMenu" : new Array(this._localization.EnableContextMenu, null, "radio", "boolean", "true"),
		        "Enabled" : new Array(this._localization.Enabled, null, "radio", "boolean", "true"),
		        "EnableFullScreenControls" : new Array(this._localization.EnableFullScreenControls, null, "radio", "boolean", "true"),
		        "EnablePositionControls" : new Array(this._localization.EnablePositionControls, null, "radio", "boolean", "true"),
		        "EnableTracker" : new Array(this._localization.EnableTracker, null, "radio", "boolean", "true"),
		        "Hidden" : new Array(this._localization.Hidden, null, "radio", "boolean", "false"),
		        "InvokeURLs" : new Array(this._localization.InvokeURLs, null, "radio", "boolean", "true"),
		        "Language" : new Array(this._localization.Language, null, "text-regexp", "^[0-9]*$", this._localization.ValidateLCID, ""),
		        "Mute" : new Array(this._localization.Mute, null, "radio", "boolean", "true"),
		        "PlayCount" : new Array(this._localization.PlayCount, null, "text-regexp", "^[0-9]*$", this._localization.ValidateNumber, 1),
		        "PreviewMode" : new Array(this._localization.PreviewMode, null, "radio", "boolean", "false"),
		        "Rate" : new Array(this._localization.Rate, null, "text-range", "({text} >= -10) && ({text} <= 10)", this._localization.ValidateNumber10, 1.0),
		        "SelectionEnd" : new Array(this._localization.SelectionEnd, null, "text-range", "((({text} >= Number.MIN_VALUE) && ({text} <= Number.MAX_VALUE)) || ({text} == ''))", this._localization.ValidateNumber, ""),
		        "SelectionStart" : new Array(this._localization.SelectionStart, null, "text-range", "({text} >= Number.MIN_VALUE) && ({text} <= Number.MAX_VALUE)", this._localization.ValidateNumber, 0),
		        "SendErrorEvents" : new Array(this._localization.SendErrorEvents, null, "radio", "boolean", "true"),
		        "SendKeyboardEvents" : new Array(this._localization.SendKeyboardEvents, null, "radio", "boolean", "false"),
		        "SendMouseClickEvents" : new Array(this._localization.SendMouseClickEvents, null, "radio", "boolean", "false"),
		        "SendMouseMoveEvents" : new Array(this._localization.SendMouseMoveEvents, null, "radio", "boolean", "false"),
		        "SendOpenStateChangeEvents" : new Array(this._localization.SendOpenStateChangeEvents, null, "radio", "boolean", "true"),
		        "SendPlayStateChangeEvents" : new Array(this._localization.SendPlayStateChangeEvents, null, "radio", "boolean", "true"),
		        "SendWarningEvents" : new Array(this._localization.SendWarningEvents, null, "radio", "boolean", "true"),
		        "ShowAudioControls" : new Array(this._localization.ShowAudioControls, null, "radio", "boolean", "true"),
		        "ShowCaptioning" : new Array(this._localization.ShowCaptioning, null, "radio", "boolean", "false"),
		        "ShowControls" : new Array(this._localization.ShowControls, null, "radio", "boolean", "true"),
		        "ShowDisplay" : new Array(this._localization.ShowDisplay, null, "radio", "boolean", "false"),
		        "ShowGotoBar" : new Array(this._localization.ShowGotoBar, null, "radio", "boolean", "false"),
		        "ShowPositionControls" : new Array(this._localization.ShowPositionControls, null, "radio", "boolean", "true"),
		        "ShowStatusBar" : new Array(this._localization.ShowStatusBar, null, "radio", "boolean", "false"),
		        "ShowTracker" : new Array(this._localization.ShowTracker, null, "radio", "boolean", "true"),
		        "SubpictureOn" : new Array(this._localization.SubpictureOn, null, "radio", "boolean", ""),
		        "TransparentAtStart" : new Array(this._localization.TransparentAtStart, null, "radio", "boolean", "false"),
		        "VideoBorder3D" : new Array(this._localization.VideoBorder3D, null, "radio", "boolean", "false"),
		        "VideoBorderColor" : new Array(this._localization.VideoBorderColor, null, "select-color", 0x000000),
		        "VideoBorderWidth" : new Array(this._localization.VideoBorderWidth, null, "text-regexp", "^[0-9]*$", this._localization.ValidateNumber, 0),
		        "Volume" : new Array(this._localization.Volume, null, "text-range", "({text} >= -10000) && ({text} <= 10000)", this._localization.ValidateNumber10000, -600)
		    };
	    
	    }
	    return this._properties;
    },
    
    _createText : function(textValue)
    {
	    var textBox = document.createElement("INPUT");
	    this._propertyElementsWithHandlers.push(textBox);
	    $addHandlers(textBox, {"keydown" : this._changeTextHandler, "blur" : this._validateTextHandler}, this);
	    
	    textBox.id = "textProperty";
	    textBox.type = "text";
	    textBox.value = textValue;
	    textBox.className = "flatTextBox";
	    return textBox;
    },
    
    _changeTextHandler : function(e)
    {
        var thisObject = this;
        var control = e.target;
        window.setTimeout(function(){
            thisObject._changeValue(control);
        }, 100);
        return true;
    },
    
    _validateTextHandler : function(e)
    {
        var control = e.target;
        
        var item = this._getProperties()[this._mediaProperties.value];
        var expression = item[3];
        var isRegExp = (item[2] == "text-regexp")?true:false;
        
	    try
	    {
		    if (isRegExp)
		    {
			    var re = new RegExp(expression, "gi");
			    if (re.test(control.value))
			    {
				    return true;
			    }
		    }
		    else if (expression == "")
		    {
			    return true;
		    }
		    else if (eval(expression.replace(/\{text\}/gi, control.value)))
		    {
			    return true;
		    }
	    } catch (e) {};
	    alert(this._localization.AlertValue);
	    control.focus();
	    return false;
    },
    
    _createRadio : function(id, radioValue, defaultValue)
    {
	    var radioBox;
	    	    
	    if (document.all)
	    {
		    radioBox = document.createElement("<INPUT NAME='booleanGroup'" + ((radioValue == defaultValue.toString()) ? " CHECKED" : "") + ">");
	    }
	    else
	    {
		    radioBox = document.createElement("INPUT");
		    radioBox.name = "booleanGroup";
		    if (radioValue == defaultValue.toString())
		    {
			    radioBox.setAttribute("checked", true);
		    }
	    }
	    this._propertyElementsWithHandlers.push(radioBox);
	    $addHandlers(radioBox, {"click" : this._changeValueHandler}, this);
    
	    radioBox.type = "radio";
	    radioBox.id = id;
	    radioBox.value = radioValue;
	    	    
	    return radioBox;
    },
    
    _createLabel : function(controlID, labelText)
    {
	    var label = document.createElement("LABEL");
	    label.htmlFor = controlID;
	    label.innerHTML = labelText;
	    return label;
    },
    
    _convertColor : function(color)
    {
	    color = parseInt(color);
	    color = color.toString(16);
	    if (color.length < 6)
	    {
		    var sTempString = "000000".substring(0, (6 - color.length));
		    color = "#" + sTempString.concat(color).toUpperCase();
	    }
	    else
	    {
		    color = "#" + color.toUpperCase();
	    }
	    return color;
    },
    
    _selectOption : function(control, value)
    {
	    var selectStatus = false;
	    if ((value != null) && (value.toString() != ""))
	    {
		    var options = control.getElementsByTagName("OPTION");
		    for (var i=0; i<options.length; i++)
		    {
			    if (options[i].value.toString().toUpperCase() == value.toString().toUpperCase())
			    {
				    try
				    {
					    options[i].selected = true;
				    }
				    catch (exc) {}
				    selectStatus = true;
				    break;
			    }
		    }
	    }
	    else
	    {
		    control.selectedIndex = 0;
	    }
	    return selectStatus;
    },
    
    _changeValueHandler : function(e)
    {
	    this._changeValue(e.target);
    },
    
    _changeColorHandler : function(e)
    {
        var control = e.target;
        
	    if (control.value == "")
	    {
		    //TODO: Open ColorPicker.
	    }
	    this._changeValue(e.target);
    },
    
    _changeValue : function(control)
    {
        var item = this._getProperties()[this._mediaProperties.value];
	    item[1] = control.value;
    },
    
    _changeProperty : function(propValue)
    {
	    var item = this._getProperties()[propValue];
	    if (propValue != "")
	    {
            this._propertyValueDescription.innerHTML = this._localization.Description + item[0];
		    switch (item[2])
		    {
			    case "radio":
				    var defaultValue = ((item[1] == null) ? item[4] : item[1]);
				    switch (item[3])
				    {
					    case "boolean":
						    var values = new Array("true", "false");
						    var texts = new Array(this._localization.Yes, this._localization.No);
						    break;
					    case "integer":
						    var values = new Array(0, 1);
						    var texts = new Array(this._localization.Yes, this._localization.No);
						    break;
				    }
				    for (var i=0; i<values.length; i++)
				    {
					    var div = document.createElement("DIV");
					    div.appendChild(this._createRadio("booleanGroup" + i, values[i], defaultValue));
					    div.appendChild(this._createLabel("booleanGroup" + i, texts[i]));
					    this._propertyValuePane.appendChild(div);
				    }
				    break;
			    case "select":
				    var defaultValue = (item[1] == null) ? item[5] : item[1];
				    var select = document.createElement("SELECT");
				    this._propertyElementsWithHandlers.push(select);	
				    $addHandlers(select, {"change" : this._changeValueHandler}, this);	
				    var values = item[3];
				    var texts = item[4];
				    for (var i=0; i<values.length; i++)
				    {
					    var option = document.createElement("OPTION");
					    option.innerHTML = texts[i];
					    option.value = values[i];
					    select.appendChild(option);
				    }
				    this._selectOption(select, defaultValue);
				    this._propertyValuePane.appendChild(select);
				    break;
			    case "select-range":
				    var defaultValue = ((item[1] == null) ? item[5] : item[1]);
				    var select = document.createElement("SELECT");
				    this._propertyElementsWithHandlers.push(select);		
				    $addHandlers(select, {"change" : this._changeValueHandler}, this);
				    for (var i=item[3]; i<=item[4]; i++)
				    {
					    var option = document.createElement("OPTION");
					    option.innerHTML = i;
					    option.value = i;
					    select.appendChild(option);
				    }
				    this._selectOption(select, defaultValue);
				    this._propertyValuePane.appendChild(select);
				    break;
			    case "select-special":
				    var defaultValue = (item[1] == null) ? item[5] : item[1];
				    var select = document.createElement("SELECT");
				    this._propertyElementsWithHandlers.push(select);	
				    $addHandlers(select, {"change" : this._changeValueHandler}, this);
				    for (var i=3; i<(item.length - 1); i++)
				    {
					    var optGroup = document.createElement("OPTGROUP");
					    optGroup.label = item[i][0];
					    select.appendChild(optGroup);
					    switch (item[i][1])
					    {
						    case "range":
							    for (var j=item[i][2]; j<=item[i][3]; j++)
							    {
								    var option = document.createElement("OPTION");
								    option.innerHTML = j;
								    option.value = j;
								    optGroup.appendChild(option);
							    }
							    break;
						    case "value":
							    var option = document.createElement("OPTION");
							    option.innerHTML = item[i][2];
							    option.value = item[i][2];
							    optGroup.appendChild(option);
							    break;
					    }
				    }
				    this._selectOption(select, defaultValue);
				    this._propertyValuePane.appendChild(select);
				    break;
			    case "select-color":
				    var defaultValue = ((item[1] == null) ? item[3] : item[1]);
				    var select = document.createElement("SELECT");				    
				    this._propertyElementsWithHandlers.push(select);	
				    $addHandlers(select, {"change" : this._changeColorHandler}, this);
				    select.style.width = "140px";
				    //var values = new Array("000000", "0000FF", "008000", "FFA500", "FF0000", "FFFFFF", "FFFF00", "");
				    //var texts = new Array(this._localization.Black, this._localization.Blue, this._localization.Green, this._localization.Orange, this._localization.Red, this._localization.White, this._localization.Yellow, this._localization.Custom);
				    var values = new Array("000000", "0000FF", "008000", "FFA500", "FF0000", "FFFFFF", "FFFF00");
				    var texts = new Array(this._localization.Black, this._localization.Blue, this._localization.Green, this._localization.Orange, this._localization.Red, this._localization.White, this._localization.Yellow);
				    var options = new Array();
				    for (var i=0; i<values.length; i++)
				    {
					    var option = document.createElement("OPTION");
					    if (values[i] == "")
					    {
						    option.value = "";
					    }
					    else
					    {
						    option.value = eval("0x" + values[i]);
						    option.style.backgroundColor = "#" + values[i];
					    }
					    option.innerHTML = texts[i];
					    select.appendChild(option);
					    options[options.length] = option;
				    }
				    this._propertyValuePane.appendChild(select);
				    if (!this._selectOption(select, parseInt(defaultValue)))
				    {
					    option = document.createElement("OPTION");
					    color = this._convertColor(defaultValue);
					    option.innerHTML = this._localization.Customh + color;
					    option.value = defaultValue;
					    option.style.backgroundColor = color;
					    select.insertBefore(option, options[6]);
					    select.selectedIndex = 6;
				    }
				    break;
			    case "text":
				    var defaultValue = ((item[1] == null) ? item[5] : item[1]);
				    var textBox = this._createText(defaultValue);
				    this._propertyValuePane.appendChild(textBox);
				    if (item[4] != "")
				    {
					    this._propertyValueDescription.innerHTML += this._localization.Note + item[4];
				    }
				    break;
			    case "text-regexp":
				    var defaultValue = ((item[1] == null) ? item[5] : item[1]);
				    var textBox = this._createText(defaultValue);
				    this._propertyValuePane.appendChild(textBox);
				    this._propertyValueDescription.innerHTML += this._localization.Note + item[4];
				    break;
			    case "text-range":
				    var defaultValue = ((item[1] == null) ? item[5] : item[1]);
				    var textBox = this._createText(defaultValue);
				    this._propertyValuePane.appendChild(textBox);
				    this._propertyValueDescription.innerHTML += this._localization.Note + item[4];
				    break;
		    }
		    this._propertyValuePane.style.display = "block";
	    }
	    else
	    {
		    this._propertyValueDescription.innerHTML = this._localization.NA;
	    }
    },
    
    _clearPropertyElementsHandlers : function()
    {
        var propertyElement = this._propertyElementsWithHandlers.pop();
        while(propertyElement)
        {
            $clearHandlers(propertyElement);
            propertyElement = this._propertyElementsWithHandlers.pop();
        }
    },
	
	dispose : function() 
	{
	    this._setInitialValues();
		this._toolbar.remove_buttonClicked(this._toolbarClickDelegate);
		this._toolbarClickDelegate = null;
		$clearHandlers(this._classIdCheckBox);
		$clearHandlers(this._mediaProperties);
		
		Telerik.Web.UI.Widgets.MediaPreviewer.callBaseMethod(this, "dispose");
	}
}

Telerik.Web.UI.Widgets.MediaPreviewer.registerClass("Telerik.Web.UI.Widgets.MediaPreviewer", Telerik.Web.UI.Widgets.FilePreviewer);


Type.registerNamespace("Telerik.Web.UI.Editor.DialogControls");

Telerik.Web.UI.Editor.DialogControls.MediaManager = function(element)
{
	Telerik.Web.UI.Editor.DialogControls.MediaManager.initializeBase(this, [element]);
}

Telerik.Web.UI.Editor.DialogControls.MediaManager.prototype = {
	initialize : function() 
	{
		this.set_insertButton($get("InsertButton"));
		this.set_cancelButton($get("CancelButton"));
		
		$create(Telerik.Web.UI.Widgets.MediaPreviewer, null, null, null, $get("MediaPreviewer"));
		this.set_filePreviewer($find("MediaPreviewer"));
		this.set_toolbar($find("fileManagerToolBar"));
		this.set_fileLister($find("GenericFileLister1"));
		
		Telerik.Web.UI.Editor.DialogControls.MediaManager.callBaseMethod(this, 'initialize');
	},

	dispose : function() 
	{
		Telerik.Web.UI.Editor.DialogControls.MediaManager.callBaseMethod(this, 'dispose');
		this._insertButton = null;
		this._cancelButton = null;
	}
}

Telerik.Web.UI.Editor.DialogControls.MediaManager.registerClass('Telerik.Web.UI.Editor.DialogControls.MediaManager', Telerik.Web.UI.Widgets.FileManager);
</script>

<!-- Media Manager Dialog Begin -->
<table class="rade_dialog ManagerDialog MediaManager" border="0" cellpadding="0"
	cellspacing="0" style="width: 100%; table-layout: fixed;">
	<tr>
		<td colspan="2" style="padding: 0; vertical-align: top;">
			<telerik:RadToolBar ID="fileManagerToolBar" runat="server">
				<Items>
					<telerik:RadToolBarButton Text="&nbsp;" ToolTip="Refresh" Value="Refresh" CssClass="rtbIconOnly icnRefresh" />
					<telerik:RadToolBarButton Text="&nbsp;" ToolTip="New Folder" Value="NewFolder" Enabled="false" CssClass="rtbIconOnly icnNewFolder" />
					<telerik:RadToolBarButton Text="&nbsp;" ToolTip="Delete" Value="Delete" Enabled="false" CssClass="rtbIconOnly icnDelete" />
					<telerik:RadToolBarButton Text="Upload" ToolTip="Upload" Value="Upload" Enabled="false" CheckOnClick="true" AllowSelfUncheck="true" CssClass="icnUpload" />
				</Items>
			</telerik:RadToolBar>
		</td>
	</tr>
	<tr id="listRow">
		<td style="width: 50%; padding: 0; vertical-align: top;">
			<widgets:GenericFileLister height="317px" id="GenericFileLister1" runat="server"></widgets:GenericFileLister>
		</td>
		<td style="width: 50%; padding: 0; vertical-align: top;">
			<div id="MediaPreviewer" class="propertiesTableCell">
				<telerik:RadToolBar ID="MediaPreviewToolBar" runat="Server">
					<Items>
						<telerik:RadToolBarButton CssClass="NoIcon" Text="Properties" ToolTip="Properties" Value="Properties" CheckOnClick="true" AllowSelfUncheck="true" Checked=true />
						<telerik:RadToolBarButton Text="Preview" CssClass="NoIcon" ToolTip="Preview" Value="Preview" CheckOnClick="true" AllowSelfUncheck="true" />
					</Items>
				</telerik:RadToolBar>
				<div class="mediaPropertiesPane" id="mediaPropertiesPane" style="display: none;">
					<fieldset style="margin: 0 4px; height: 307px;">
							<legend>Media Properties</legend>
							<table border="0" cellpadding="0" cellspacing="0" width="100%" class="propertiesList">
								<tr>
									<td style="text-align: right;">
										<input type="checkbox" id="ClassID" style="border: 0; margin-right: 8px;" />
									</td>
									<td>
										<label for="ClassID" class="propertyLabel" style="text-align: left">
											<script type="text/javascript">
											document.write(localization["ClassID"]);
											</script>
										</label>
									</td>
								</tr>
								<tr id="ClassIDLi" style="display: none;">
									<td>
										<label for="ClassIDText" class="propertyLabel" style="width: 65px;">
											<script type="text/javascript">
											document.write(localization["ClassIDText"]);
											</script>:
										</label>
									</td>
									<td>
										<input type="text" class="textinput" id="ClassIDText" style="width: 240px;" />
									</td>
								</tr>
								<tr>
									<td>
										<label for="mediaWidth" class="propertyLabel" style="width: 65px;">
											<script type="text/javascript">
											document.write(localization["Width"]);
											</script>:
										</label>
									</td>
									<td>
										<input type="text" class="textinput" id="mediaWidth" style="width: 240px;" />
									</td>
								</tr>
								<tr>
									<td>
										<label for="mediaHeight" class="propertyLabel" style="width: 65px;">
											<script type="text/javascript">
											document.write(localization["Height"]);
											</script>:
										</label>
									</td>
									<td>
										<input type="text" class="textinput" id="mediaHeight" style="width: 240px;" />
									</td>
								</tr>
								<tr>
									<td>
										<label for="mediaAlign" class="propertyLabel" style="width: 65px;">
											<script type="text/javascript">
											document.write(localization["Align"]);
											</script>:
										</label>
									</td>
									<td>
										<select id="mediaAlign" style="width: 246px;">
											<option selected="selected" value="baseline">Baseline </option>
											<option value="bottom">Bottom </option>
											<option value="left">Left </option>
											<option value="middle">Middle </option>
											<option value="right">Right </option>
											<option value="texttop">TextTop </option>
											<option value="top">Top </option>
										</select>
									</td>
								</tr>
								<tr>
									<td>
										<label for="mediaProperties" class="propertyLabel" style="width: 65px;">
											<script type="text/javascript">
											document.write(localization["Properties"]);
											</script>:
										</label>
									</td>
									<td>
										<select id="mediaProperties" style="width: 246px;">
											<option selected="selected" value=""></option>
											<option value="AllowChangeDisplaySize">AllowChangeDisplaySize </option>
											<option value="AllowScan">AllowScan </option>
											<option value="AnimationAtStart">AnimationAtStart </option>
											<option value="AudioStream">AudioStream </option>
											<option value="AutoRewind">AutoRewind </option>
											<option value="AutoSize">AutoSize </option>
											<option value="AutoStart">AutoStart </option>
											<option value="Balance">Balance </option>
											<option value="CCActive">CCActive </option>
											<option value="ClickToPlay">ClickToPlay </option>
											<option value="ColorKey">ColorKey </option>
											<option value="CurrentAngle">CurrentAngle </option>
											<option value="CurrentAudioStream">CurrentAudioStream </option>
											<option value="CurrentCCService">CurrentCCService </option>
											<option value="CurrentMarker">CurrentMarker </option>
											<option value="CurrentPosition">CurrentPosition </option>
											<option value="CurrentSubpictureStream">CurrentSubpictureStream </option>
											<option value="CursorType">CursorType </option>
											<option value="DefaultFrame">DefaultFrame </option>
											<option value="DisplayBackColor">DisplayBackColor </option>
											<option value="DisplayForeColor">DisplayForeColor </option>
											<option value="DisplayMode">DisplayMode </option>
											<option value="DisplaySize">DisplaySize </option>
											<option value="EnableContextMenu">EnableContextMenu </option>
											<option value="Enabled">Enabled </option>
											<option value="EnableFullScreenControls">EnableFullScreenControls </option>
											<option value="EnablePositionControls">EnablePositionControls </option>
											<option value="EnableTracker">EnableTracker </option>
											<option value="Hidden">Hidden </option>
											<option value="InvokeURLs">InvokeURLs </option>
											<option value="Language">Language </option>
											<option value="Mute">Mute </option>
											<option value="PlayCount">PlayCount </option>
											<option value="PreviewMode">PreviewMode </option>
											<option value="Rate">Rate </option>
											<option value="SelectionEnd">SelectionEnd </option>
											<option value="SelectionStart">SelectionStart </option>
											<option value="SendErrorEvents">SendErrorEvents </option>
											<option value="SendKeyboardEvents">SendKeyboardEvents </option>
											<option value="SendMouseClickEvents">SendMouseClickEvents </option>
											<option value="SendMouseMoveEvents">SendMouseMoveEvents </option>
											<option value="SendOpenStateChangeEvents">SendOpenStateChangeEvents </option>
											<option value="SendPlayStateChangeEvents">SendPlayStateChangeEvents </option>
											<option value="SendWarningEvents">SendWarningEvents </option>
											<option value="ShowAudioControls">ShowAudioControls </option>
											<option value="ShowCaptioning">ShowCaptioning </option>
											<option value="ShowControls">ShowControls </option>
											<option value="ShowDisplay">ShowDisplay </option>
											<option value="ShowGotoBar">ShowGotoBar </option>
											<option value="ShowPositionControls">ShowPositionControls </option>
											<option value="ShowStatusBar">ShowStatusBar </option>
											<option value="ShowTracker">ShowTracker </option>
											<option value="SubpictureOn">SubpictureOn </option>
											<option value="TransparentAtStart">TransparentAtStart </option>
											<option value="VideoBorder3D">VideoBorder3D </option>
											<option value="VideoBorderColor">VideoBorderColor </option>
											<option value="VideoBorderWidth">VideoBorderWidth </option>
											<option value="Volume">Volume </option>
										</select>
									</td>
								</tr>
								<tr>
									<td>
										<label class="propertyLabel" style="width: 65px;">
											<script type="text/javascript">
											document.write(localization["Value"]);
											</script>:
										</label>
										<div class="propertiesField" id="propertyValuePane" style="display: none;"></div>
									</td>
									<td>
										<label class="propertyLabel" style="width: 65px;" id="propertyValueDescription" style="text-align: left">
											<script type="text/javascript">
											document.write(localization["NA"]);
											</script>
										</label>
									</td>
								</tr>
							</table>
						</fieldset>
						<style type="text/css">
						.propertiesList td
						{
							padding: 4px 0 !important;
						}
						</style>
				</div>
				<div class="mediaPreviewPane" id="mediaPreviewPane" style="display: none;"></div>
			</div>
		</td>
	</tr>
	<tr id="uploadRow" style="display: none;">
		<td style="height: 317px;" colspan="2">
			<widgets:GenericFileUploader id="GenericFileUploader1" runat="server"></widgets:GenericFileUploader>
		</td>
	</tr>
	<tr>
		<td colspan="2" style="padding: 6px 0;">
			<div class="radECtrlButtonsList">
				<ul>
					<li><a id="InsertButton" href="javascript:void(0);" class="radECtrlButtons" title="Insert"
						style="width: 90px;"><span>

							<script type="text/javascript">document.write(localization["Insert"]);</script>

						</span></a></li>
					<li><a id="CancelButton" href="javascript:void(0);" class="radECtrlButtons" title="Cancel"
						style="width: 90px;"><span>

							<script type="text/javascript">document.write(localization["Cancel"]);</script>

						</span></a></li>
				</ul>
			</div>
		</td>
	</tr>
</table>
<!-- Media Manager Dialog End -->
