Opening my mobile webpage from my homescreen (after adding it to my homescreen), it starts in fullscreen mode, so far so good.
After logging in (form/submitbutton), the 'app' is still in fullscreen mode, which is also the desired result.
Now, when I click a link that has the rel="external" attribute, webkit opens a new window in Safari, so it exits the fullscreen 'app' I started from my homscreen, I would like it to stay in fullscreen mode.
data-ajax="false" has te same result. Removing data-ajax="false" and rel="external" will not exit fullscreen, but this way you can't link to a multi-page document (1 document with different data-role="page").
Does anyone has the same problem, or even better, a solution?
I do not really care about the transitions, I just want the webpage to remain in fullscreen mode, (the user has to log in again when the new window has opened).
iPhone 3gs
M_webkit / 5.0.2
Why not create a script that pulls out the href and goes to the new url via javascript.
If you use jQuery it's as simple as:
$("a[rel='external']").bind("click",
function() {
if (this.href) {
location.href = this.href;
return false;
}
});
Without jquery you'll need to use object detection and attach a click event to it with the same logic inside the anonymous function above.
Related
I creating WEB GL game. Game menu is shown by the following code:
Input.GetKeyUp(KeyCode.Escape)
It works fine in unity and in the windows build. In the browser, escape pressing is intercepted by browser and the menu is not displayed.
Is it possible to make this code working in WEB GL build? What is the standart "meny button" for WEB GL games?
It should be working because
From Unity Manual webgl input : By default, Unity WebGL will process all keyboard input send to the page, regardless of whether the WebGL canvas has focus or not.
It could be that you disabled WebGLInput.captureAllKeyboardInput (Which is enabled by default) In that case just enable that and it should work.
The Escape Button is used by default for exiting fullscreen mode, maybe that's causing the issue. I would suggest to use the Input Manager ( https://docs.unity3d.com/Manual/class-InputManager.html ) and define a button using Escape as the positive button.
As #pasotee mentioned, the Escape key could be consumed already. By the Browser, as well as by the Unity Player, as for example the F1 key is used by Chrome to open the Help Tab. Escape is definitely used by the Unity Player to exit its Fullscreen mode.
So the short answer is. No, you can't.
Unity is listening to all key by default, true, but never gets the events when the upper lying application, like the browser, doesn't send it to the Canvas or the executing environment - aka the Unity3d Player doesn't send it down to your code. Or in this case, they should really fix the manual to "[..] all buttons, except Escape and browser related Hotkeys":
https://docs.unity3d.com/Manual/webgl-input.html
The long answer is, you might intercept the 'Escape' key event within JavaScript and pass a function call into the Unity Player like mentioned here:
jQuery
$(document).on('keyup',function(evt) {
if (evt.keyCode == 27) {
alert('Esc key pressed.');
}
});
https://jsfiddle.net/MQHVa/1/
Vanilla JS
var msg = document.getElementById('state-msg');
document.body.addEventListener('keypress', function(e) {
if(e.key == "Escape"){
msg.textContent += 'Escape pressed:'
}
});
https://jsfiddle.net/etcjwaf5/
And in the end you'll need this information, to call Unity from Javascript:
SendMessage('MyGameObject', 'MyFunction');
SendMessage('MyGameObject', 'MyFunction', 5);
SendMessage('MyGameObject', 'MyFunction', 'MyString');
https://docs.unity3d.com/Manual/webgl-interactingwithbrowserscripting.html
And the very last thing is to have a GameObject in your loaded Scene that provides the function for doing, whatever you desired to be done.
Bare in mind, that if you don't cancel distribution of the Escape key event it will be send to the UnityPlayer which triggers it to exit fullscreen mode! And you might not be able to prevent Unity from consuming this event anyway, so remember WebGLInput.captureAllKeyboardInput member.
I'm working on a FB canvas app using Flash with 3D graphics. I must embed my SWF with param wmode="direct".
According to FB documentation, when using wmode="direct", FB hides the flash object when displaying a popup/dialog (buy credits, chat, notifications, etc.) and after the popup close, it shows the flash again.
On Chrome and Firefox it works, but on IE, after the dialog closes I checked the flash element style and I saw that visibility=visible, but still the flash is still hidden!
I tried several approaches, all with same result:
Not using "hideFlashCallback" on FB.init (let FB do it
automatically)
Using "hideFlashCallback":
function onFlashHide(params) {
if (params.state == 'opened') {
hideFlash();
FB.Canvas.hideFlashElement(params.elem);
} else if (params.state == 'closed') {
showFlash();
FB.Canvas.showFlashElement(params.elem);
}
}
function hideFlash() {
$('#flashContent').css('visibility', 'hidden');
}
function showFlash() {
$('#flashContent').css('visibility', 'visible');
}
Thanks!
Roei
UPDATE:
Another reference to FB documentation: http://developers.facebook.com/docs/appsonfacebook/tutorial/#flash
I had the same problem with IE when calling the FB.ui functions. The Facebook dialog would open, but when closed Flash would not come back.
I found a trick which solves this. Before calling to the FB functions, use javascript to set focus to a different HTML element. After that, the Flash object became visible again when I was done with the Facebook dialog.
// IE9 has a problem where the Flash object won't regain
// focus if it has focus when the FB UI is called. To fix this,
// We'll redirect focus before the call.
var lFocus = document.getElementById('focus_target');
lFocus.focus();
Hope this helps.
Have you tried using display: none; and display:block instead of visibility: hidden and visibility: visible? In past projects I have noticed that IE sometimes has trouble with the visibility CSS property...
I'm working on a webapp for iPad. What I want is provide a "save & quit" option. When the user presses the quit button, I safely update my database and show a screen who thanks the user for using the webapp.
What I want to do now is actually close the webapp. As window.close(); doesn't seems to work I have found a workaround with links.
Clicking on a link in a webapp closes the fullscreen app and opens safari. So far I tried to embed an hidden link in my mage and trigger it with link.onclick(); but it doesn't work, and document.location= doesn't open safari.
Here's the HTML example:
<body onload="leave();">
Modifications saved, goodbye!
<a id="goodbye" href="www.mahsite.com" style="display:none;"> </a>
And the JS:
function leave() {
window.close();//Doesn't work
window.setTimeout(function e(){document.getElementById('goodbye').onclick();},1000);
return true;
}
Can someone give me an idea? I'm aware that the onclick() won't work unless I have a onclick handler attached to my link, but I don't have any other idea.
Try
self.close();
or
self.window.close();
I am building a web page and I have included Facebook's Like button. Works great in all browsers but not in Firefox. When clicked in Firefox, it creates an endless loop of opening and closing a facebook login window. This is a known issue that Facebook isn't looking like it will correct anytime soon.
Can anyone tell me what code I might write to hide the like button (or a div containing the like button) from Firefox only? I've never written code to detect a browser and then have my site function a certain way. Not a javascript guru here. Thanks!
You can do this using the navigator javascript object, but it sounds like you have deeper problems if the facebook like button is causing an endless loop of window loads. You most probably have other errors in your code. The button should work fine in firefox.
Here's how to text for firefox using the navigator object,
if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)){
// user using firefox
}
This code parses the userAgent string, the string that defines the user's browser, of the navigator object. It looks for a string of the format Firefox/x.x or Firefox x.x.
This should work for you
<div id="likeDiv">
my div
</div>
<script>
if (navigator.userAgent.indexOf("Firefox")!=-1)
{
// Remove the element from the dom
var Node1 = document.getElementById('likeDiv');
Node1.removeChild(Node1.childNodes[0]);
}
</script>
Hope this helps
I have an iPhone webapp that uses a cache manifest to work offline. I add the webapp to my home screen, use it (say scroll to a certain location on a page), then go back to homescreen.
When I open the app again, for a brief moment I see where I used to be (at that scrolled location on that page), but then the app "reloads" and I get scrolled to the top of the mainpage. Is there a way to prevent this "reloading"? This happens even in airplane mode (ie everything is working off the cache).
You're just seeing the default startup image, which is just a screenshot of the last place you were at. It's not "reloading"; the app wasn't loaded to begin with.
Search for "apple-touch-startup-image" to set a real loading image.
What I'm struggling with here is that the app actually seems to stay "in memory" longer if I use regular Safari as opposed to running in "apple-mobile-web-app-capable" mode. In the later case something as simple as pressing the home button, then task-switching back to the app causes a reload. Doing the same thing just in Safari often does not reload. So I'm worse off by using "apple-mobile-web-app-capable".
I don't believe there is a real 'reload' event. onload and onunload are all we get.
the onload handler starts up as if it is your first time coming to the page.
the onunload handler is the key to clearing out old content.
I like to provide alternate content for people who are coming back to my web app.
window.onunload=function(){
document.getElementsByTagName('body')[0].className+=' unloading'
}
And let the CSS do the dirty work to hide most of the body and show alternate content.
(this answer does not rely on jQuery or other frameworks)
// on load
window.scroll(0,0);
To ensure no old content is displayed while launching I use this in my page:
window.addEventListener('unload', function() { $('body').hide(); } );
Thus the last state of the page is empty and is what is shown to the user when the page is opened again.