Statusline remains visible in full screen mode. about vimperator-labs

[gkatsev]

The maine_coon plugin should be the way to hide the statusline automatically. If it doesn't work, we should probably get that fixed.

[demokritos]

I tried the maine coon plugin. With this plugin, I couldn't put ex command.
This autohides the statusline, but it is not much different from the
javascript that I tried.
Anyway, this is not the solution because there is still a 2px white line at
bottom.

Thanks.

2014-08-19 0:36 GMT+09:00 Gary Katsevman [email protected]:

The maine_coon plugin should be the way to hide the statusline
automatically. If it doesn't work, we should probably get that fixed.

—
Reply to this email directly or view it on GitHub
#26 (comment)
.

[demokritos]

I'd like to correct '2px white line' with '1px dotted gray line'.
I found the code having to do with the line. It is ContentSeparator of Highlights.prototype.CSS on common/content/style.js.

[demokritos]

I modified the javascript from http://stackoverflow.com/questions/21053262/vimperator-autohide-statusline .
F8 key completely hides the statusline things.

"javascript to hide statusbar
noremap <silent> <F8> :js toggle_bottombar()<CR>
"noremap : :js toggle_bottombar('on')<CR>:
"noremap o :js toggle_bottombar('on')<CR>o
"noremap O :js toggle_bottombar('on')<CR>O
"noremap t :js toggle_bottombar('on')<CR>t
"noremap T :js toggle_bottombar('on')<CR>t
"noremap / :js toggle_bottombar('on')<CR>/
"cnoremap <CR> <CR>:js toggle_bottombar('off')<CR>
"cnoremap <Esc> <Esc>:js toggle_bottombar('off')<CR>
"
:js << EOF
var hl = highlight.get('ContentSeparator');
var cs_current = hl.value;
function toggle_bottombar(p) {
    var bb = document.getElementById('liberator-bottombar');
    if (!bb)
        return;
    if (p == 'on'){
        bb.style.height = '';
        bb.style.overflow = '';
        return;
    }
    if (p == 'off'){
        bb.style.height = '0px';
        bb.style.overflow = 'hidden';
        return;
    }
    bb.style.height = (bb.style.height == '') ? '0px' : '';
    bb.style.overflow = (bb.style.height == '') ? '' : 'hidden';
    if (bb.style.height == '') {
        liberator.execute('highlight ContentSeparator ' + cs_current);
    } else {
        liberator.execute('highlight ContentSeparator display: none;');
    }
}
//toggle_bottombar();
EOF

[demokritos]

Sorry for too may comments.
I made a refined version of the javascript in the above comment.
Using autocmd command, I made it possible to hide statusline when turning to fullscreen.
I would appreciate it if you could apply that to the source code.

Thanks.

set gui=none,tabs
autocmd Fullscreen .* js myObj.toggleBottombar('fullscreen')

"javascript to hide statusbar
noremap <silent> <F8> :js myObj.toggleBottombar('toggle')<CR>
noremap <silent> <F2> :js myObj.toggleNavbar()<CR>
noremap : :js myObj.toggleBottombar('neutral')<CR>:
noremap o :js myObj.toggleBottombar('neutral')<CR>o
noremap O :js myObj.toggleBottombar('neutral')<CR>O
noremap t :js myObj.toggleBottombar('neutral')<CR>t
noremap T :js myObj.toggleBottombar('neutral')<CR>t
noremap / :js myObj.toggleBottombar('neutral')<CR>/
noremap ? :js myObj.toggleBottombar('neutral')<CR>?
cnoremap <CR> <CR>:js myObj.toggleBottombar('neutral')<CR>
cnoremap <Esc> <Esc>:js myObj.toggleBottombar('neutral')<CR>

