Experimental Google+ Button.
Artem Sapegin
parent
ae0838adc0
commit
80a591d757
|
|
@ -16,8 +16,9 @@
|
|||
<li class="facebook"><a href="#" title="Опубликовать ссылку на Фейсбуке">Facebook</a></li>
|
||||
<li class="twitter"><a href="#" data-via="sapegin" data-related="DessiTeckel:Моя такса" title="Опубликовать ссылку в Твиттере">Twitter</a></li>
|
||||
<li class="mailru"><a href="#" title="Опубликовать ссылку в Моём Мире">Мой мир</a></li>
|
||||
<li class="vkontakte"><a href="#" title="Опубликовать ссылку во В контакте">В контакте</a></li>
|
||||
<li class="vkontakte"><a href="#" title="Опубликовать ссылку во Вконтакте">Вконтакте</a></li>
|
||||
<li class="odnoklassniki"><a href="#" title="Опубликовать ссылку в Одноклассниках">Одноклассники</a></li>
|
||||
<!--li class="plusone" data-counter-url="http://my.sapegin.ru/social-likes/googleplusonecount.php"><a href="#" title="Плюсануть в Гугле">+1</a></li-->
|
||||
<li class="livejournal"><form action="http://www.livejournal.com/update.bml" method="post" target="_blank">
|
||||
<input type="hidden" name="mode" value="full">
|
||||
<input type="hidden" name="subject" value="Social Likes">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,42 @@
|
|||
<?php
|
||||
/**
|
||||
* Google +1 counter JSONP proxy for Social Likes
|
||||
* http://sapegin.github.com/social-likes
|
||||
*
|
||||
* Usage:
|
||||
* //example.com/googleplusonecount.php?url=http%3A//google.com/&callback=foo
|
||||
*
|
||||
* @author Artem Sapegin
|
||||
* @copyright 2011 Artem Sapegin (sapegin.ru)
|
||||
* @license http://creativecommons.org/licenses/by/3.0/
|
||||
*/
|
||||
|
||||
// http://openminds.lucido-media.de/php-google-plus-one-count-api
|
||||
function get_google_plusone_count($url) {
|
||||
$curl = curl_init();
|
||||
curl_setopt_array($curl, array(
|
||||
CURLOPT_HTTPHEADER => array('Content-type: application/json'),
|
||||
CURLOPT_POST => true,
|
||||
CURLOPT_POSTFIELDS => '[{"method":"pos.plusones.get","id":"p","params":{"nolog":true,"id":"' . $url . '","source":"widget","userId":"@viewer","groupId":"@self"},"jsonrpc":"2.0","key":"p","apiVersion":"v1"}]',
|
||||
CURLOPT_RETURNTRANSFER => true,
|
||||
CURLOPT_SSL_VERIFYPEER => false,
|
||||
CURLOPT_URL => 'https://clients6.google.com/rpc?key=AIzaSyCKSbrvQasunBoV16zDH9R33D88CeLr9gQ'
|
||||
));
|
||||
$result = curl_exec($curl);
|
||||
curl_close($curl);
|
||||
|
||||
if ($result) {
|
||||
$json = json_decode($result, true);
|
||||
return $json[0]['result']['metadata']['globalCounts']['count'];
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
if (empty($_GET['callback']) || empty($_GET['url'])) {
|
||||
header('HTTP/1.0 400 Bad request');
|
||||
exit();
|
||||
}
|
||||
|
||||
print $_GET['callback'] . '("' . get_google_plusone_count($_GET['url']) . '")';
|
||||
|
||||
?>
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
margin-left: 0;
|
||||
}
|
||||
.social-likes li:before {
|
||||
display: none;
|
||||
/*display: none;*/
|
||||
}
|
||||
.social-likes li a, .social-likes li b, .social-balloon, .social-balloon textarea {
|
||||
font-family: "Trebuchet MS", "Helvetica Neue", Tahoma, sans-serif;
|
||||
|
|
@ -225,6 +225,100 @@
|
|||
.social-likes li.facebook a i {
|
||||
background-position: 0 -20px;
|
||||
}
|
||||
|
||||
/* Google +1 */
|
||||
.social-likes li.plusone a, .social-likes li.plusone b {
|
||||
border-color: #CAD4E7;
|
||||
}
|
||||
.social-likes li.plusone a {
|
||||
width: 32px;
|
||||
padding: 1px 4px;
|
||||
background: #dbdbdb;
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#dbdbdb));
|
||||
background: -moz-linear-gradient(top, #f9f9f9, #dbdbdb);
|
||||
background: -ms-linear-gradient(top, #f9f9f9, #dbdbdb);
|
||||
background: -o-linear-gradient(top, #f9f9f9, #dbdbdb);
|
||||
background: linear-gradient(top, #f9f9f9, #dbdbdb);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr = #f9f9f9, EndColorStr = #dbdbdb);
|
||||
color: #166aee;
|
||||
border-color: #b3b3b3;
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
}
|
||||
.social-likes li.plusone a:hover, .social-likes li.plusone a:active {
|
||||
background: #e0e0e0;
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#bbb));
|
||||
background: -moz-linear-gradient(top, #fafafa, #bbb);
|
||||
background: -ms-linear-gradient(top, #fafafa, #bbb);
|
||||
background: -o-linear-gradient(top, #fafafa, #bbb);
|
||||
background: linear-gradient(top, #fafafa, #bbb);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr = #fafafa, EndColorStr = #bbbbbb);
|
||||
color: #1e52a4;
|
||||
border-color: #a3a3a3;
|
||||
}
|
||||
.social-likes li.plusone b i {
|
||||
border-right-color: #ccc;
|
||||
}
|
||||
.social-likes li.plusone b {
|
||||
/*background: #f2f3f7;*/
|
||||
}
|
||||
.social-likes li.plusone b i i {
|
||||
border-right-color: #fff !important;
|
||||
}
|
||||
.social-likes li.plusone a i {
|
||||
display: none; /* Hide from old browsers */
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1px) {
|
||||
.social-likes li.plusone a, .social-likes li.plusone a:hover, .social-likes li.plusone a:active {
|
||||
line-height: 20px;
|
||||
vertical-align: bottom;
|
||||
border-top-color: transparent;
|
||||
}
|
||||
.social-likes li.plusone a i {
|
||||
display: block;
|
||||
top: -1px;
|
||||
left: -1px;
|
||||
width: 42px;
|
||||
height: 5px;
|
||||
background: -webkit-gradient(linear, 0 0, 42 0, color-stop(0.25, #e32c3b), color-stop(0.25, #148EE3), color-stop(0.5, #148EE3), color-stop(0.5, #36C520), color-stop(0.75, #36C520), color-stop(0.75, #FFCA27), color-stop(1, #FFCA27));
|
||||
background: -webkit-linear-gradient(360deg, #E32C3B 25%, #148EE3 25%, #148EE3 50%, #36C520 50%, #36C520 75%, #FFCA27 75%, #FFCA27 100%);
|
||||
background: -moz-linear-gradient(360deg, #E32C3B 25%, #148EE3 25%, #148EE3 50%, #36C520 50%, #36C520 75%, #FFCA27 75%, #FFCA27 100%);
|
||||
background: -o-linear-gradient(360deg, #E32C3B 25%, #148EE3 25%, #148EE3 50%, #36C520 50%, #36C520 75%, #FFCA27 75%, #FFCA27 100%);
|
||||
background: linear-gradient(360deg, #E32C3B 25%, #148EE3 25%, #148EE3 50%, #36C520 50%, #36C520 75%, #FFCA27 75%, #FFCA27 100%);
|
||||
border-bottom: 1px solid #d7d7d7;
|
||||
-webkit-border-radius: 3px 3px 0px 0px;
|
||||
-moz-border-radius: 3px 3px 0px 0px;
|
||||
border-radius: 3px 3px 0px 0px;
|
||||
}
|
||||
.social-likes li.plusone a i:before, .social-likes li.plusone a i:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -1px;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
background: #b3b3b3;
|
||||
}
|
||||
.social-likes li.plusone a i:before {
|
||||
left: 0;
|
||||
}
|
||||
.social-likes li.plusone a i:after {
|
||||
right: 0;
|
||||
}
|
||||
.social-likes li.plusone a:hover i:before, .social-likes li.plusone a:hover i:after,
|
||||
.social-likes li.plusone a:active i:before, .social-likes li.plusone a:active i:after {
|
||||
background: #a3a3a3;
|
||||
}
|
||||
}
|
||||
|
||||
/* Hacks for IE9 which supports media queries but not support CSS gradients */
|
||||
.social-likes-msie-lte9 li.plusone a i {
|
||||
display: none;
|
||||
}
|
||||
.social-likes-msie-lte9 li.plusone a, .social-likes-msie-lte9 li.plusone a:hover, .social-likes-msie-lte9 li.plusone a:active {
|
||||
border-color: #CAD4E7;
|
||||
}
|
||||
|
||||
|
||||
/* Mail.ru */
|
||||
.social-likes li.mailru a {
|
||||
|
|
@ -270,7 +364,7 @@
|
|||
background-position: 0 -40px;
|
||||
}
|
||||
|
||||
/* V kontakte */
|
||||
/* Vkontakte */
|
||||
.social-likes li.vkontakte a {
|
||||
border-color: #4170a4;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,17 +13,22 @@
|
|||
|
||||
(function($){
|
||||
|
||||
var socialLikes = function(){
|
||||
var socialLikes = function() {
|
||||
this.init();
|
||||
};
|
||||
|
||||
socialLikes.prototype = {
|
||||
init: function() {
|
||||
this.pageUrl = window.location.href.replace(window.location.hash, '');
|
||||
var escapedPageUrl = escape(this.pageUrl);
|
||||
this.container = $('.social-likes');
|
||||
var this_ = this;
|
||||
this.counters = {};
|
||||
|
||||
if ($.browser.msie && $.browser.version <= 9) {
|
||||
this.container.addClass('social-likes-msie-lte9');
|
||||
}
|
||||
|
||||
this.container.find('li').each(function(){
|
||||
var buttonWrapper = $(this);
|
||||
var classes = buttonWrapper[0].className.split(' ');
|
||||
|
|
@ -32,7 +37,7 @@
|
|||
switch(cls) {
|
||||
case 'twitter':
|
||||
if (!this_.counters.twiter) {
|
||||
$.getJSON('http://urls.api.twitter.com/1/urls/count.json?url=' + escape(this_.pageUrl) + '&callback=?', function(data){ this_.updateCount(cls, data.count); });
|
||||
$.getJSON('http://urls.api.twitter.com/1/urls/count.json?url=' + escapedPageUrl + '&callback=?', function(data){ this_.updateCount(cls, data.count); });
|
||||
this_.counters.twiter = true;
|
||||
}
|
||||
|
||||
|
|
@ -49,7 +54,7 @@
|
|||
|
||||
case 'facebook':
|
||||
if (!this_.counters.facebook) {
|
||||
$.getJSON('https://api.facebook.com/method/fql.query?query=select total_count from link_stat where url="' + escape(this_.pageUrl) + '"&format=json&callback=?', function(data){ this_.updateCount(cls, data[0].total_count); });
|
||||
$.getJSON('https://api.facebook.com/method/fql.query?query=select total_count from link_stat where url="' + escapedPageUrl + '"&format=json&callback=?', function(data){ this_.updateCount(cls, data[0] && data[0].total_count); });
|
||||
this_.counters.facebook = true;
|
||||
}
|
||||
|
||||
|
|
@ -62,10 +67,39 @@
|
|||
}, buttonWrapper, cls);
|
||||
|
||||
break;
|
||||
|
||||
case 'plusone':
|
||||
/* buttonWrapper.replaceWith('<g:plusone></g:plusone>');
|
||||
|
||||
// Load standard Google +1 button
|
||||
window.___gcfg = {
|
||||
lang: 'ru',
|
||||
parsetags: 'explicit'
|
||||
};
|
||||
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
|
||||
po.src = 'https://apis.google.com/js/plusone.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);*/
|
||||
|
||||
if (!this_.counters.plusone) {
|
||||
var counterUrl = buttonWrapper.attr('data-counter-url');
|
||||
if (counterUrl) {
|
||||
$.getJSON(counterUrl + '?url=' + escapedPageUrl + '&callback=?', function(data){ this_.updateCount(cls, data); });
|
||||
this_.counters.plusone = true;
|
||||
}
|
||||
}
|
||||
|
||||
this_.initButton({
|
||||
urlParam: 'url',
|
||||
popupUrl: 'https://plusone.google.com/_/+1/confirm?hl=ru_RU',
|
||||
pupupWidth: 500,
|
||||
popupHeight: 300
|
||||
}, buttonWrapper, cls);
|
||||
|
||||
break;
|
||||
|
||||
case 'mailru':
|
||||
if (!this_.counters.mailru) {
|
||||
$.getJSON('http://connect.mail.ru/share_count?url_list=' + escape(this_.pageUrl) + '&callback=1&func=?', function(data){ this_.updateCount(cls, data[this_.pageUrl] && data[this_.pageUrl].shares); });
|
||||
$.getJSON('http://connect.mail.ru/share_count?url_list=' + escapedPageUrl + '&callback=1&func=?', function(data){ this_.updateCount(cls, data[this_.pageUrl] && data[this_.pageUrl].shares); });
|
||||
this_.counters.mailru = true;
|
||||
}
|
||||
|
||||
|
|
@ -84,7 +118,7 @@
|
|||
this_.updateCount(cls, count);
|
||||
}}};
|
||||
$.ajax({
|
||||
url: 'http://vkontakte.ru/share.php?act=count&index=1&url=' + escape(this_.pageUrl),
|
||||
url: 'http://vkontakte.ru/share.php?act=count&index=1&url=' + escapedPageUrl,
|
||||
dataType: 'jsonp'
|
||||
});
|
||||
this_.counters.vkontakte = true;
|
||||
|
|
@ -106,7 +140,7 @@
|
|||
this_.updateCount(cls, count);
|
||||
}};
|
||||
$.ajax({
|
||||
url: 'http://www.odnoklassniki.ru/dk?st.cmd=extLike&uid=odklcnt0&ref=' + escape(this_.pageUrl),
|
||||
url: 'http://www.odnoklassniki.ru/dk?st.cmd=extLike&uid=odklcnt0&ref=' + escapedPageUrl,
|
||||
dataType: 'jsonp'
|
||||
});
|
||||
this_.counters.odnoklassniki = true;
|
||||
|
|
|
|||
Loading…
Reference in New Issue