/// <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) { //#region introOnce //var introOnce = new Cookie("intro"); //if (!introOnce.BooleanValue) //{ // var canvas = new ApplicationCanvas(); // canvas.TriggerOnClick = false; // canvas.Background = Brushes.Transparent; // canvas.AnimationAllWhite += // delegate // { // Native.Document.body.style.backgroundColor = JSColor.None; // }; // canvas.AnimationCompleted += // delegate // { // ScriptCoreLib.JavaScript.Extensions.AvalonExtensions.ToHTMLElement( // canvas // ).Orphanize(); // introOnce.BooleanValue = true; // }; // canvas.AttachToContainer(Native.Document.body); // canvas.AutoSizeTo(Native.Document.body); //} //else //{ Native.Document.body.style.backgroundColor = JSColor.None; //} //#endregion //canvas.AutoSizeTo(page.ContentSize); page.HiddenContent.ToggleVisible(); //page.SubHeader.innerText = Native.Window.unescape(Native.Document.location.pathname); #region AtEdit Func<Action> AtEdit = delegate { page.Edit.ToggleVisible(); var Control = new IHTMLDiv(); Control.AttachToDocument(); var Content = page.Content.innerHTML; page.Content.Clear(); var Editor = new TextEditor(Control); Editor.InnerHTML = Content; Editor.IsFadeEnabled = false; TextEditor.ToolbarButton SaveChanges = null; SaveChanges = Editor.AddButton( new RTA_save(), "Save Changes And Refresh", delegate { var xml = Editor.InnerHTML; // android seems to use this xml = xml.Replace(" ", " "); SaveChanges.Button.disabled = true; service.SaveChanges( Native.window.unescape(Native.Document.location.pathname), XElement.Parse("<div>" + xml + "</div>"), delegate { // refresh // does not work for hash tags //Native.Document.location = Native.Document.location; Native.Document.location.replace( Native.window.unescape(Native.Document.location.pathname) ); } ); } ); Editor.BottomToolbarContainer.Add( SaveChanges.Control ); return delegate { Editor.Control.Orphanize(); page.Content.innerHTML = Content; page.Edit.ToggleVisible(); }; }; #endregion #region Edit.onclick page.Edit.onclick += delegate { Native.window.history.pushState( data: "", title: "edit", url: "#edit" ); var revert = AtEdit(); Native.window.window.onpopstate += e => { if (revert != null) { revert(); } revert = null; }; }; #endregion #region onhashchange Native.window.onhashchange += e => { Console.WriteLine(new { onhashchange = new { e.newURL, e.oldURL } }); if (e.newURL.EndsWith("#edit")) { AtEdit(); } }; #endregion if (Native.Document.location.hash == "#edit") AtEdit(); //page.Fullscreen.onclick += // delegate // { // Native.Document.body.requestFullscreen(); // }; var UpdatedRevisionNumber = page.RevisionNumber.innerText; new Timer( delegate { service.CountItems( Native.window.unescape(Native.Document.location.pathname), RevisionNumber => { UpdatedRevisionNumber = "Revision " + RevisionNumber; } ); } ).StartInterval(5000); new Timer( tt => { if (page.RevisionNumber.innerText != UpdatedRevisionNumber) { if (tt.Counter % 2 == 0) { page.RevisionNumber.style.color = JSColor.Red; return; } } page.RevisionNumber.style.color = JSColor.Gray; } ).StartInterval(300); page.Header.style.cursor = IStyle.CursorEnum.pointer; page.Header.style.textDecoration = "underline"; page.Header.onclick += delegate { Native.Document.location.replace( Native.window.unescape(Native.Document.location.pathname) ); }; page.RevisionNumber.style.cursor = IStyle.CursorEnum.pointer; page.RevisionNumber.style.textDecoration = "underline"; page.RevisionNumber.onclick += delegate { Native.Document.location.replace( Native.window.unescape(Native.Document.location.pathname) ); }; @"Wiki".ToDocumentTitle(); }
/// <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) { Func<Action> AtEdit = delegate { page.Edit.ToggleVisible(); var Control = new IHTMLDiv(); Control.AttachToDocument(); var Content = page.Content.innerHTML; page.Content.Clear(); var Editor = new TextEditor(Control); Editor.InnerHTML = Content; Editor.IsFadeEnabled = false; TextEditor.ToolbarButton SaveChanges = null; SaveChanges = Editor.AddButton( new RTA_save(), "Save Changes And Refresh", delegate { Console.WriteLine("Save Changes And Refresh ... "); SaveChanges.Button.disabled = true; this.SaveChanges( Native.Document.location.pathname, XElement.Parse("<div>" + Editor.InnerHTML + "</div>"), delegate { // refresh // does not work for hash tags //Native.Document.location = Native.Document.location; var href = Native.Document.location.ToString().TakeUntilIfAny("#") ; Console.WriteLine("Save Changes And Refresh ... done! " + new { href }); Native.Document.location.replace(href); } ); } ); Editor.BottomToolbarContainer.Add( SaveChanges.Control ); return delegate { Editor.Control.Orphanize(); page.Content.innerHTML = Content; page.Edit.ToggleVisible(); }; }; page.Edit.onclick += delegate { Native.window.history.pushState( data: "", title: "edit", url: "#edit" ); var revert = AtEdit(); Native.window.window.onpopstate += e => { if (revert != null) { revert(); } revert = null; }; }; if (Native.Document.location.hash == "#edit") AtEdit(); //page.Fullscreen.onclick += // delegate // { // Native.Document.body.requestFullscreen(); // }; }
/// <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) { // localStorage not available on android webview! //E/Web Console( 3751): Uncaught TypeError: Cannot set property '20130329 Hello world' of null at http://192.168.1.107:25459/view-source:32300 FormStyler.AtFormCreated = FormStylerLikeFloat.LikeFloat; new GrayPatternBackground.HTML.Images.FromAssets.background().ToDocumentBackground(); Console.WriteLine("serial 57770"); "My Notez (loading...)".ToDocumentTitle(); service.AtPendingActions += count => { if (service.ServicePending.ElapsedMilliseconds > 500) { if (service.ServicePending.ElapsedMilliseconds > 4000) { "My Notez (offline)".ToDocumentTitle(); return; } "My Notez (pending)".ToDocumentTitle(); return; } "My Notez".ToDocumentTitle(); }; Native.window.onbeforeunload += e => { if (service.ServicePending.IsRunning) e.Text = "The changes made here have not yet made it to the server."; }; var storage = new MyLocalStorage { AtRemove = x => service.remove_LocalStorage(x), AtSetItem = (key, value) => { service.set_LocalStorage(key, value); } }; Console.WriteLine("Do we have localStorage? [2]"); Native.window.localStorage.With( localStorage => { Console.WriteLine("This browser has localStorage. Lets sync with that. [2]"); for (uint i = 0; i < localStorage.length; i++) { var key = localStorage.key(i); var value = localStorage[key]; storage[key] = value; } // jsc why aint ths working? //storage.AtRemove += localStorage.removeItem; storage.AtRemove += key => localStorage.removeItem(key); storage.AtSetItem += (key, value) => { localStorage[key] = value; }; } ); #region done Action done = delegate { var hh = new HorizontalSplit { Minimum = 0.05, Maximum = 0.95, Value = 0.4, }; hh.Container.AttachToDocument(); hh.Container.style.position = IStyle.PositionEnum.absolute; hh.Container.style.left = "0px"; hh.Container.style.top = "0px"; hh.Container.style.right = "0px"; hh.Container.style.bottom = "0px"; hh.Split.Splitter.style.backgroundColor = "rgba(0,0,0,0.0)"; //var vv = new VerticalSplit var f = new Form { StartPosition = FormStartPosition.Manual, SizeGripStyle = SizeGripStyle.Hide, Text = "Entries" }; var f1 = new Form { StartPosition = FormStartPosition.Manual, SizeGripStyle = SizeGripStyle.Hide, Text = "My Files" }; f1.Show(); var f2 = new Form { StartPosition = FormStartPosition.Manual, SizeGripStyle = SizeGripStyle.Hide, Text = "..." }; f2.Show(); var w = new WebBrowser { Dock = DockStyle.Fill }; w.GetHTMLTarget().name = "viewer"; w.AttachTo(f2); w.Navigating += delegate { f2.Text = "Navigating"; }; w.Navigated += delegate { if (w.Url.ToString() == "about:blank") { f2.Text = "..."; return; } //ff.Text = w.DocumentTitle; f2.Text = Native.window.unescape( w.Url.ToString().SkipUntilLastIfAny("/").TakeUntilLastIfAny(".") ); }; Native.window.requestAnimationFrame += delegate { var layout = new Abstractatech.JavaScript.FileStorage.HTML.Pages.App(); layout.Container.AttachTo(f1.GetHTMLTargetContainer()); Abstractatech.JavaScript.FileStorage.ApplicationContent.Target = w.GetHTMLTarget().name; new Abstractatech.JavaScript.FileStorage.ApplicationContent( layout, service.service ); }; var LeftScrollable = new IHTMLDiv { className = "SidebarForButtons" }.AttachTo(f.GetHTMLTargetContainer()); LeftScrollable.style.backgroundColor = "white"; var CreateNew = new IHTMLButton { innerText = "+ create new", className = "SidebarButton" }.AttachTo( LeftScrollable ); var ff = new Form { StartPosition = FormStartPosition.Manual, SizeGripStyle = SizeGripStyle.Hide }; f.Show(); ff.Show(); //var text = new TextEditor(hh.Split.RightScrollable); var text = new TextEditor(ff.GetHTMLTargetContainer()); text.ContainerForBorders.style.border = ""; text.Control.style.position = IStyle.PositionEnum.absolute; text.Control.style.left = "0px"; text.Control.style.top = "0px"; text.Control.style.right = "0px"; text.Control.style.bottom = "0px"; //Native.Window.onresize += // delegate // { // var TopToolbarHeight = text.TopToolbar.clientHeight; // //Console.WriteLine(new { TopToolbarHeight }); // text.DesignerContainer.style.top = (TopToolbarHeight + 4) + "px"; // text.SourceContainer.style.top = (TopToolbarHeight + 4) + "px"; // }; #region DesignerContainer text.DesignerContainer.style.position = IStyle.PositionEnum.absolute; text.DesignerContainer.style.left = "0px"; text.DesignerContainer.style.top = "3em"; text.DesignerContainer.style.right = "0px"; text.DesignerContainer.style.bottom = "3em"; text.DesignerContainer.style.height = ""; text.Frame.style.position = IStyle.PositionEnum.absolute; text.Frame.style.left = "0px"; text.Frame.style.top = "0px"; //text.Frame.style.right = "0px"; //text.Frame.style.bottom = "0px"; text.Frame.style.width = "100%"; text.Frame.style.height = "100%"; #endregion #region SourceContainer text.SourceContainer.style.position = IStyle.PositionEnum.absolute; text.SourceContainer.style.left = "0px"; text.SourceContainer.style.top = "3em"; text.SourceContainer.style.right = "0px"; text.SourceContainer.style.bottom = "3em"; text.SourceContainer.style.height = ""; text.TextArea.style.position = IStyle.PositionEnum.absolute; text.TextArea.style.left = "0px"; text.TextArea.style.top = "0px"; //text.Frame.style.right = "0px"; //text.Frame.style.bottom = "0px"; text.TextArea.style.width = "100%"; text.TextArea.style.height = "100%"; #endregion text.BottomToolbarContainer.style.position = IStyle.PositionEnum.absolute; text.BottomToolbarContainer.style.left = "0px"; text.BottomToolbarContainer.style.right = "0px"; text.BottomToolbarContainer.style.bottom = "0px"; var oldtitle = ""; Action DoRefresh = delegate { }; #region DoCreateNew Action DoCreateNew = delegate { oldtitle = ""; #region default text var now = DateTime.Now; var yyyy = now.Year; var mm = now.Month; var dd = now.Day; var yyyymmdd = yyyy + mm.ToString().PadLeft(2, '0') + dd.ToString().PadLeft(2, '0'); string header = yyyymmdd + @" New Header " + storage.Keys.Count(); text.InnerHTML = @" <div><font face='Verdana' size='5' color='#0000fc'>" + header + @"</font></div><div><br /></div><blockquote style='margin: 0 0 0 40px; border: none; padding: 0px;'></blockquote><font face='Verdana'>This is your content.</font> "; #endregion DoRefresh(); }; CreateNew.onclick += delegate { DoCreateNew(); }; #endregion var buttons = new List<IHTMLButton>(); Action EitherCreateNewOrSelectFirst = delegate { if (buttons.Count == 0) { DoCreateNew(); } else { if (buttons.Any(k => k.innerText == oldtitle)) { //already selected } else { oldtitle = buttons.First().innerText; text.InnerHTML = storage[oldtitle]; } } }; #region Remove this document var remove = text.AddButton(null, "Remove this document", delegate { var button = buttons.FirstOrDefault(k => k.innerText == oldtitle); if (button == null) return; //Native.Window.localStorage.removeItem(button.innerText); storage.Remove(button.innerText); button.Orphanize(); buttons.Remove(button); EitherCreateNewOrSelectFirst(); } ); #endregion IHTMLElement remove_element = remove; remove_element.style.Float = IStyle.FloatEnum.right; text.BottomToolbar.appendChild(remove_element); #region new_SidebarButton Func<IHTMLButton> new_SidebarButton = delegate { var button = new IHTMLButton { className = "SidebarButton" }.AttachTo( LeftScrollable ); button.onclick += delegate { oldtitle = ""; text.InnerHTML = storage[button.innerText]; DoRefresh(); }; button.oncontextmenu += e => { e.preventDefault(); storage.Remove(button.innerText); button.Orphanize(); buttons.Remove(button); EitherCreateNewOrSelectFirst(); }; buttons.Add(button); return button; }; #endregion #region DoRefresh DoRefresh = delegate { // what has changed // text not default anymore? // title change? // document unloaded? if (text.Document == null) return; var xml = text.Document.body.AsXElement(); // script: error JSC1000: No implementation found for this native method, please implement [static System.String.IsNullOrWhiteSpace(System.String)] xml.Elements().FirstOrDefault(k => !string.IsNullOrWhiteSpace(k.Value)).With( TitleElement => { // take no action for no title if (string.IsNullOrWhiteSpace(TitleElement.Value)) return; // is there a buttn with old title? var button = buttons.FirstOrDefault( k => { if (oldtitle == "") { return k.innerText == TitleElement.Value; } return k.innerText == oldtitle; } ); if (button == null) { button = new_SidebarButton(); } button.innerText = TitleElement.Value; buttons.WithEach( x => x.setAttribute("data-active", x == button) ); if (oldtitle != "") { if (oldtitle != TitleElement.Value) storage.Remove(oldtitle); } ff.Text = TitleElement.Value; // src="http://192.168.1.100:5763/ var innerHTML = text.InnerHTML; var href = Native.Document.location.href.TakeUntilLastOrEmpty("/"); // keep only relative paths to current host var xinnerHTML = innerHTML.Replace("src=\"" + href + "/", "src=\"/"); if (innerHTML != xinnerHTML) { text.InnerHTML = xinnerHTML; } storage[TitleElement.Value] = xinnerHTML; oldtitle = TitleElement.Value; //Console.WriteLine("TitleElement: " + TitleElement.Value); } ); // whats the title? }; #endregion foreach (var button_text in storage.Keys) { new_SidebarButton().innerText = button_text; } new ScriptCoreLib.JavaScript.Runtime.Timer( t => { DoRefresh(); } ).StartInterval(500); EitherCreateNewOrSelectFirst(); #region AtResize Action AtResize = delegate { Native.Document.getElementById("feedlyMiniIcon").Orphanize(); Native.Document.body.style.minWidth = ""; //if (ff.GetHTMLTarget().parentNode == null) //{ // Native.Window.scrollTo(0, 0); // f.MoveTo(8, 8).SizeTo(Native.Window.Width - 16, Native.Window.Height - 16); // return; //} //if (f.GetHTMLTarget().parentNode == null) //{ // Native.Window.scrollTo(0, 0); // ff.MoveTo(8, 8).SizeTo(Native.Window.Width - 16, Native.Window.Height - 16); // return; //} //if (Native.Window.Width < 1024) //{ // Native.Document.body.style.minWidth = (Native.Window.Width * 2) + "px"; // f.MoveTo(8, 8).SizeTo(Native.Window.Width - 16, Native.Window.Height - 16); // ff.MoveTo(Native.Window.Width + 8, 8).SizeTo(Native.Window.Width - 16, Native.Window.Height - 16); // // already scrolled... // if (w.Url.ToString() != "about:blank") // // docked? // if (ff.GetHTMLTarget().parentNode != null) // Native.Window.scrollTo(ff.Left - 8, ff.Top - 8); // return; //} f.MoveTo(16, 16).SizeTo(hh.LeftContainer.clientWidth - 32, Native.window.Height / 3 - 16 - 4); f1.MoveTo(16, Native.window.Height / 3 + 4).SizeTo(hh.LeftContainer.clientWidth - 32, Native.window.Height / 3 - 8); f2.MoveTo(16, Native.window.Height / 3 * 2 + 4).SizeTo(hh.LeftContainer.clientWidth - 32, Native.window.Height / 3 - 16); ff.MoveTo( Native.window.Width - hh.RightContainer.clientWidth + 16 , 16).SizeTo(hh.RightContainer.clientWidth - 32, Native.window.Height - 32); //Console.WriteLine("LeftContainer " + new { hh.LeftContainer.clientWidth }); //Console.WriteLine("RightContainer " + new { hh.RightContainer.clientWidth }); }; hh.ValueChanged += delegate { AtResize(); }; Native.window.onresize += delegate { AtResize(); }; Native.window.requestAnimationFrame += delegate { AtResize(); }; #endregion ff.PopupInsteadOfClosing(SpecialNoMovement: true, NotifyDocked: AtResize); f.PopupInsteadOfClosing(SpecialNoMovement: true, NotifyDocked: AtResize); f1.PopupInsteadOfClosing(SpecialNoMovement: true, NotifyDocked: AtResize); f2.PopupInsteadOfClosing(SpecialNoMovement: true, NotifyDocked: AtResize); }; #endregion var tt = default(ScriptCoreLib.JavaScript.Runtime.Timer); Action done_timeout = delegate { if (done == null) return; tt.Stop(); done(); done = null; }; service.get_LocalStorage( //add_localStorage: (key, value) => Native.Window.localStorage[key] = value, add_localStorage: (key, value) => { // what if we are resuming from offline edit. // merge? // keep the one we got from localStorage, because it has longer entry? if (storage[key].Length > value.Length) return; storage[key] = value; }, done: done_timeout ); // either server responds in 2000 or we consider us offline... tt = new ScriptCoreLib.JavaScript.Runtime.Timer( delegate { done_timeout(); } ); tt.StartTimeout(3000); }