js << EOF
var myObj = {
    contentSeperatorCss : highlight.get('ContentSeparator').value,
    isFullscreen : false,
    isStatuslineOn : true,
    bottombar : document.getElementById('liberator-bottombar'),
    navbar : document.getElementById('nav-bar'),
    toggleBottombar : function(p) {
        if (!this.bottombar) return;
        if (p == 'on'){
            if (!this.isStatuslineOn) {
                this.isStatuslineOn = true;
                this.bottombar.style.height = '';
                this.bottombar.style.overflow = '';
                highlight.set('ContentSeparator', this.contentSeperatorCss);
            }
            return;
        }
        if (p == 'off'){
            if (this.isStatuslineOn) {
                this.isStatuslineOn = false;
                this.bottombar.style.height = '0px';
                this.bottombar.style.overflow = 'hidden';
                highlight.set('ContentSeparator', 'display: none;');
            }
            return;
        }
        if (p == 'neutral') {
            if (!this.isStatuslineOn) this.toggleBottombar();
            return;
        }
        if (p == 'fullscreen') {
            this.isFullscreen = !this.isFullscreen;
            if (this.isFullscreen) return this.toggleBottombar('off');
            else return this.toggleBottombar('on');
        }
        if (p == 'toggle') {
            this.isStatuslineOn = !this.isStatuslineOn;
        }
        if (this.bottombar.style.height != '') {
            this.bottombar.style.height = '';
            this.bottombar.style.overflow = '';
            highlight.set('ContentSeparator', this.contentSeperatorCss);
        } else {
            this.bottombar.style.height = '0px';
            this.bottombar.style.overflow = 'hidden';
            highlight.set('ContentSeparator', 'display: none;');
        }
    },
    toggleNavbar : function() {
        if (!this.navbar) return;
        this.navbar.collapsed = !this.navbar.getAttribute('collapsed');
    }
};
EOF

[fenak]

Just got this issue today when trying to watch a Youtube HTML5 video. I made a little change on @demokritos Aug 19 code on his comment that have been working for my needs, without that awful white line with no need to hit F8.

"javascript to hide statusbar
noremap <silent> <F8> :js toggle_bottombar()<CR>
noremap : :js toggle_bottombar('on')<CR>:
noremap o :js toggle_bottombar('on')<CR>o
noremap O :js toggle_bottombar('on')<CR>O
noremap t :js toggle_bottombar('on')<CR>t
noremap T :js toggle_bottombar('on')<CR>t
noremap / :js toggle_bottombar('on')<CR>/
cnoremap <CR> <CR>:js toggle_bottombar('off')<CR>
cnoremap <Esc> <Esc>:js toggle_bottombar('off')<CR>

:js << EOF
var hl = highlight.get('ContentSeparator');
var cs_current = hl.value;

function toggle_bottombar(p) {
    var bb = document.getElementById('liberator-bottombar');
    if (!bb)
        return;
    if (p == 'on'){
        show_bottombar(bb);
        return;
    }
    if (p == 'off'){
        hide_bottombar(bb)
        return;
    }
    bb.style.height == '' ? hide_bottombar(bb) : show_bottombar(bb);
}

function show_bottombar(bb) {
    bb.style.height = '';
    bb.style.overflow = '';
    liberator.execute('highlight ContentSeparator ' + cs_current);
}

function hide_bottombar(bb) {
    bb.style.height = '0px';
    bb.style.overflow = 'hidden';
    liberator.execute('highlight ContentSeparator display: none;');
}

toggle_bottombar();
EOF

[insidewhy]

Wrote some code to add an option that tells vimperator to hide the status-line/grey-bar automatically when you enter full-screen mode, will submit the PR after I clean it up.

[insidewhy]

Here's a nice way to do it in your vimperatorrc for the meantime:

" Hide status bar when fullscreen mode is detected
autocmd Fullscreen .* js updateBottomBar()

" Re-enable bottom bar during certain commands.
noremap : :js updateBottomBar(false)<CR>:
noremap o :js updateBottomBar(false)<CR>o
noremap O :js updateBottomBar(false)<CR>O
noremap t :js updateBottomBar(false)<CR>t
noremap T :js updateBottomBar(false)<CR>t
noremap / :js updateBottomBar(false)<CR>/
cnoremap <CR> <CR>:js updateBottomBar()<CR>
cnoremap <Esc> <Esc>:js updateBottomBar()<CR>

:js << EOF

let hlContentSepValue = highlight.get('ContentSeparator').value

function updateBottomBar(close = window.fullScreen) {
  let bb = document.getElementById('liberator-bottombar')
  if (! bb) return

  if (close) {
    bb.style.height = '0px'
    bb.style.overflow = 'hidden'
    liberator.execute('highlight ContentSeparator display: none;')
  }
  else {
    bb.style.height = ''
    bb.style.overflow = ''
    liberator.execute('highlight ContentSeparator ' + hlContentSepValue)
  }
}
updateBottomBar()

