fabiobiondi / angular-fullscreen

AngularJS HTML5 Fullscreen
213 stars 107 forks source link

Text input doesn't work in full-screen mode #9

Closed vitaly-t closed 10 years ago

vitaly-t commented 10 years ago

I don't know how the most obvious could have escaped, but it renders the library simply unusable...

  1. On a page that has any text input control, initiate full-screen mode via this library
  2. Set focus to the edit control and try to enter something;

Edit control doesn't accept any text, except spaces. If we exit full-screen via browser and set it again, using F11, then the problem is gone.

This is a fundamental issue that prevents us from using the library completely.

Tested in: Chrome 30, 31, 32.

GabrielDelepine commented 10 years ago

Did it append to you also with other libraries ?

angular-fullscreen is just a little code who allow you to call easily the browser's api. It does nothing else so I don't think your problem come from angular-fullscreen.

What version of angular.js are you using ?

vitaly-t commented 10 years ago

I found out in the end the issue was with the WebKit, and thus Chrome: http://stackoverflow.com/questions/16266897/cant-type-any-letters-or-numbers-in-text-inputs-in-fullscreen-mode-on-webkit-br

Such browsers require that Element.ALLOW_KEYBOARD_INPUT is passed to the method.

In my code I no longer use your library, I just make the call directly:

function setFullScreen() {
    var e = document.body;
    if(e.webkitRequestFullScreen){
        e.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
    }else{
        var method = e.requestFullScreen || e.mozRequestFullScreen;
        if (method) {
            method.call(e);
        }
    }
}

Also, I'm thinking, if it is this simple, why use your library in the first place? What else does it do anyway?

fabiobiondi commented 10 years ago

Hi guys, thanx for the suggestion. I will add it.

@VitalyTomilov : Why to use it? You don't. I have create it for a real project and I just shared it. Sorry if a bothered : P

Anyway, often you only need a toggle fullscreen button and I thought it was a nice solution to avoid to write any line of code: add a button into your html, set the directive and that's all.

Furthermore, your solution is ok but doesn't support all the scenario I did. It might be ok for your project but it's not reusable especially if you use in a controller (bad practice)

GabrielDelepine commented 10 years ago

I agree with @fabiobiondi, it's very dirty to put @VitalyTomilov's function directly in the controller even if it's doing the job.

Anyway, thanks @VitalyTomilov for having reported the issue.

vitaly-t commented 10 years ago

When should we expect the fix for this?

GabrielDelepine commented 10 years ago

@VitalyTomilov & @fabiobiondi : I did a PR with the fix.

@VitalyTomilov : Can you try my fork and tell us if it's ok for you ? https://github.com/Yappli/angular-fullscreen

fabiobiondi commented 10 years ago

I have added Element.ALLOW_KEYBOARD_INPUT in element.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT); and now it perfectly works on my Chrome / Win 8.1.

Thanks a lot for the suggestion and sorry for the delay