Page 1 of 2
Go Fullscreen
Posted: Thu Feb 27, 2014 11:21 am
by Danilo
Code: Select all
;
; FullScreen.sb
;
; by Danilo
;
; http://forums.spiderbasic.com/viewtopic.php?f=9&t=55
;
; SpiderBasic 1.00 Alpha 4
;
Procedure Fullscreen()
!function _RequestFullScreen() {
;!var elem = document.getElementById("SpiderBody");
!var elem = document.documentElement;
!if (elem.requestFullscreen) {
! elem.requestFullscreen();
!} else if (elem.requestFullScreen) {
! elem.requestFullScreen();
!} else if (elem.msRequestFullscreen) {
! elem.msRequestFullscreen();
!} else if (elem.msRequestFullScreen) {
! elem.msRequestFullScreen();
!} else if (elem.mozRequestFullScreen) {
! elem.mozRequestFullScreen();
!} else if (elem.mozRequestFullscreen) {
! elem.mozRequestFullscreen();
!} else if (elem.webkitRequestFullscreen) {
! elem.webkitRequestFullscreen();
!} else if (elem.webkitRequestFullScreen) {
! elem.webkitRequestFullScreen();
!} else if (elem.oRequestFullscreen) {
! elem.oRequestFullscreen();
!} else if (elem.oRequestFullScreen) {
! elem.oRequestFullScreen();
!}
!}
!_RequestFullScreen();
EndProcedure
Procedure GadgetEvents()
Select EventGadget()
Case 1
Fullscreen()
EndSelect
EndProcedure
If OpenWindow(0, 20, 20, 400, 100, "Fullscreen Demonstration")
ButtonGadget(1, 10, 10, 380, 25, "Request FullScreen (ESC to exit fullscreen mode)")
BindEvent(#PB_Event_Gadget, @GadgetEvents())
EndIf
Tested with IE 11, Chrome 33, FireFox 26+27, Opera 19
Please note:
Browsers have a check nowadays to prevent this fullscreen requests right after
the page is loaded. It would be annoying for the user when websites go
fullscreen randomly/automatically, without asking the user first.
So most browsers have a built-in check to prevent this. Make a button for
the user to switch to fullscreen, and it should work after this user action.
Re: Go Fullscreen
Posted: Fri Feb 28, 2014 7:45 pm
by Alex
Hallo Danilo,
da das mit PM hier irgendwie nicht funktioniert und auch kein deutsches Forum existiert, muss ich jetzt einfach mal hier dirket antworten.
Sehe ich das richtig, dass man mit "!" direkt JS- Funktionen erstellen kann? Und geht das nur mit JS?
Gruß
Alex
Re: Go Fullscreen
Posted: Fri Feb 28, 2014 7:47 pm
by Danilo
Yep, '!' = DirectJavaScript in SB.
Re: Go Fullscreen
Posted: Fri Nov 18, 2016 11:12 am
by MrTAToad
I've extended it a bit so that fullscreen or window mode can be detected, and the ability to go back to window mode from fullscreen :
Code: Select all
;
; FullScreen.sb
;
; by Danilo
;
; http://forums.spiderbasic.com/viewtopic.php?f=9&t=55
;
; SpiderBasic 1.00 Alpha 4
;
Procedure Fullscreen()
!function _RequestFullScreen() {
!var elem = document.documentElement;
!if (elem.requestFullscreen) {
! elem.requestFullscreen();
!} else if (elem.requestFullScreen) {
! elem.requestFullScreen();
!} else if (elem.msRequestFullscreen) {
! elem.msRequestFullscreen();
!} else if (elem.msRequestFullScreen) {
! elem.msRequestFullScreen();
!} else if (elem.mozRequestFullScreen) {
! elem.mozRequestFullScreen();
!} else if (elem.mozRequestFullscreen) {
! elem.mozRequestFullscreen();
!} else if (elem.webkitRequestFullscreen) {
! elem.webkitRequestFullscreen();
!} else if (elem.webkitRequestFullScreen) {
! elem.webkitRequestFullScreen();
!} else if (elem.oRequestFullscreen) {
! elem.oRequestFullscreen();
!} else if (elem.oRequestFullScreen) {
! elem.oRequestFullScreen();
!}
!}
!_RequestFullScreen();
EndProcedure
Procedure.b IsFullScreen()
Define v
!function _IsFullScreen() {
;!var elem = document.documentElement;
! if (document.fullScreen) {
! v_v=document.fullScreen;
! } else if (document.webkitIsFullScreen) {
! v_v=document.webkitIsFullScreen;
! } else if (document.mozFullScreen) {
! v_v=document.mozFullScreen;
! } else if (document.msFullscreenEnabled) {
! v_v=document.msFullscreenEnabled;
! } else if (document.fullscreenEnabled) {
! v_v=document.fullscreenEnabled;
!}
!}
! _IsFullScreen();
ProcedureReturn v
EndProcedure
Procedure ExitFullScreen()
!function _ExitFullScreen() {
;!var elem = document.documentElement;
! if (document.exitFullscreen) {
! document.exitFullscreen();
! } else if (document.webkitExitFullscreen) {
! document.webkitExitFullscreen();
! } else if (document.mozCancelFullScreen) {
! document.mozCancelFullScreen();
! } else if (document.msExitFullscreen) {
! document.msExitFullscreen();
!}
!}
! _ExitFullScreen();
EndProcedure
Procedure GadgetEvents()
Define temp
Select EventGadget()
Case 1
Fullscreen()
Case 2
Debug IsFullScreen()
Case 3
ExitFullScreen()
Case 4
temp=IsFullScreen()
If temp
ExitFullScreen()
Else
Fullscreen()
EndIf
EndSelect
EndProcedure
If OpenWindow(0, 20, 20, 400, 130, "Fullscreen Demonstration")
ButtonGadget(1, 10, 10, 380, 25, "Request FullScreen (ESC to exit fullscreen mode)")
ButtonGadget(2, 10, 40, 380, 25, "Status")
ButtonGadget(3, 10, 70, 380, 25, "Exit fullscreen mode")
ButtonGadget(4, 10, 100, 380, 25, "Toggle fullscreen mode")
BindEvent(#PB_Event_Gadget, @GadgetEvents())
EndIf
Re: Go Fullscreen
Posted: Fri Nov 18, 2016 6:25 pm
by Fred
NIce code !
btw, there is a trick in JS to avoid all these if:
Code: Select all
var reqFullScreen = elem.requestFullscreen || elem.msRequestFullscreen || elem.mozRequestFullScreen;
if (reqFullScreen)
reqFullSreen();
Re: Go Fullscreen
Posted: Sat Nov 19, 2016 10:31 am
by MrTAToad
Good idea!
Re: Go Fullscreen
Posted: Thu Dec 15, 2016 8:08 pm
by poshu
While this code works perfectly with a button, I can't get it to work with a canvas :
Code: Select all
Procedure Fullscreen()
!function _RequestFullScreen() {
!var elem = document.documentElement;
!if (elem.requestFullscreen) {
! elem.requestFullscreen();
!} else if (elem.requestFullScreen) {
! elem.requestFullScreen();
!} else if (elem.msRequestFullscreen) {
! elem.msRequestFullscreen();
!} else if (elem.msRequestFullScreen) {
! elem.msRequestFullScreen();
!} else if (elem.mozRequestFullScreen) {
! elem.mozRequestFullScreen();
!} else if (elem.mozRequestFullscreen) {
! elem.mozRequestFullscreen();
!} else if (elem.webkitRequestFullscreen) {
! elem.webkitRequestFullscreen();
!} else if (elem.webkitRequestFullScreen) {
! elem.webkitRequestFullScreen();
!} else if (elem.oRequestFullscreen) {
! elem.oRequestFullscreen();
!} else if (elem.oRequestFullScreen) {
! elem.oRequestFullScreen();
!}
!}
!_RequestFullScreen();
EndProcedure
Procedure.b IsFullScreen()
Define v
!function _IsFullScreen() {
;!var elem = document.documentElement;
! if (document.fullScreen) {
! v_v=document.fullScreen;
! } else if (document.webkitIsFullScreen) {
! v_v=document.webkitIsFullScreen;
! } else if (document.mozFullScreen) {
! v_v=document.mozFullScreen;
! } else if (document.msFullscreenEnabled) {
! v_v=document.msFullscreenEnabled;
! } else if (document.fullscreenEnabled) {
! v_v=document.fullscreenEnabled;
!}
!}
! _IsFullScreen();
ProcedureReturn v
EndProcedure
Procedure ExitFullScreen()
!function _ExitFullScreen() {
;!var elem = document.documentElement;
! if (document.exitFullscreen) {
! document.exitFullscreen();
! } else if (document.webkitExitFullscreen) {
! document.webkitExitFullscreen();
! } else if (document.mozCancelFullScreen) {
! document.mozCancelFullScreen();
! } else if (document.msExitFullscreen) {
! document.msExitFullscreen();
!}
!}
! _ExitFullScreen();
EndProcedure
Procedure Loop()
Static button
ClearScreen($00AA00)
ExamineMouse()
If MouseButton(#PB_MouseButton_Left) And button = 0
Fullscreen()
EndIf
button = MouseButton(#PB_MouseButton_Left)
FlipBuffers()
EndProcedure
OpenScreen(400,400,32,"Fullscreen")
BindEvent(#PB_Event_RenderFrame,@Loop())
FlipBuffers()
Chrome returns "
Failed to execute 'requestFullscreen' on 'Element': API can only be initiated by a user gesture.", so I guess a click into a screen isn't a gesture? Any help?
Re: Go Fullscreen
Posted: Mon Dec 19, 2016 5:30 pm
by MrTAToad
Looks like it only works with windows. If you want a screen, you could always create a window with no border...
Re: Go Fullscreen
Posted: Tue Jul 18, 2017 7:42 pm
by MrTAToad
By the way, full screen is only available now from a "user gesture" (ie button press).
Re: Go Fullscreen
Posted: Mon Aug 10, 2020 11:53 pm
by AMpos
It didnt work in any of my apple iDevices, using Chrome, Safari or Firefox.
(it works on my Android chrome)