Appreciation Test Bed

by sammy

HTML

<input type='hidden' class='url-input' value="http://www.youtube.com/watch?v=qylCsBIFYug">
<a class='appreciate-button'>
    <img src='http://friendora.com/favicon.ico'>
        <span>Appreciate</span>
</a>

CSS

.appreciate-button {
    font-family: arial;
    font-size: 13px;
	display: inline-block;
	border: 1px solid #ccc;
	padding: 2px 6px;
	margin: 10px 0px;
	color: #666 !important;
	background: linear-gradient(white, #fafafa);
	border-radius: 3px;
    cursor: pointer;
}
.appreciate-button img {
    vertical-align: middle;
}
.appreciate-button span {
    vertical-align: middle;
    display: inline-block;
    border-left: 1px solid #ddd;
    padding-left: 5px;
    margin: 0px 0px 2px 0px;
}

JavaScript

$('.appreciate-button').click(function(){
    var URI = encodeURIComponent($('.url-input').val());
    
    window.open('http://99.65.100.6:8000/appreciate/popup?href='+URI+'&userId=1','','width=504,height=600');
});