Tag Archives: tweet

Highlight some text – a dare ya

Today I’ve implemented a little bit of script on my site that allows you – the visitors of this site – to highlight any bit of text that you might want to tweet… and tweet it at the click of a buttons.

Go on…

Give it a go.

It’s quite a simple bit of jQuery script that activates on text highlight.

var myCopy;

function clickToCopy(){
    $(".panel").remove();
}

if(!window.Kolich){
    Kolich = {};
}

Kolich.Selector = {};
Kolich.Selector.getSelected = function(){
    var t = '';
    if(window.getSelection){
        t = window.getSelection();
    } else if(document.getSelection){
        t = document.getSelection();
    } else if(document.selection){
        t = document.selection.createRange().text;
    }
    return t;
}

Kolich.Selector.mouseup = function(event){
    st = Kolich.Selector.getSelected();
    if(st!=''){
        $("body").append("<div class='panel'><a href='http://www.twitter.com' target='_blank' id='textTweet'>Tweet this</a></div>");
        $(".panel").css({
            "left": event.pageX,
            "top": event.pageY
        });
        myCopy = "" + st;

        if(myCopy.length>100){
            var whatDiff = myCopy.length - 100;
            myCopy = myCopy.slice(0,-whatDiff);
        }

        myTweet = myCopy.replace(/\%/g,"%25").replace(/ /g, '%20').replace(/!/g,"%21").replace(/"/g,"%22").replace(/#/g,"%23").replace(/\$/g,"%26").replace(/\&/g,"%26").replace(/'/g,"%27").replace(/\(/g,"%28").replace(/\)/g,"%29").replace(/@/g,"%40");

$("#textTweet").attr("href", "http://twitter.com/home?status=" + myTweet + "...%20" + window.location.href);

    } else { $(".panel").remove();}
}

$(document).ready(function(){
    $(document).bind("mouseup", Kolich.Selector.mouseup);
});

The purpose of this is less about the what it does (and being a smart-arse)… but more an experiment in allowing visitors to better choose what they share socially (rather than the bog-standard “Share this page”-type button.

Part two of this will be to also include a “copy to clipboard” option… which also allows for better analytical tracking… but this is yet to come (watch this space).

Update: I’m also going to try and make it work a little better in instances where the selected text is longer ┬áthan the characters allowed.