What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 127 Stack Exchange communities.

This question already has an answer here:

Frequently I've found it necessary to highlight an entire code block (usually to copy elsewhere):

here is code
here is more code
here be dragons

but the only way to do it seems to be to highlight the block by dragging across the whole thing.

I've been through many of the feature requests mentioning this missing feature (usually under the heading "copy all/copy to clipboard"), but I haven't (yet) seen an actual implementation.

Since SO doesn't presently have this functionality, has anyone written a GreaseMonkey/browser extension/magic stylesheet/etc. to add it? If not, I may try my hand at it and post that as an answer.

share|improve this question

marked as duplicate by Asad, hims056, Andrew's a Unitato, animuson, Toon Krijthe Mar 1 '13 at 8:18

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

    
@Asad: (i) I'm actually looking for a "select all" button (I have useful things I can do just with selected text using text services), and (ii) that other question contains no implementations that I can see (which I am specifically asking for). –  nneonneo Mar 1 '13 at 5:07
1  
I'm not asking for a copy button! I just want select all :) From there it is trivial to copy, or manipulate with text services. –  nneonneo Mar 1 '13 at 5:09
add comment

2 Answers

EDIT : I found this userscript that fits your description pretty well. It shows a small "Select" link at the corner of code block that can be used to select its contents.


Here you go. Looks kind of ugly (I just stick a button after the pre element), but I'll leave the CSSing to you:

// ==UserScript==
// @name           Copyall
// @namespace      http://example.com
// @include        http://stackoverflow.com/*
// @include        http://serverfault.com/*
// @include        http://superuser.com/*
// @include        http://meta.stackoverflow.com/*
// @include        http://meta.serverfault.com/*
// @include        http://meta.superuser.com/*
// @include        http://stackapps.com/*
// @include        http://*.stackexchange.com/*
// @include        http://askubuntu.com/*
// @include        http://meta.askubuntu.com/*
// @include        http://answers.onstartups.com/*
// @include        http://meta.answers.onstartups.com/*
// @include        http://mathoverflow.net/*
// @include        http://area51.stackexchange.com/proposals/*
// ==/UserScript==

$('pre:has(code)').each(function(){

    //using the XBrowser function from http://stackoverflow.com/questions/985272/
    function selectText(element) {
        var doc = document
            , text = element
            , range, selection
        ;    
        if (doc.body.createTextRange) { //ms
            range = doc.body.createTextRange();
            range.moveToElementText(text);
            range.select();
        } else if (window.getSelection) { //all others
            selection = window.getSelection();        
            range = doc.createRange();
            range.selectNodeContents(text);
            selection.removeAllRanges();
            selection.addRange(range);
        }
    }

    var input = $("<input type='button' value='Select all'/>"),
        that = this;
    input.click(function(){
        selectText($('code',that)[0]);
    });
    $(this).after(input);
});
share|improve this answer
    
Hm, doesn't seem to work (either here or on SO)... –  nneonneo Mar 1 '13 at 5:33
    
@nneonneo It didn't work on SO, because the @include only specified meta (I've added other sites now). It should have worked on Meta, provided you installed it as a GM script –  Asad Mar 1 '13 at 5:38
    
I changed the @include to http://*.stackoverflow.com/*, which I assumed would work. –  nneonneo Mar 1 '13 at 5:39
    
OK, working now. Probably me "correcting" the script wrong :P –  nneonneo Mar 1 '13 at 5:40
    
@Asad - A humble request: Please add the script in stackapps.com. (Add all your scripts there if possible) So that I can directly install it on single click (I am too lazy to install script) :-) –  hims056 Mar 1 '13 at 5:44
1  
@hims056 I was about to follow your suggestion, but I actually found a much better implementation of this here –  Asad Mar 1 '13 at 6:02
add comment

I took @Asad's code and modified it a bit to suit my style. It needs a little tweaking, but it looks a bit nicer (according to my own odd sense :)

// ==UserScript==
// @name           Copyall
// @namespace      http://example.com
// @include        http://stackoverflow.com/*
// @include        http://serverfault.com/*
// @include        http://superuser.com/*
// @include        http://meta.stackoverflow.com/*
// @include        http://meta.serverfault.com/*
// @include        http://meta.superuser.com/*
// @include        http://stackapps.com/*
// @include        http://*.stackexchange.com/*
// @include        http://askubuntu.com/*
// @include        http://meta.askubuntu.com/*
// @include        http://answers.onstartups.com/*
// @include        http://meta.answers.onstartups.com/*
// @include        http://mathoverflow.net/*
// @include        http://area51.stackexchange.com/proposals/*
// ==/UserScript==

var sheet = document.createElement('style')
sheet.innerHTML = (".neon_selectall_wrap { position: relative; }" +
".neon_selectall { float:right; position:absolute; top:0px; right:0px; font-family: sans-serif; color: #cccccc; }" +
".neon_selectall:hover { color: #00c; cursor: pointer; }");
document.body.appendChild(sheet);

$('pre:has(code)').each(function(){

    //using the XBrowser function from http://stackoverflow.com/questions/985272/
    function selectText(element) {
        var doc = document
            , text = element
            , range, selection
        ;    
        if (doc.body.createTextRange) { //ms
            range = doc.body.createTextRange();
            range.moveToElementText(text);
            range.select();
        } else if (window.getSelection) { //all others
            selection = window.getSelection();        
            range = doc.createRange();
            range.selectNodeContents(text);
            selection.removeAllRanges();
            selection.addRange(range);
        }
    }

    var input = $('<div class="neon_selectall">Select all</div>'),
        that = this;
    input.click(function(){
        selectText($('code',that)[0]);
    });
    $(this).wrap('<div class="neon_selectall_wrap">').after(input);
});

The main change is making the link into a little div that floats at the top-right:

enter image description here

share|improve this answer
    
There is already a userscript that does this. See this link –  Asad Mar 1 '13 at 6:18
    
Yup, saw it. Both are good, but I happen to like this one that we made :) –  nneonneo Mar 1 '13 at 6:19
add comment

Not the answer you're looking for? Browse other questions tagged .