I know how to enter fullscreen once it's already loaded in a window. This causes an ugly effect where, when I click its icon, briefly flashes a windowed window which immediately goes fullscreen. I hate that effect.
How do I make it actually start, right away, in fullscreen, without ever being in windowed mode even for a split second?
You just need to put fullscreen: true in your manifest: https://docs.nwjs.io/en/latest/References/Manifest%20Format/#fullscreen.
If you want more info go to https://www.w3schools.com/howto/howto_js_fullscreen.asp#:~:text=To%20open%20an%20element%20in%20fullscreen%2C%20we%20use,fullscreen%20mode%20%28a%20video%20in%20this%20example%29%3A%20%2A%2F
this would work if youre making an website
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) { /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
/* Close fullscreen */
function closeFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) { /* Safari */
document.webkitExitFullscreen();
} else if (document.msExitFullscreen) { /* IE11 */
document.msExitFullscreen();
}
}
I'm not a JS pro but I code in python and i think if you made a function like this one it would work idk though
function onstart(){
if (boolean == true):
// Fullscreen code
}
// Your code here
onstart()
Related
When the user is prompted for a permission on Safari, the video element is shown as a black rectangle with a strikethrough play button. How do I change this element's styling? Does it have a specific ID / class / tag?
I'm using Quagga JS as a barcode scanner. AFAIK Quagga creates a video element, then asks for camera permission. The optimal result would be to hide the element using display:none;, but I can't think of any way to accomplish this. I need the element to display the camera feed once the scanner has its permission, but before that it should either paint the screen black or be hidden.
I've fixed it by hiding it via JavaScript and showing it once the Quagga Feedback has finished. Note that a pure CSS solution would be much prettier.
// Hide the preview before it's fully initialised.
$('#videoBoundingBox').hide();
Quagga.init({
inputStream: {
name: "Live",
type: "LiveStream",
target: document.querySelector('#videoBoundingBox')
},
decoder: {
readers: [
"code_128_reader",
"ean_reader"
]
}
}, function (err) {
if (err) {
console.log(err);
setResult(err);
err = err.toString();
if (err.search("NotFoundError")) {
// No camera found. The user is probably in an office environment.
// Redirect to previous orders or show a background image of sorts.
} else if (err.search("NotAllowedError")) {
// The user has blocked the permission request.
// We should ask them again just to be sure or redirect them.
} else {
// Some other error.
}
return;
}
// Hide the preview before it's fully initialised.
$('#videoBoundingBox').show();
setResult("Initialization finished. Ready to start");
console.log("Initialization finished. Ready to start");
Quagga.start();
initializeQuaggaFeedback();
});
Is there any way to handle back button (device backbutton) as default functionality to move back page? I need to implement the same functionality on back button goes to previous page. If there is no previous page (first page) it exit the application. Is this possible in PhoneGap?
I also need to pop page before going to push another page is this posible in jQuery?
Checking window.location.length would be the easiest way to determine if you're on the first page, but this isn't available in Phonegap.
But since you're using JQM, you can either use the navigate event as Omar suggests or could manually count the number of pages shown and the number of pages gone back (same thing) and use this to determine if the first page is being shown and whether to exit the app. Something like this would work:
var pageHistoryCount = 0;
var goingBack = false;
$(document).bind("pageshow", function(e, data) {
if (goingBack) {
goingBack = false;
} else {
pageHistoryCount++;
console.log("Showing page #"+pageHistoryCount);
}
});
function exitApp() {
console.log("Exiting app");
navigator.app.exitApp();
}
function onPressBack(e) {
e.preventDefault();
if(pageHistoryCount > 0) pageHistoryCount--;
if (pageHistoryCount == 0) {
navigator.notification.confirm("Are you sure you want to quit?", function(result){
if(result == 2){
exitApp();
}else{
pageHistoryCount++;
}
}, 'Quit My App', 'Cancel,Ok');
} else {
goingBack = true;
console.log("Going back to page #"+pageHistoryCount);
window.history.back();
}
}
function deviceready() {
$(document).bind('backbutton', onPressBack);
}
$(document).bind('deviceready', deviceready);
As for the second part of your question:
Secondly i need to pop page before going to push another page is this
posible in jquery ?
It's not clear what you're asking here. Do you mean you want to show some kind of popup content like a dialog between every page change? Please clarify then I can help you :-)
I have the following code in Draw() in Game1. However, the Music only plays when I'm pressing the close button for the program. Where should I be putting MediaPlayer.Play() if not there? normS, fastS, slowS, and playing are all Song types. If you need me to clear anything up, just ask.
if (stateS == "normal")
{
if (!MediaPlayer.Equals(playing, normS))
{
playing = normS;
}
spriteBatch.Draw(norm, pos, Color.White);
}
else if (stateS == "fast")
{
if (!MediaPlayer.Equals(playing, fastS))
{
playing = fastS;
}
spriteBatch.Draw(fast, pos, Color.White);
}
else if (stateS == "slow")
{
if (!MediaPlayer.Equals(playing, slowS))
{
playing = slowS;
}
spriteBatch.Draw(slow, pos, Color.White);
}
MediaPlayer.Play(playing);
Is there a particular reason why you need to have the songs play out of the Draw method? Draw should be reserved for drawing things.
Like user1306322 said in the comment above, I would recommend moving the
MediaPlayer.Play(playing);
into the Update method, and wrap it in a conditional (so you dont just keep playing a new song every update, which I think is what is happening for you now since clicking and holding the Close Window x stops the updates. You could try this by dragging the window around as well):
if (!MediaPlayer.IsPlaying)
{
MediaPlayer.Play(playing);
}
If necessary, you can leave the rest of the code in Draw, but most likely this whole thing should go in Update.
edit I just realised you may not have a conditional on this because you want to be able to change the song at any time. In that case, you should set a variable to hold your "Last Song", so you can compare it in your conditional like this:
if (MediaPlayer.IsPlaying == false || playing != lastPlaying)
{
MediaPlayer.Play(playing);
}
I need help detecting and dealing with the home button being pressed on a iPhone/iPod Touch running an AIR app. I tried
NativeApplication.nativeApplication.addEventListener(KeyboardEvent.KEY_DOWN, handleKeys, false, 0, true);
function handleKeys(event:KeyboardEvent):void
{
if(event.keyCode == Keyboard.HOME) {
//do something
}
}
without luck. Any ideas? Specifically, I want to prevent the app from closing when the home button is pressed.
import flash.events.Event;
addEventListener(Event.ACTIVATE, activateListener);
addEventListener(Event.DEACTIVATE, deactivateListener);
private function activateListener(e:Event):void{
//do something when awakened
}
private function deactivateListener(e:Event):void{
//do something when home button is pressed.
}
I have an application that requires a page refresh whenever the orientation changes (ipad/iphone). Within this application, HTML5 videos also gets presented at certain times in UX. Whenever a user is viewing a video in full screen mode, their first inclination is to rotate the device to landscape orientation if it was not already in that mode. When they do this, however, it triggers the nasty page reload, effectively ending their viewing session. By tapping into webkit full screen API I was able to write logic to control this behavior, which works perfectly on Safari desktop as well as with the iPad/iPhone user agent selected in developer tools, but it DOES NOT work on the native iphone/ipad.
document.webkitIsFullScreen returns false/true correctly in console in Safari, but comes up as undefined on iphone/ipad. Can anyone tell me how to accomplish this on ipad/iphone, since these are the only devices that require this functionality anyway? Or is there a much simpler solution that I am overlooking? Any help is greatly appreciated!
$(document).ready( function () {
var video = document.getElementById('video');
var canrefresh = true;
video.addEventListener("webkitfullscreenchange",function(){
// Detects if video is in full screen mode and toggles canrefresh variable
// canrefresh = false when webkitfullscreenchange event is heard
// canrefresh = true after exiting full screen
if (canrefresh == true) {
canrefresh = false;
} else {
canrefresh = true;
}
console.log(document.webkitIsFullScreen+' | '+canrefresh);
}, false);
$(window).resize(function() {
// Look to make sure not in full screen, and canrefresh variable is true before refreshing page
if((document.webkitIsFullScreen == false) && (canrefresh == true)){
window.location = window.location.href+'?v='+Math.floor(Math.random()*1000);
}
});
console.log(document.webkitIsFullScreen+' | '+canrefresh);
$('body .test').text(document.webkitIsFullScreen+' | '+canrefresh); // document.webkitIsFullScreen is returning 'false' in Safari (correct), but 'undefined' on native iphone/ipad device
});
The equivalent property which is compatible with Mobile Safari is the webkitDisplayingFullscreen property on the HTMLVideoElement DOM object.