Change the page "The application has gone off-line. Please try again later."

Michel_Bujardet · January 16, 2015, 11:16pm

It is possible to customize the message “The application has gone off-line. Please try again later.” that appears when the app has quit.

What about the icon ? Is there a way to replace the exclamation point in the triangle ?

I tried to put a showURL in the session close event, to no avail.

Greg_O_Lone · January 16, 2015, 11:57pm

You can’t. That layout is delivered to the browser when it first connects. The idea is that the page needs to be there if the browser can’t communicate with the app. When that happens this page is displayed.

Phillip_Zedalis · January 16, 2015, 11:59pm

I concur we need a feature request to alter some of the parameters that are initially sent. Alternatively it would be nice if there was a hard coded URL if the app goes down they are redirected to that URL.

Jay_Madren · January 18, 2015, 2:56am

You could just rewrite the html using ExecuteJavascript. And unlike most of the app, these elements always have the same ids (XojoDisconnectCaption, XojoDisconnectIcon). Something like this in the Session.Open event:

Me.ExecuteJavascript("document.getElementById('XojoDisconnectCaption').innerHTML='App has gone bye bye!';") Me.ExecuteJavascript("document.getElementById('XojoDisconnectIcon').innerHTML=""<img src='/path/to/image.jpg' width='133' height='134'>"";")

Michel_Bujardet · January 18, 2015, 11:07am

[quote=160183:@Jay Madren]You could just rewrite the html using ExecuteJavascript. And unlike most of the app, these elements always have the same ids (XojoDisconnectCaption, XojoDisconnectIcon). Something like this in the Session.Open event:

Me.ExecuteJavascript("document.getElementById('XojoDisconnectCaption').innerHTML='App has gone bye bye!';") Me.ExecuteJavascript("document.getElementById('XojoDisconnectIcon').innerHTML=""<img src='/path/to/image.jpg' width='133' height='134'>"";")[/quote]

The message can be changed in the IDE, but your method allows to place a custom icon. This is brilliant, Jay. Thank you so much

Jay_Madren · January 18, 2015, 1:31pm

True, but that’s all you can do is change the text. Using my method you can change its styling or pretty much anything else, e.g.

Me.ExecuteJavascript("document.getElementById('XojoDisconnectCaption').innerHTML='<span style=color:red>App has gone <b>bye bye</b>!</span>';")

Of course, you could also override the style in a CSS block that you add to the app HTMLHeader, but this way keeps everything in one place for easier maintenance.

Michel_Bujardet · January 18, 2015, 1:44pm

[quote=160227:@Jay Madren]@Michel Bujardet The message can be changed in the IDE
True, but that’s all you can do is change the text. Using my method you can change its styling or pretty much anything else, e.g.[/quote]

Right. I just realized it a few minutes ago, while implementing it.

Your method allowed me to display the reload symbol (Clockwise Open Circle Arrow) ? :

Me.ExecuteJavascript("document.getElementById('XojoDisconnectCaption').innerHTML='Please reload &#x21BB;';")

Thanks

Hal_Gumbert · November 8, 2015, 8:52pm

[quote=160183:@Jay Madren]You could just rewrite the html using ExecuteJavascript. And unlike most of the app, these elements always have the same ids (XojoDisconnectCaption, XojoDisconnectIcon). Something like this in the Session.Open event:

Me.ExecuteJavascript("document.getElementById('XojoDisconnectCaption').innerHTML='App has gone bye bye!';") Me.ExecuteJavascript("document.getElementById('XojoDisconnectIcon').innerHTML=""<img src='/path/to/image.jpg' width='133' height='134'>"";")[/quote]

That method worked great in Safari, but not in Chrome.

Michel_Bujardet · November 8, 2015, 9:49pm

Here is a cleaner implementation, that specifically changes the path and not the entire div html content :

[code] Me.ExecuteJavascript(“document.getElementById(‘XojoDisconnectCaption’).innerHTML=‘App has gone bye bye!’;”)
dim js as string
js = js + "var pic =document.getElementById(‘XojoDisconnectIcon’).getElementsByTagName(‘img’); "
js = js + “pic[0].src=‘https://www.gravatar.com/avatar/75608edb42341356890a08b227d55148?d=identicon&s=64’;”

Me.ExecuteJavascript(js)[/code]

Hal_Gumbert · November 8, 2015, 10:47pm

Thanks Michel,

Just tried that code and it worked just as well on Safari and Firefox too. Chrome still resorted to the hazard icon. Chrome must be fighting the update…

Michel_Bujardet · November 8, 2015, 10:59pm

[quote=227598:@Hal Gumbert]Thanks Michel,

Just tried that code and it worked just as well on Safari and Firefox too. Chrome still resorted to the hazard icon. Chrome must be fighting the update…[/quote]

I tested it here on Chrome before posting. to make sure it works. Strange.

Could you look in Developer Tools (View menu) the exact content of XojoDisconnectIcon ? It is within XojoOverlay/XojoDisconnect.

If you could copy it and post here, that would help debug the issue.

I could not find a way for that, but here is a way to entirely replace the disconnect page by whatever HTML you want .

Add a constant named bye containing the HTML code of the page you want to display
In Open, put this :

me.ExecuteJavaScript("document.getElementById('XojoDisconnect').innerHTML='"+replaceall(bye,EndOfLine,"")+"';")

Hal_Gumbert · November 8, 2015, 11:01pm

So, I just changed the url to a base64 string like “data:image/png;base64,iVBORw0KGgoAAAANSU…MYk5QeqFAEM2wbG3i” and it works in Chrome, Safari and Firefox!

Hal_Gumbert · November 8, 2015, 11:03pm

The tags looked like this even when changed using the javascript code…

[code]

Xanadu has gone offline.

[/code]

Hal_Gumbert · November 8, 2015, 11:05pm

Honestly, using base64 is better as it can be embedded in the app rather than an external file…

Michel_Bujardet · November 8, 2015, 11:06pm

[quote=227606:@Hal Gumbert]The tags looked like this even when changed using the javascript code…

[code]

Xanadu has gone offline.

[/code][/quote]

That is not right. The javascript should have explicitly changed the src. What you have here is what “show page source” displays.

The actual Dom content is in Developer Tools.

Michel_Bujardet · November 8, 2015, 11:10pm

It is a nice workaround, but it still does not explain the fluke.

Michel_Bujardet · November 8, 2015, 11:30pm

[quote=227606:@Hal Gumbert]The tags looked like this even when changed using the javascript code…

[code]

Xanadu has gone offline.

[/code][/quote]

Here is a possible improvement to your method. This uses the king.png picture that was dragged into the project :

[code] dim pic as picture = king
dim mb as memoryblock = pic.GetData(Picture.FormatPNG)
dim js as string
js = js + “var pic =document.getElementById(‘XojoDisconnectIcon’).getElementsByTagName(‘img’); "
js = js + “pic[0].src='data:image/png;base64,”+encodebase64(mb.stringvalue(0,mb.Size),0)+”’;"

Me.ExecuteJavascript(js)[/code]

Hal_Gumbert · November 9, 2015, 9:04pm

That worked great Michel! Thank you!

And after looking at View --> Developer --> Developer Tools, I could see the updated html!

Ralph_Alvy · May 17, 2016, 6:34pm

Where in the IDE can I change the text string for XojoDisconnectCaption? I looked in Session.Constants but don’t see it there.

Michel_Bujardet · May 17, 2016, 7:33pm

It is in the App. inspector ; Web settings, DisconnectMessage.