Goyslop/4chan-x
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Better ux for header bar hiding.

Browse Source
This commit is contained in:
Nicolas Stepien 2013-02-11 16:54:03 +01:00
parent d4b5ef0307
commit a70b1ee739
3 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
4chan_x.user.js
View File

@ -43,7 +43,7 @@
*/ */
(function() { (function() {
var $, $$, Anonymize, ArchiveLink, AutoGIF, Board, Build, Clone, Conf, Config, DeleteLink, DownloadLink, FileInfo, Filter, Get, Header, ImageHover, Main, Menu, Notification, Post, QuoteBacklink, QuoteCT, QuoteInline, QuoteOP, QuotePreview, Quotify, Recursive, Redirect, ReplyHiding, ReportLink, RevealSpoilers, Sauce, Settings, Thread, ThreadHiding, ThreadUpdater, Time, UI, d, g, _base, var $, $$, Anonymize, ArchiveLink, AutoGIF, Board, Build, Clone, Conf, Config, DeleteLink, DownloadLink, FileInfo, Filter, Get, Header, ImageHover, Main, Menu, Notification, Post, QuoteBacklink, QuoteCT, QuoteInline, QuoteOP, QuotePreview, Quotify, Recursive, Redirect, ReplyHiding, ReportLink, RevealSpoilers, Sauce, Settings, Thread, ThreadHiding, ThreadUpdater, Time, UI, d, g,
__indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }, __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; },
__hasProp = {}.hasOwnProperty, __hasProp = {}.hasOwnProperty,
__extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }; __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
@ -587,7 +587,7 @@
MINUTE: 1000 * 60, MINUTE: 1000 * 60,
HOUR: 1000 * 60 * 60, HOUR: 1000 * 60 * 60,
DAY: 1000 * 60 * 60 * 24, DAY: 1000 * 60 * 60 * 24,
log: typeof (_base = console.log).bind === "function" ? _base.bind(console) : void 0, log: console.log.bind(console),
engine: /WebKit|Presto|Gecko/.exec(navigator.userAgent)[0].toLowerCase(), engine: /WebKit|Presto|Gecko/.exec(navigator.userAgent)[0].toLowerCase(),
id: function(id) { id: function(id) {
return d.getElementById(id); return d.getElementById(id);
@ -929,7 +929,7 @@
}); });
toggleBar = $.el('div', { toggleBar = $.el('div', {
id: 'toggle-header-bar', id: 'toggle-header-bar',
title: 'Toggle the header bar.' title: 'Toggle the header bar position.'
}); });
$.on(toggleBar, 'click', this.toggleBar); $.on(toggleBar, 'click', this.toggleBar);
$.prepend(headerBar, [menuButton, boardListButton, $.tn(' '), boardTitle, boardList, toggleBar]); $.prepend(headerBar, [menuButton, boardListButton, $.tn(' '), boardTitle, boardList, toggleBar]);
@ -967,9 +967,13 @@
return $('.board-list', headerEl).hidden = !showBoardList; return $('.board-list', headerEl).hidden = !showBoardList;
}, },
toggleBar: function() { toggleBar: function() {
var bool; var isAutohiding;
bool = $.id('header-bar').classList.toggle('autohide'); if (isAutohiding = $.id('header-bar').classList.toggle('autohide')) {
return $.set('autohideHeaderBar', bool); new Notification('info', 'The header bar will automatically hide itself.', 2);
} else {
new Notification('info', 'The header bar will remain visible.', 2);
}
return $.set('autohideHeaderBar', isAutohiding);
}, },
menuToggle: function(e) { menuToggle: function(e) {
return Header.menu.toggle(e, this, g); return Header.menu.toggle(e, this, g);
@ -2979,8 +2983,8 @@
return $.add(this.nodes.info, container); return $.add(this.nodes.info, container);
}, },
getContainer: function(id) { getContainer: function(id) {
var _base1; var _base;
return (_base1 = this.containers)[id] || (_base1[id] = $.el('span', { return (_base = this.containers)[id] || (_base[id] = $.el('span', {
className: 'container' className: 'container'
})); }));
} }

2
lib/$.coffee
View File

@ -17,7 +17,7 @@ $.extend $,
HOUR : 1000 * 60 * 60 HOUR : 1000 * 60 * 60
DAY : 1000 * 60 * 60 * 24 DAY : 1000 * 60 * 60 * 24
# XXX http://code.google.com/p/phantomjs/issues/detail?id=522 # XXX http://code.google.com/p/phantomjs/issues/detail?id=522
log: console.log.bind? console log: console.log.bind console
engine: /WebKit|Presto|Gecko/.exec(navigator.userAgent)[0].toLowerCase() engine: /WebKit|Presto|Gecko/.exec(navigator.userAgent)[0].toLowerCase()
id: (id) -> id: (id) ->
d.getElementById id d.getElementById id

9
src/features.coffee
View File

@ -32,7 +32,7 @@ Header =
toggleBar = $.el 'div', toggleBar = $.el 'div',
id: 'toggle-header-bar' id: 'toggle-header-bar'
title: 'Toggle the header bar.' title: 'Toggle the header bar position.'
$.on toggleBar, 'click', @toggleBar $.on toggleBar, 'click', @toggleBar
$.prepend headerBar, [menuButton, boardListButton, $.tn(' '), boardTitle, boardList, toggleBar] $.prepend headerBar, [menuButton, boardListButton, $.tn(' '), boardTitle, boardList, toggleBar]
@ -62,8 +62,11 @@ Header =
$('.board-list', headerEl).hidden = !showBoardList $('.board-list', headerEl).hidden = !showBoardList
toggleBar: -> toggleBar: ->
bool = $.id('header-bar').classList.toggle 'autohide' if isAutohiding = $.id('header-bar').classList.toggle 'autohide'
$.set 'autohideHeaderBar', bool new Notification 'info', 'The header bar will automatically hide itself.', 2
else
new Notification 'info', 'The header bar will remain visible.', 2
$.set 'autohideHeaderBar', isAutohiding
menuToggle: (e) -> menuToggle: (e) ->
Header.menu.toggle e, @, g Header.menu.toggle e, @, g