0

In my app i want to make some pages display on full screen. Basically this is what i want: "User cannot access the browser or computer desktop or take any other actions outside of window using the mouse".

I was trying to use this full screen API: https://www.npmjs.com/package/screenfull

I am working in html5/angular 5. I made a directive like suggested in angular example on the API page. I used the selector "toggleFullscreen" with a button (taking to next page) on for example page 3. If i want full screen on page 4 and 5. Than putting the selector on page 3 next button taking me to page 4 should make the full screen on page 4. But it is not working. Page 4 is not displayed on full screen.

I am quite new to angular. So can anybody suggest some other way to achieve this functionality in my code? I can not figure out why this API don`t work for me.

sar
  • 65
  • 1
  • 12
  • Are you asking to lock the user into doing nothing but using your app? That would be bad for so many reasons and not possible. – Mathias Sep 06 '18 at 17:33
  • Yeah that`s what i want to do. I did not set the requirement. I was told to implement this functionality like this. – sar Sep 06 '18 at 17:43
  • That would be so dangerous if they allowed it. Someone could have a webpage that locks a computer or device until you pay the ransom. – Mathias Sep 06 '18 at 18:11

1 Answers1

0
toggleFullScreen() {
        let elem =  document.body; 
        let methodToBeInvoked = elem.requestFullscreen || 
         elem.webkitRequestFullScreen || elem['mozRequestFullscreen'] 
         || 
         elem['msRequestFullscreen']; 
        if(methodToBeInvoked) methodToBeInvoked.call(elem);

    }

call this function wherever you want to trigger full screen for example on submit button click invoke this method which will load the page on full screen

Vaibhav
  • 1,481
  • 13
  • 17
  • The function do not give any errors in my code. I want to call it on this button: . But it still it don`t get full screen on clicking the button. – sar Sep 06 '18 at 18:53
  • can you create a stackbiltz example so i can work on it – Vaibhav Sep 06 '18 at 19:20