EOF

This doesn't require overwriting F8 or anything, it hooks into the fullscreen event hiding and showing the status bar automatically.

[cpypcy]

Still not fixed :(

[insidewhy]

@cpypcy No big deal just add the text from the previous comment into your .vimperatorrc

[maxauthority]

If somebody can turn the JavaScripts in a nice integrated
fullscreen-handler which I can apply to the main source code, I'd be very
happy to apply it as I agree in fullscreen mode like when watching videos
we should hide the command line (at least until the user presses : to show
it temporarily but that's more of a plus and not required in the first
place).

The entry point should probably be common/content/events.js:onResize()
where we detect fullscreen changes.

Good luck,
Martin

On Thu, Feb 19, 2015 at 7:02 AM, cpypcy [email protected] wrote:

Would be nice to have some path where i can find this file.

—
Reply to this email directly or view it on GitHub
#26 (comment)
.

[demokritos]

https://github.com/demokritos/vimperator-labs/commit/55c622c231c4bcb13c122d6712b7135e9cc1191b

This is my humble code for this issue. I have used this for a long time.
You can map a key to statusline toggle by adding the following line into .vimperatorrc:

noremap <silent> <F8> :js statusline.toggle('toggle')<CR>

[maxauthority]

Thanks for the first attempt.

Instead of:
statusline.toggle(p, q)

(especially where p and q are "bad" in terms of non-descriptive
abbreviations), I would make a

statusline.updateVisibility() function which is called in the above cases
(toggling fullscreen, or entering/exiting command line mode).

and that function would just check the window.fullScreen and the mode to
determine the new visibility state.

Yes, we would loose the "manual" possibility to toggle the command line,
but is that really required? If yes, than I'd rather opt for a :set
autohide=true/false option, which would also hide the command line in
non-fullscreen mode.

On Wed, Feb 25, 2015 at 4:04 AM, Taegil Bae [email protected]
wrote:

demokritos@55c622c
https://github.com/demokritos/vimperator-labs/commit/55c622c231c4bcb13c122d6712b7135e9cc1191b

This is my humble code for this issue. I have used this for a long time.
You can map a key to statusline toggle by adding the following line into
.vimperatorrc:

noremap :js statusline.toggle('toggle')

—
Reply to this email directly or view it on GitHub
#26 (comment)
.

[insidewhy]

I'd prefer to have two APIs, one to check if the status line is visible and one to set visibility. You could easily toggle visibility by combining the APIs.

[maxauthority]

Yeah having just a setVisibility() and getVisibility() is also fine.

On Fri, Feb 27, 2015 at 12:44 PM, Nuisance of Cats <[email protected]

wrote:

I'd prefer to have two APIs, one to check if the status line is visible
and one to set visibility. You could easily toggle it then by combining the
APIs then.

—
Reply to this email directly or view it on GitHub
#26 (comment)
.

[sam113101]

@gkatsev maine_coon doesn't work, and IMO this feature should be a vimperator default.

[krasnovpro]

Line «cnoremap :js toggle_bottombar('off')» blocks command yield (like :usage).

[jgkamat]

+1 on this should be the vimperator default. A plugin shouldn't be needed for this.

[srustamo]

Line «cnoremap :js toggle_bottombar('off')» blocks command yield (like :usage).

I suppose 'blocks command yield' means that this line breaks writing into and reading ~/.vimperator/info/defaults/history-command file for completion. In my case, having this code stops this file being updated and read, if I have this code in my .vimperatorrc.

[srustamo]

Apparently, 'command yield' is a different matter, now that I checked.

So, ~/vimperator/info/defaults/history-command not being read/written is a separate issue, related to having this code in my .vimperatorrc.

Looks like this particular line is a problem:
cnoremap <CR> <CR>:js toggle_bottombar('off')<CR>

[whoizit]

So where is the best solution?

[demokritos]

pizzooid's autohide function works well, but there is no capability to hide the bottombar in non-fullscreen mode or to unhide it in fullscreen mode. This code also disables users from coding related functions in .vimperatorrc.