(function ()
{
	var ns = __namespace( "Astro.Blog.AstroEdit.Visualizer.Snippet" );

	/** @type {System.utils.IKey} */
	var IKey                              = __import( "System.utils.IKey" );
	/** @type {System.utils.DataKey} */
	var DataKey                           = __import( "System.utils.DataKey" );
	/** @type {Dandelion.IDOMElement} */
	var IDOMElement                       = __import( "Dandelion.IDOMElement" );
	/** @type {Dandelion} */
	var Dand                              = __import( "Dandelion" );
	/** @type {Components.MessageBox} */
	var MessageBox                        = __import( "Components.MessageBox" );

	var compileProp = ns[ NS_INVOKE ]( "compileProp" );

	var image = function( insertSnippet, snippetWrap, createContext, override )
	{
		var temp, i, j
		
		, handler = function ()
		{
			// Input fields
			var input_url = Dand.wrap(
				"input", null, "v_snippet_input_single", null, new IKey( "type", "text" )
			)
			, input_a = Dand.wrap(
				"input", null, "v_snippet_input_single", null, new IKey( "type", "text" )
			)
			, input_preferred = Dand.wrapna('input', new IKey("type", "checkbox"))
			;
			
			if ( this._stage )
			{
				input_url.value = this._url;
				input_a.value = this._href;
				input_preferred.checked = ( this._preferred == "on" );
			}
			
			// Popup MessageBox
			new MessageBox(
				( this._stage ? "Edit" : "Insert" ) + " image snippet",
				Dand.wrape([
						Dand.wrapc( "v_instruction flsf", "Link to the image:" )
						, input_url
						, Dand.wrapc( "v_instruction flsf", "Ancohr link(optional):" )
						, input_a
						, Dand.wrape([ input_preferred, Dand.textNode( "Preferred" ) ])
					]
				)
				, "OK", "Cancel"
				, visualizer.bind({ url:input_url, href:input_a, stage: this._stage, preferred: input_preferred })
			).show();
		}
		
		, visualizer = function ( submitted, override )
		{
			var src, href, preferred
			, stage = this.stage;
			
			if ( override )
			{
				src = override.value;
				href = override.href;
				preferred = override.preferred ? "on" : "";
			}
			else
			{
				src = this.url.value;
				href = this.href.value;
				preferred = this.preferred.checked ? "on" : "";
			}
			
			if ( submitted && src )
			{
				
				// Shared clause
				i = Dand.textNode(href ? ("link to: " + href): "No link");
				
				if ( !stage )
				{
					if ( !src ) return;
					
									
					// Visualize component
					temp =  Dand.wrapc(
						"v_box"
						, [
							Dand.wrapna(
								"img"
								, [
									new IKey( "src", src )
									, new IKey( "style", "max-width: 100%" )
								]
							)
							// caption
							, Dand.wrapc( "v_description", i )
						]
						, [
							new DataKey( "value", src )
							, new DataKey( "href", href )
							, new DataKey( "preferred", preferred )
						]
					);
					insertSnippet( j = snippetWrap( "Image", temp ), Boolean( override ) );
				}
				else
				{
					IDOMElement( stage ).setAttribute
					([
						new DataKey( "value", src )
						, new DataKey( "href", href )
						, new DataKey( "preferred", preferred )
					]);
					
					stage.firstChild.setAttribute("src", src);
					
					temp = stage.lastChild;
					temp.removeChild(temp.firstChild);
					temp.appendChild(i);
					
					// set temp back to stage
					temp = stage;
				}
				
				i = {
					_url: src
					, _href: href
					, _preferred: preferred || "off"
					, _stage: temp
				};
				
				// Set context menu
				createContext( i, j, handler );
			}
		}
		;
		
		if ( override )
		{
			visualizer( true, override );
			override = false;
		}
		else
		{
			return handler;
		}
		return true;
	};
	
	var compile = function ( stage )
	{
		// [img href=\"" + this.href.value + "\"]" + this.url.value + "[/img]
		var element = IDOMElement( stage )
		, props = [ "href", "preferred" ]
		
		return "[img"
			+ compileProp( element, props )
			+ "]"
			+ element.getDAttribute( "value" ) + "[/img]"
			;
	};

	// Alias
	var alias = "img";

	__static_method( image, "compile", compile );
	__const( image, "alias", alias );

	ns[ NS_EXPORT ]( EX_CLASS, "Image", image );
})();