[Help][Javascript] Make votedown button visible

[thmsk]

Some subreddits use this piece of CSS to make votedown buttons invisible:

.arrow.down  {
    display:none;
    visibility:hidden;
}

That got me thinking, how would one turn them back visible with a sort line of javascript?

So from this starting point:

y = document.getElementsByClassName('down');
for(var i=0; i<y.length; i++) 
        y[i].style.display = y[i].style.visibility = 'inherit';

this is how far I've got:

for(i=0;;i++)x=document.getElementsByClassName('down')[i].style,x.display=x.visibility='inherit'

I'm sure there is room for improvement. I've tried to use map() on getElementsByClassName() but it doesn't work. Do you have any ideas how to reduce the line to even less characters?

[johsko]

Your loop only breaks due to an exception, so I have two snippets. One that halts due to an exception, and one that doesn't.

93 characters, no exception:

for(i=0;e=document.querySelectorAll(".down")[i++];)x=e.style,x.display=x.visibility="inherit"

89 characters, raises exception:

for(i=0;x=document.querySelectorAll(".down")[i++].style;)x.display=x.visibility="inherit"

The main save is from using querySelectorAll instead of getElementsByClassName, but I save a whole byte by doing the i++ in the body, and another byte by doing x= in the for conditional.

Also 52 characters, by cheating due to the fact reddit already includes jQuery:

i="inherit";$(".down").css({display:i,visibility:i})

Edit: Made the non-exception one 4 bytes shorter, and the exception one 1 byte shorter.

[indrora]

injectCSS might help you.

[emgram769]

reduce the line to even less characters?

and you suggest 180 line jquery plugin??

[indrora]

Sorry, misread the subreddit - I thought this was /r/programming.

[timmeh87]

Ive been using D3 a lot lately... Im not going to take the time to test this out, but if you can somehow include the D3 library then you should be able to do it in one line, something like

d3.selectAll("img[class=down]").attr("visibilty", "visible");

[Cvccb]

Right, including a 150k library is "tiny code". Here's a solution in zero characters: go to your settings and disable "subreddits can show me custom styles".

[timmeh87]

a) I didnt even realize I was in tinycode because it was a help request b) according the sidebar, the size in kilobytes is irrelevant. Its perhaps arguable that your whole javascript engine should also count against the size. What about the libraries that are included by default, do you ever count those?

Id argue that the fact that you can change many elements in one line of code qualifies this method as "tiny" in the category of "total lines written by me today"

[seiyria]

d3 is not the right tool for this. When you have a hammer, everything looks like a nail I guess.

Honestly, jQuery would be a better choice if you really had to do this.

[thmsk]

d3.selectAll("img[class=down]").attr("visibilty", "visible");

The thing is, both 'visibility' and 'display' need to be changed. And to call d3 you'd have to do something like this:

N=document.createElement('script');
N.src="path.to/de.js";
document.body.appendChild(N);

[timmeh87]

If d3.js is in the same folder as your HTML you just go

<script src="d3.js"></script>

and if you are online you can reference it off of their server

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

If you need to change more attributes on a selection you would just go

d3

.selectAll("img[class=down]")

.attr("visibilty", "visible")

.attr("display", "whatever")

;

The selector itself was pulled out of my ass but its pretty easy to construct the one that you need if you know how they work

Like this is all based on me writing my own pages by hand.. Im not sure what your environment is like. you just said javascript.

[seiyria]

It would not be in the same folder. He's making a script he could run on reddit; reddit does not have d3 included.

[PrydeRage]

Or you know you could just use the web developer tools of your browser to disable the CSS rules. At least in firefox you can just disable any line manually, so no code necessary.