window.addEvent('domready', function() {

    $$('.socializer').addEvent('click', function(e) {
        e = new Event(e).stop(); // will stop the current page going to href for JS enabled browsers
        if (document.getElementById('containerx') == null) {
            
            var title = this.title;
            var url = this.href;
            // define container pos
            var top = this.getCoordinates().top.toInt();
            var height = this.getCoordinates().height.toInt();
            var left = this.getCoordinates().left.toInt() - 130;
            var pos = top + height + 5;
            var div = new Element('div');
            div.setStyle('top', pos);
            div.setStyle('left', left);
            div.addClass('soc_container');
            div.setAttribute('id', 'containerx');
            div.injectInside(document.body);

            $(div).addEvent('blur', function() {
                this.remove();
            })

            // close button
            var closeme = new Element('img');
            closeme.src = "/Media/images/close.gif";
            closeme.setAttribute('id', 'close');
            closeme.injectInside(div);
            closeme.addEvent('click', function() {
                div.remove();
            })

            var name = new Element('span');
            name.innerHTML = 'share this on:';
            name.injectInside(div);

            var left = new Element('div');
            left.addClass('soc_left');
            left.injectInside(div);

            // del.icio.us
            var img = new Element('img');
            img.alt = 'send to mixx.com';
            img.src = '/Media/images/mixx.png';
            img.injectInside(left);

            var myLink = new Element('a');
            myLink.href = 'http://www.mixx.com/submit/story?page_url=' + encodeURIComponent(url) + '&title=' + title;
            myLink.target = '_blank';
            myLink.title = 'send to mixx.com';
            myLink.innerHTML = 'mixx';
            myLink.injectInside(left);


            // del.icio.us
            var img = new Element('img');
            img.alt = 'send to del.icio.us';
            img.src = '/Media/images/delicious.png';
            img.injectInside(left);

            var myLink = new Element('a');
            myLink.href = 'http://del.icio.us/post?url=' + encodeURIComponent(url) + '&title=' + title;
            myLink.target = '_blank';
            myLink.title = 'send to del.icio.us';
            myLink.innerHTML = 'del.icio.us';
            myLink.injectInside(left);

            // digg.com
            var img = new Element('img');
            img.alt = 'send to digg';
            img.src = '/Media/images/digg.png';
            img.injectInside(left);

            var myLink = new Element('a');
            myLink.href = 'http://digg.com/submit?phase=2&url=' + encodeURIComponent(url) + '&title=' + title;
            myLink.target = '_blank';
            myLink.title = 'send to del.icio.us';
            myLink.innerHTML = 'digg';
            myLink.injectInside(left);

            // reddit.com
            var img = new Element('img');
            img.alt = 'send to reddit.com';
            img.src = '/Media/images/reddit.png';
            img.injectInside(left);

            var myLink = new Element('a');
            myLink.href = 'http://reddit.com/submit?url=' + encodeURIComponent(url) + '&title=' + title;
            myLink.target = '_blank';
            myLink.title = 'send to reddit';
            myLink.innerHTML = 'reddit';
            myLink.injectInside(left);

            // stumpleupon.com
            var img = new Element('img');
            img.alt = 'send to stumbleupon';
            img.src = '/Media/images/stumbleupon.png';
            img.injectInside(left);

            var myLink = new Element('a');
            myLink.href = 'http://www.stumbleupon.com/refer.php?url=' + encodeURIComponent(url) + '&title=' + title;
            myLink.target = '_blank';
            myLink.title = 'send to stumbleupon';
            myLink.innerHTML = 'stumbleupon';
            myLink.injectInside(left);

            // google.com
            var img = new Element('img');
            img.alt = 'send to google';
            img.src = '/Media/images/google.png';
            img.injectInside(left);

            var myLink = new Element('a');
            myLink.href = 'http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk=' + encodeURIComponent(url) + '&title=' + title;
            myLink.target = '_blank';
            myLink.title = 'send to google';
            myLink.innerHTML = 'google';
            myLink.injectInside(left);

            // fade in
            div.effect('opacity', { duration: 100, wait: true, transition: Fx.Transitions.linear }).chain(function() {
                $$('.soc_left').setStyle('visibility', 'visible');
            }).start(0, 1);

        } else {
            $('containerx').effect('opacity', { duration: 100, wait: true, transition: Fx.Transitions.linear }).start(1, 0);
            $('containerx').remove();
        }

    })
})