/// <summary>
        /// This is a javascript application.
        /// </summary>
        /// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
        public Application(IApp page)
        {
            var l = new NotificationLayout().layout;

            l.AttachToDocument();

            var div0 = new IHTMLDiv().AttachToDocument();

            new { }.With(
                async delegate
                {

                    do
                    {
                        div0.Clear();

                        new IHTMLHorizontalRule().AttachToDocument();

                        Task<ISVGSVGElement> n = l;

                        var svg = await n;

                        IHTMLImage i = svg;

                        var c = new CanvasRenderingContext2D(l.clientWidth, l.clientHeight);
                        c.drawImage(i, 0, 0, l.clientWidth, l.clientHeight);
                        c.canvas.AttachTo(div0);
                    }
                    while (await l.async.onmutation);

                }
            );
        }

		public UltraApplication(IHTMLElement e)
		{
			var Title = new IHTMLDiv
				{
					innerHTML = @"
<img border='0' src='http://www.w3schools.com/images/compatible_ie.gif' width='31' height='30' alt='Internet Explorer' title='Internet Explorer' />
<img border='0' src='http://www.w3schools.com/images/compatible_firefox.gif' width='31' height='30' alt='Firefox' title='Firefox' />
<img border='0' src='http://www.w3schools.com/images/compatible_opera.gif' width='28' height='30' alt='Opera' title='Opera' />
<img border='0' src='http://www.w3schools.com/images/compatible_chrome.gif' width='31' height='30' alt='Google Chrome' title='Google Chrome' />
<img border='0' src='http://www.w3schools.com/images/compatible_safari.gif' width='28' height='30' alt='Safari' title='Safari' />
"
				};


			var TitleLogo = new IHTMLImage("assets/ScriptCoreLib/jsc.png");
			var TitleText = new IHTMLSpan("UltraApplication");
			TitleText.style.fontFamily = ScriptCoreLib.JavaScript.DOM.IStyle.FontFamilyEnum.Verdana;
			TitleText.style.paddingLeft = "2em";
			TitleText.style.fontSize = "xx-large";
			TitleLogo.style.verticalAlign = "middle";


			Title.appendChild(TitleLogo);
			Title.appendChild(TitleText);

			Title.style.height = "128px";

			Title.AttachToDocument();
			Title.FadeIn(2500, 1000,
				delegate
				{
					1500.AtDelay(ContinueBuildingApplication);
				}
			);
		}

        /// <summary>
        /// This is a javascript application.
        /// </summary>
        /// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
        public Application(IApp page)
        {
            // http://stackoverflow.com/questions/2297217/ie-8-defaultview-equivalent
            // https://developer.mozilla.org/en-US/docs/Web/API/document.defaultView
            // http://www.whatwg.org/specs/web-apps/current-work/#dom-document-defaultview
            // http://stackoverflow.com/questions/9183555/whats-the-point-of-document-defaultview

            {

                var div = new IHTMLDiv { innerText = "?" }.AttachToDocument();

                // http://msdn.microsoft.com/en-us/library/ms534331%28VS.85%29.aspx
                var defaultView = (div.ownerDocument as dynamic).defaultView;

                div.innerText = new { defaultView }.ToString();
            }


          { 

                var div = new IHTMLDiv { innerText = "?" }.AttachToDocument();

                // http://msdn.microsoft.com/en-us/library/ms534331%28VS.85%29.aspx
                var parentwindow = (div.ownerDocument as dynamic).parentwindow;

                div.innerText = new { parentwindow }.ToString();
            }


        }

		private static void Spawn(double Rotation)
		{

			var z = new IHTMLDiv().AttachToDocument();
			var r = new IHTMLDiv().AttachTo(z);
			z.style.position = IStyle.PositionEnum.relative;
			var i = new IHTMLImage(Assets.Path + "/Preview.png").AttachTo(r);

			var b = new IHTMLButton().AttachTo(r);

			b.innerText = "hello world";
			b.style.SetLocation(20, 20);
			z.style.SetLocation(100, 100);


			var costheta = Math.Cos(Rotation);
			var sintheta = Math.Sin(Rotation);

			var M11 = costheta;
			var M12 = -sintheta;
			var M21 = sintheta;
			var M22 = costheta;


			z.style.SetMatrixTransform(
					M11, M21,
						M12, M22,

					0, 0
			);
		}

        public static void AddNewCommentsDiv(this IBacicInterface intFace, IHTMLDiv newCommentDiv, IHTMLDiv commentsDiv)
        {
            RefreshComments(intFace, commentsDiv);
            var newcommentContainer = new NewComment().AttachTo(newCommentDiv);

            newcommentContainer.Submit.onclick += async delegate
            {
                if (newcommentContainer.name.value != "")
                {
                    if (newcommentContainer.email.value != "")
                    {
                        if (newcommentContainer.commentarea.value != "")
                        {
                            await intFace.InsertNewComment(Native.document.location.hash, newcommentContainer.name.value,
                                newcommentContainer.email.value, newcommentContainer.commentarea.value);

                            intFace.RefreshComments(commentsDiv);

                            newcommentContainer.email.value = "";
                            newcommentContainer.name.value = "";
                            newcommentContainer.commentarea.value = "";
                        }
                    }
                }
            };
        }

			public XRectangle()
			{
				var aelement = new IHTMLDiv();



				// WPF: Rectangle, Image or Label
				var acontent = new IHTMLDiv();

				acontent.style.backgroundColor = "#ff0000";

				this.Rotor = new IHTMLDiv();

				//this.Rotor.style.backgroundColor = "#ffd0d0";

				this.Rotor.style.border = "1px solid black";

				//this.Rotor.style.paddingRight = "10px";

				this.Rotor.AttachTo(aelement);

				acontent.AttachTo(this.Rotor);

				aelement.AttachToDocument();

				Element = aelement;
				Content = acontent;
			}

        public RedNumberDisplay(int Digits, int value, Assets MyAssets)
        {
            this.MyAssets = MyAssets;
            this.Digits = Digits;

            this.Control.style.SetSize(Width, Height);
            this.Control.style.backgroundColor = Color.Black;
            this.Control.style.position = IStyle.PositionEnum.relative;

            DigitControls = Enumerable.Range(0, Digits).Select(
                i =>
                {
                    var d = new IHTMLDiv();

                    d.style.SetLocation(i * DigitX, 0, DigitX, DigitY);
                    d.style.SetBackground(MyAssets.red_numbers[0]);

                    d.AttachTo(this.Control);

                    return d;
                }
                ).ToArray();


            this.Value = value;
        }

		public __Shape()
		{
			InternalSprite = new IHTMLDiv();
			InternalSprite.style.position = ScriptCoreLib.JavaScript.DOM.IStyle.PositionEnum.absolute;
			InternalSprite.style.left = "0px";
			InternalSprite.style.top = "0px";
		}

        public NumberGuessingGame()
        {
            Control.AttachToDocument();

            Native.Document.body.style.background = "#6591cd";
            //Native.Document.body.style.background = "#6591cd url(assets/NumberGuessingGame/editorBg.gif) repeat-x";
            Native.Document.body.style.overflow = IStyle.OverflowEnum.hidden;

            Control.appendChild(new IHTMLElement(IHTMLElement.HTMLElementEnum.h1,
                "This project demostrates how to make a number guessing game."));

            Control.appendChild("The computer will think of a number. Try finding out which numbers are in it. You will win if you guess the numbers before all buttons are gone.");

            CreateDisposableButton("Show The GuessingGame",
                delegate
                {
                    var div = new IHTMLDiv();

                    div.AttachToDocument();

                    new GuessingGame(div);

                }
            );
        }

		public SolutionFileView()
		{
			this.Colors = new Dictionary<SolutionFileTextFragment, Color>
			{
				{ SolutionFileTextFragment.Comment, Color.FromRGB(0, 0x80, 0) },
				{ SolutionFileTextFragment.Keyword, Color.Blue },

				{ SolutionFileTextFragment.None, Color.None},

				{ SolutionFileTextFragment.String, Color.FromRGB(0x80, 0, 0) },
				{ SolutionFileTextFragment.Type, Color.FromRGB(43, 145, 175) },

				{ SolutionFileTextFragment.XMLKeyword, Color.FromRGB(0, 0, 0xff) },
				{ SolutionFileTextFragment.XMLElement, Color.FromRGB(0x80, 0, 0) },
				{ SolutionFileTextFragment.XMLAttributeName, Color.FromRGB(0xff, 0, 0) },
				{ SolutionFileTextFragment.XMLAttributeValue, Color.FromRGB(0, 0, 0xff) },
				{ SolutionFileTextFragment.XMLComment, Color.FromRGB(0, 0x80, 0) },
				{ SolutionFileTextFragment.XMLText, Color.None},

			};

			this.Container = new IHTMLDiv();

			this.View = new IHTMLPre().AttachTo(this.Container);
			this.View.style.margin = "0";

			this.Container.style.overflow = IStyle.OverflowEnum.auto;
		}

            public int Add(object e)
            {
                var i = new IHTMLDiv { innerText = e.ToString() };

                var IsSelected = false;


                i.onclick +=
                    delegate
                    {
                        IsSelected = !IsSelected;

                        if (IsSelected)
                        {
                            i.style.color = JSColor.System.HighlightText;
                            i.style.backgroundColor = JSColor.System.Highlight;
                        }
                        else
                        {
                            i.style.color = JSColor.None;
                            i.style.backgroundColor = JSColor.None;
                        }
                    };


                Owner.HTMLTarget.Add(i);

                return 0;
            }

        // https://sites.google.com/a/jsc-solutions.net/work/knowledge-base/15-dualvr/20150812/cssstereo

        // https://zproxy.wordpress.com/2012/11/13/dos-warcraft/
        // https://zproxy.wordpress.com/2015/07/14/warcraft-360/

        // jsc should do correctly uri escapes
        // \kennedy.greg%40gmail.com\warcraft\dungeon1.png



        public static void SetDialogColor(IHTMLDiv toolbar, Color toolbar_color, bool up)
        {


            if (up)
            {
                toolbar.style.backgroundColor = toolbar_color;

                var toolbar_color_light = toolbar_color.AddLum(+20);
                var toolbar_color_shadow = toolbar_color.AddLum(-20);

                toolbar.style.borderLeft = "1px solid " + toolbar_color_light;
                toolbar.style.borderTop = "1px solid " + toolbar_color_light;
                toolbar.style.borderRight = "1px solid " + toolbar_color_shadow;
                toolbar.style.borderBottom = "1px solid " + toolbar_color_shadow;
                toolbar.style.backgroundPosition = "0px 0px";
            }
            else
            {
                toolbar.style.backgroundColor = toolbar_color.AddLum(+15);

                var toolbar_color_light = toolbar_color.AddLum(+20 + 15);
                var toolbar_color_shadow = toolbar_color.AddLum(-20 + 15);

                toolbar.style.borderLeft = "1px solid " + toolbar_color_shadow;
                toolbar.style.borderTop = "1px solid " + toolbar_color_shadow;
                toolbar.style.borderRight = "1px solid " + toolbar_color_light;
                toolbar.style.borderBottom = "1px solid " + toolbar_color_light;
                toolbar.style.backgroundPosition = "1px 1px";
            }

        }

        public __RadioButton()
        {
            // http://msdn2.microsoft.com/en-us/library/system.windows.forms.radiobutton.aspx
            /* Use the Checked property to get or set the state of a RadioButton. 
             * The option button's appearance can be altered to appear as a toggle-style 
             * button or as a standard option button by setting the Appearance property.
             */

            // http://javascript.about.com/library/blradio2.htm
            /* The solution here is to give all of the radio buttons within the group 
             * the same name but different values. Here is the code used to code just 
             * radio button themselves on the previous page that shows you how this is done.
             */

            // http://www.thescripts.com/forum/thread468483.html

            // IE support
            // http://www.gtalbot.org/DHTMLSection/DynamicallyCreateRadioButtons.html

            HTMLTarget = new IHTMLDiv();
            HTMLTarget.style.whiteSpace = ScriptCoreLib.JavaScript.DOM.IStyle.WhiteSpaceEnum.nowrap;

            button = new IHTMLInput(ScriptCoreLib.Shared.HTMLInputTypeEnum.radio);
            label = new IHTMLLabel("", button);

            HTMLTarget.appendChild(button, label);
        }

        /// <summary>
        /// This is a javascript application.
        /// </summary>
        /// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
        public Application(IDefault page)
        {
        
            // see also: http://neocotic.com/qr.js/

            Action<string> Add =
                e =>
                {
                    var p = new IHTMLDiv().AttachToDocument();

                    p.style.margin = "4em";

                    new IHTMLAnchor
                    {
                        href = e,
                        innerText = e
                    }.AttachTo(p);

                    new IHTMLBreak().AttachTo(p);

                    e.ToQRCode().AttachTo(p);
                };


            Add("" + Native.document.location);
            Add("http://www.jsc-solutions.net");


        }

        public static void RefreshComments(this IBacicInterface intFace, IHTMLDiv commentDiv)
        {
            commentDiv.Clear();

            Action refresh = async delegate
            {
                var comments = await intFace.GetAllViewComments(Native.document.location.hash);
                if (comments != null)
                {
                    for (var r = 0; r < comments.Rows.Count; r++)
                    {
                        var row = (global::Abstractatech.Comments.Schema.CommentCommentTableRow)comments.Rows[r];
                        var container = new CommentRow();
                        container.name.innerText = row.Name;
                        container.email.innerText = row.Email;
                        container.time.innerText = row.Timestamp.ToString("dd.MM.yyyy HH:mm:ss");
                        container.content.style.whiteSpace = IStyle.WhiteSpaceEnum.pre;
                        container.content.innerText = row.Comment;

                        container.AttachTo(commentDiv);
                    }
                }
            };
            refresh();
        }

        public static IHTMLElement AsHTMLElement(this XElement value)
        {
            // Z:\jsc.svn\examples\javascript\Test\TestParallelConstruction\Application.cs

            //Console.WriteLine("enter AsHTMLElement");
            // X:\jsc.svn\examples\javascript\Test\TestXElementAdd\TestXElementAdd\Application.cs

            if (value == null)
                return null;

            // X:\jsc.svn\examples\javascript\appengine\StopwatchTimetravelExperiment\StopwatchTimetravelExperiment\Application.cs

            var __XElement = (__XElement)value;

            var c = new IHTMLDiv();


            var xml = value.ToString();
            //Console.WriteLine("AsHTMLElement " + new { xml });
            c.innerHTML = xml;

            //Console.WriteLine("AsHTMLElement " + new { c.innerHTML });

            var firstChild = ((IHTMLElement)c.firstChild);

            //Console.WriteLine("AsHTMLElement " + new { firstChild });

            __XElement.InternalValue = firstChild;


            //var zxml = value.ToString();
            //Console.WriteLine("AsHTMLElement " + new { zxml });

            return firstChild;
        }

        /// <summary>
        /// This is a javascript application.
        /// </summary>
        /// <param name="page">HTML document rendered by the web server which can now be enhanced.</param>
        public Application(IApp page)
        {
            // what about gif, svg, canvas and webgl?
            Native.document.icon = new fullbox();

            new IHTMLButton { "?" }.AttachToDocument().WhenClicked(
                 button =>
                 {
                     var div = new IHTMLDiv { "?" };

                     // 7x20
                     div.style.color = "red";
                     div.style.width = "16px";
                     div.style.height = "16px";

                     IHTMLImage i = div;

                     var c = new CanvasRenderingContext2D(16, 16);

                     c.drawImage(i, 0, 0, 16, 16);


                     Native.css.style.cursorImage = i;

                     // Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
                     // why wont this work?
                     Native.document.icon = c.canvas.toDataURL();


                 }
            );
        }

		static IHTMLDiv InternalConstructor(params INode[] e)
		{
			IHTMLDiv u = new IHTMLDiv();

			u.appendChild(e);

			return u;
		}

            public Part AttachTo(IHTMLDiv canvas)
            {
                MoveToLocation();

                Control.AttachTo(canvas);

                return this;
            }

        void init()
        {
            this.__ul = new IHTMLUnorderedList();

            this.__ul.name = "tabs";
            this.__ul.style.marginTop = "0";
            this.__ul.style.marginRight = "0";
            this.__ul.style.marginBottom = "-1px";
            this.__ul.style.marginLeft = "0";

            this.__ul.style.paddingTop = "0";
            this.__ul.style.paddingRight = "0";
            this.__ul.style.paddingBottom = "0.3em";
            this.__ul.style.paddingLeft = "0";

            this.__ul.style.width = "" + this.Size.Width;
            this.__ul.style.height = "" + __TAB_BAR_HEIGHT;

            this.__ul.style.Float = DOM.IStyle.FloatEnum.left;

            this.__ulContainer = new IHTMLDiv();
            this.__ulContainer.name = "ulcontainer";
            this.__ulContainer.style.width = "" + this.Size.Width;
            this.__ulContainer.style.height = "" + __TAB_BAR_HEIGHT;
            this.__ulContainer.style.position = DOM.IStyle.PositionEnum.relative;
            this.__ulContainer.style.top = "0";
            this.__ulContainer.style.bottom = "0";

            this.__ulContainer.appendChild(this.__ul);

            this.__tabFiller = new IHTMLDiv();
            this.__tabFiller.name = "filler";
            this.__tabFiller.style.height = "" + __TAB_BAR_HEIGHT;
            this.__tabFiller.style.borderBottom = "1px solid";
            this.__tabFiller.style.borderTop = "none";
            this.__tabFiller.style.borderRight = "none";
            this.__tabFiller.style.borderLeft = "none";
            this.__tabFiller.style.minWidth = "0";
            this.__tabFiller.style.Float = DOM.IStyle.FloatEnum.left;

            this.InternalContainer = new IHTMLDiv();
            this.InternalContainer.name = "tabcontrol";

            this.__tabs = new Panel();
            this.__tabs.Location = new Point(0, 0);
            this.__tabs.Size = new Size(this.Size.Width, __TAB_BAR_HEIGHT);

            setTabsSize();

            base.Controls.Add(this.__tabs);
            this.__tabs.GetHTMLTarget().appendChild(this.__ulContainer);

            this.__tabs.GetHTMLTarget().style.SetLocation(0, 0, this.Size.Width, __TAB_BAR_HEIGHT);

            _tabPages = new TabControl.TabPageCollection((TabControl)this);

            FontChanged += OnFontChanged;
        }