Change $.hide & $.show by using the hidden attribute.
This commit is contained in:
Nicolas Stepien
parent
2d36343534
commit
c336c080c5
@ -354,10 +354,10 @@
|
||||
return root.parentNode.replaceChild(el, root);
|
||||
},
|
||||
hide: function(el) {
|
||||
return el.style.display = 'none';
|
||||
return el.hidden = true;
|
||||
},
|
||||
show: function(el) {
|
||||
return el.style.display = '';
|
||||
return el.hidden = false;
|
||||
},
|
||||
addClass: function(el, className) {
|
||||
return el.className += ' ' + className;
|
||||
@ -984,7 +984,7 @@
|
||||
threads: [],
|
||||
getThread: function(full) {
|
||||
var bottom, i, rect, thread, _len, _ref;
|
||||
nav.threads = $$('div.thread:not([style])');
|
||||
nav.threads = $$('div.thread:not([hidden])');
|
||||
_ref = nav.threads;
|
||||
for (i = 0, _len = _ref.length; i < _len; i++) {
|
||||
thread = _ref[i];
|
||||
@ -1054,7 +1054,7 @@
|
||||
var arr, checked, description, dialog, hiddenNum, hiddenThreads, hidingul, html, input, key, li, link, main, obj, overlay, ul, _i, _j, _k, _len, _len2, _len3, _ref, _ref2, _ref3, _ref4;
|
||||
hiddenThreads = $.getValue("hiddenThreads/" + g.BOARD + "/", {});
|
||||
hiddenNum = Object.keys(g.hiddenReplies).length + Object.keys(hiddenThreads).length;
|
||||
html = " <div class='reply dialog'> <div id=optionsbar> <div id=floaty> <a name=main>main</a> | <a name=flavors>sauce</a> | <a name=time>time</a> | <a name=keybinds>keybinds</a> </div> <div id=credits> <a href=http://chat.now.im/x/aeos>support throd</a> | <a href=https://github.com/aeosynth/4chan-x/issues>github</a> | <a href=http://userscripts.org/scripts/show/51412>uso</a> | <a href=https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=2DBVZBUAM4DHC&lc=US&item_name=Aeosynth¤cy_code=USD&bn=PP%2dDonationsBF%3abtn_donate_LG%2egif%3aNonHosted>donate</a> </div> </div> <hr> <div id=content> <div id=main> </div> <textarea style='display: none;' name=flavors id=flavors>" + ($.config('flavors')) + "</textarea> <div style='display: none;' id=time> <div><input type=text name=time value='" + ($.config('time')) + "'> <span id=timePreview></span></div> <table> <caption>Format specifiers <a href=http://en.wikipedia.org/wiki/Date_%28Unix%29#Formatting>(source)</a></caption> <tbody> <tr><th>Specifier</th><th>Description</th><th>Values/Example</th></tr> <tr><td>%a</td><td>weekday, abbreviated</td><td>Sat</td></tr> <tr><td>%A</td><td>weekday, full</td><td>Saturday</td></tr> <tr><td>%b</td><td>month, abbreviated</td><td>Jun</td></tr> <tr><td>%B</td><td>month, full length</td><td>June</td></tr> <tr><td>%d</td><td>day of the month, zero padded</td><td>03</td></tr> <tr><td>%H</td><td>hour (24 hour clock) zero padded</td><td>13</td></tr> <tr><td>%I (uppercase i)</td><td>hour (12 hour clock) zero padded</td><td>02</td></tr> <tr><td>%m</td><td>month, zero padded</td><td>06</td></tr> <tr><td>%M</td><td>minutes, zero padded</td><td>54</td></tr> <tr><td>%p</td><td>upper case AM or PM</td><td>PM</td></tr> <tr><td>%P</td><td>lower case am or pm</td><td>pm</td></tr> <tr><td>%y</td><td>two digit year</td><td>00-99</td></tr> </tbody> </table> </div> <div style='display: none;' id=keybinds> <table> <tbody> <tr><th>Actions</th><th>Keybinds</th></tr> <tr><td>Close Options or QR</td><td><input type=text name=close></td></tr> <tr><td>Quick spoiler</td><td><input type=text name=spoiler></td></tr> <tr><td>Open QR with post number inserted</td><td><input type=text name=openQR></td></tr> <tr><td>Open QR without post number inserted</td><td><input type=text name=openEmptyQR></td></tr> <tr><td>Submit post</td><td><input type=text name=submit></td></tr> <tr><td>Select next reply</td><td><input type=text name=nextReply ></td></tr> <tr><td>Select previous reply</td><td><input type=text name=previousReply></td></tr> <tr><td>See next thread</td><td><input type=text name=nextThread></td></tr> <tr><td>See previous thread</td><td><input type=text name=previousThread></td></tr> <tr><td>Jump to the next page</td><td><input type=text name=nextPage></td></tr> <tr><td>Jump to the previous page</td><td><input type=text name=previousPage></td></tr> <tr><td>Jump to page 0</td><td><input type=text name=zero></td></tr> <tr><td>Open thread in current tab</td><td><input type=text name=openThread></td></tr> <tr><td>Open thread in new tab</td><td><input type=text name=openThreadTab></td></tr> <tr><td>Expand thread</td><td><input type=text name=expandThread></td></tr> <tr><td>Watch thread</td><td><input type=text name=watch></td></tr> <tr><td>Hide thread</td><td><input type=text name=hide></td></tr> <tr><td>Expand selected image</td><td><input type=text name=expandImages></td></tr> <tr><td>Expand all images</td><td><input type=text name=expandAllImages></td></tr> <tr><td>Update now</td><td><input type=text name=update></td></tr> </tbody> </table> </div> </div> </div> ";
|
||||
html = " <div class='reply dialog'> <div id=optionsbar> <div id=floaty> <a name=main>main</a> | <a name=flavors>sauce</a> | <a name=time>time</a> | <a name=keybinds>keybinds</a> </div> <div id=credits> <a href=http://chat.now.im/x/aeos>support throd</a> | <a href=https://github.com/aeosynth/4chan-x/issues>github</a> | <a href=http://userscripts.org/scripts/show/51412>uso</a> | <a href=https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=2DBVZBUAM4DHC&lc=US&item_name=Aeosynth¤cy_code=USD&bn=PP%2dDonationsBF%3abtn_donate_LG%2egif%3aNonHosted>donate</a> </div> </div> <hr> <div id=content> <div id=main> </div> <textarea name=flavors id=flavors hidden>" + ($.config('flavors')) + "</textarea> <div id=time hidden> <div><input type=text name=time value='" + ($.config('time')) + "'> <span id=timePreview></span></div> <table> <caption>Format specifiers <a href=http://en.wikipedia.org/wiki/Date_%28Unix%29#Formatting>(source)</a></caption> <tbody> <tr><th>Specifier</th><th>Description</th><th>Values/Example</th></tr> <tr><td>%a</td><td>weekday, abbreviated</td><td>Sat</td></tr> <tr><td>%A</td><td>weekday, full</td><td>Saturday</td></tr> <tr><td>%b</td><td>month, abbreviated</td><td>Jun</td></tr> <tr><td>%B</td><td>month, full length</td><td>June</td></tr> <tr><td>%d</td><td>day of the month, zero padded</td><td>03</td></tr> <tr><td>%H</td><td>hour (24 hour clock) zero padded</td><td>13</td></tr> <tr><td>%I (uppercase i)</td><td>hour (12 hour clock) zero padded</td><td>02</td></tr> <tr><td>%m</td><td>month, zero padded</td><td>06</td></tr> <tr><td>%M</td><td>minutes, zero padded</td><td>54</td></tr> <tr><td>%p</td><td>upper case AM or PM</td><td>PM</td></tr> <tr><td>%P</td><td>lower case am or pm</td><td>pm</td></tr> <tr><td>%y</td><td>two digit year</td><td>00-99</td></tr> </tbody> </table> </div> <div id=keybinds hidden> <table> <tbody> <tr><th>Actions</th><th>Keybinds</th></tr> <tr><td>Close Options or QR</td><td><input type=text name=close></td></tr> <tr><td>Quick spoiler</td><td><input type=text name=spoiler></td></tr> <tr><td>Open QR with post number inserted</td><td><input type=text name=openQR></td></tr> <tr><td>Open QR without post number inserted</td><td><input type=text name=openEmptyQR></td></tr> <tr><td>Submit post</td><td><input type=text name=submit></td></tr> <tr><td>Select next reply</td><td><input type=text name=nextReply ></td></tr> <tr><td>Select previous reply</td><td><input type=text name=previousReply></td></tr> <tr><td>See next thread</td><td><input type=text name=nextThread></td></tr> <tr><td>See previous thread</td><td><input type=text name=previousThread></td></tr> <tr><td>Jump to the next page</td><td><input type=text name=nextPage></td></tr> <tr><td>Jump to the previous page</td><td><input type=text name=previousPage></td></tr> <tr><td>Jump to page 0</td><td><input type=text name=zero></td></tr> <tr><td>Open thread in current tab</td><td><input type=text name=openThread></td></tr> <tr><td>Open thread in new tab</td><td><input type=text name=openThreadTab></td></tr> <tr><td>Expand thread</td><td><input type=text name=expandThread></td></tr> <tr><td>Watch thread</td><td><input type=text name=watch></td></tr> <tr><td>Hide thread</td><td><input type=text name=hide></td></tr> <tr><td>Expand selected image</td><td><input type=text name=expandImages></td></tr> <tr><td>Expand all images</td><td><input type=text name=expandAllImages></td></tr> <tr><td>Update now</td><td><input type=text name=update></td></tr> </tbody> </table> </div> </div> </div> ";
|
||||
dialog = $.el('div', {
|
||||
id: 'options',
|
||||
innerHTML: html
|
||||
@ -1104,11 +1104,10 @@
|
||||
$.bind(input, 'keydown', options.cb.keybind);
|
||||
}
|
||||
/*
|
||||
https://bugzilla.mozilla.org/show_bug.cgi?id=579776
|
||||
position:fixed and position:absolute shouldn't turn display:-moz-box into display:block
|
||||
Two parent divs are necessary to center on all browsers.
|
||||
|
||||
to harmonize, position:fixed and display:-moz-box have to be set on different elements -
|
||||
#overlay and #options, respectively.
|
||||
Only one when Firefox and Opera will support flexboxes correctly.
|
||||
https://bugzilla.mozilla.org/show_bug.cgi?id=579776
|
||||
*/
|
||||
overlay = $.el('div', {
|
||||
id: 'overlay'
|
||||
@ -1513,7 +1512,7 @@
|
||||
}
|
||||
},
|
||||
toggle: function(thread) {
|
||||
if (thread.className.indexOf('stub') !== -1 || thread.style.display === 'none') {
|
||||
if (thread.className.indexOf('stub') !== -1 || thread.hidden) {
|
||||
return threadHiding.show(thread);
|
||||
} else {
|
||||
return threadHiding.hide(thread);
|
||||
@ -2559,14 +2558,14 @@
|
||||
_results = [];
|
||||
for (_i = 0, _len = thumbs.length; _i < _len; _i++) {
|
||||
thumb = thumbs[_i];
|
||||
_results.push(!thumb.style.display ? imgExpand.expand(thumb) : void 0);
|
||||
_results.push(!thumb.hidden ? imgExpand.expand(thumb) : void 0);
|
||||
}
|
||||
return _results;
|
||||
} else {
|
||||
_results2 = [];
|
||||
for (_j = 0, _len2 = thumbs.length; _j < _len2; _j++) {
|
||||
thumb = thumbs[_j];
|
||||
_results2.push(thumb.style.display ? imgExpand.contract(thumb) : void 0);
|
||||
_results2.push(thumb.hidden ? imgExpand.contract(thumb) : void 0);
|
||||
}
|
||||
return _results2;
|
||||
}
|
||||
@ -2592,7 +2591,7 @@
|
||||
toggle: function(a) {
|
||||
var thumb;
|
||||
thumb = a.firstChild;
|
||||
if (thumb.style.display) {
|
||||
if (thumb.hidden) {
|
||||
return imgExpand.contract(thumb);
|
||||
} else {
|
||||
return imgExpand.expand(thumb);
|
||||
|
||||
@ -235,9 +235,9 @@ $.extend $,
|
||||
replace: (root, el) ->
|
||||
root.parentNode.replaceChild el, root
|
||||
hide: (el) ->
|
||||
el.style.display = 'none'
|
||||
el.hidden = true
|
||||
show: (el) ->
|
||||
el.style.display = ''
|
||||
el.hidden = false
|
||||
addClass: (el, className) ->
|
||||
el.className += ' ' + className
|
||||
removeClass: (el, className) ->
|
||||
@ -717,7 +717,7 @@ nav =
|
||||
threads: []
|
||||
|
||||
getThread: (full) ->
|
||||
nav.threads = $$ 'div.thread:not([style])'
|
||||
nav.threads = $$ 'div.thread:not([hidden])'
|
||||
for thread, i in nav.threads
|
||||
rect = thread.getBoundingClientRect()
|
||||
{bottom} = rect
|
||||
@ -795,8 +795,8 @@ options =
|
||||
<div id=content>
|
||||
<div id=main>
|
||||
</div>
|
||||
<textarea style='display: none;' name=flavors id=flavors>#{$.config 'flavors'}</textarea>
|
||||
<div style='display: none;' id=time>
|
||||
<textarea name=flavors id=flavors hidden>#{$.config 'flavors'}</textarea>
|
||||
<div id=time hidden>
|
||||
<div><input type=text name=time value='#{$.config 'time'}'> <span id=timePreview></span></div>
|
||||
<table>
|
||||
<caption>Format specifiers <a href=http://en.wikipedia.org/wiki/Date_%28Unix%29#Formatting>(source)</a></caption>
|
||||
@ -817,7 +817,7 @@ options =
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div style='display: none;' id=keybinds>
|
||||
<div id=keybinds hidden>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr><th>Actions</th><th>Keybinds</th></tr>
|
||||
@ -876,11 +876,10 @@ options =
|
||||
$.bind input, 'keydown', options.cb.keybind
|
||||
|
||||
###
|
||||
https://bugzilla.mozilla.org/show_bug.cgi?id=579776
|
||||
position:fixed and position:absolute shouldn't turn display:-moz-box into display:block
|
||||
Two parent divs are necessary to center on all browsers.
|
||||
|
||||
to harmonize, position:fixed and display:-moz-box have to be set on different elements -
|
||||
#overlay and #options, respectively.
|
||||
Only one when Firefox and Opera will support flexboxes correctly.
|
||||
https://bugzilla.mozilla.org/show_bug.cgi?id=579776
|
||||
###
|
||||
overlay = $.el 'div', id: 'overlay'
|
||||
$.append overlay, dialog
|
||||
@ -1222,7 +1221,7 @@ threadHiding =
|
||||
threadHiding.show thread
|
||||
|
||||
toggle: (thread) ->
|
||||
if thread.className.indexOf('stub') != -1 or thread.style.display is 'none'
|
||||
if thread.className.indexOf('stub') != -1 or thread.hidden
|
||||
threadHiding.show thread
|
||||
else
|
||||
threadHiding.hide thread
|
||||
@ -1926,11 +1925,11 @@ imgExpand =
|
||||
imgExpand.on = @checked
|
||||
if imgExpand.on #expand
|
||||
for thumb in thumbs
|
||||
unless thumb.style.display #thumbnail hidden, image already expanded
|
||||
unless thumb.hidden #thumbnail hidden, image already expanded
|
||||
imgExpand.expand thumb
|
||||
else #contract
|
||||
for thumb in thumbs
|
||||
if thumb.style.display #thumbnail hidden - unhide it
|
||||
if thumb.hidden #thumbnail hidden - unhide it
|
||||
imgExpand.contract thumb
|
||||
typeChange: (e) ->
|
||||
switch @value
|
||||
@ -1946,7 +1945,7 @@ imgExpand =
|
||||
|
||||
toggle: (a) ->
|
||||
thumb = a.firstChild
|
||||
if thumb.style.display
|
||||
if thumb.hidden
|
||||
imgExpand.contract thumb
|
||||
else
|
||||
imgExpand.expand thumb
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user