arnaucube/socialCountBadge
1
0
Fork 0
mirror of https://github.com/arnaucube/socialCountBadge.git synced 2026-02-07 11:46:46 +01:00
Code Issues Packages Projects Releases Wiki Activity

working

Browse Source
This commit is contained in:
arnaucode
2018-01-04 23:59:27 +01:00
parent 2dbf0ff4ad
commit c2aaae3b08
7 changed files with 147 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
README.md Normal file
View File

@@ -0,0 +1,37 @@
# socialCountBadge
## Install
```
bower install --save socialCountBadge
```
Add to the index.html:
```html
<link href="bower_components/socialCountBadge/socialCountBadge.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="bower_components/socialCountBadge/socialCountBadge.js"></script>
```
Declare the badges variable:
```html
<script>
var badges = {
hn: {
link: "https://news.ycombinator.com/item?id=16069200",
url:"https://hacker-news.firebaseio.com/v0/item/16069200.json",
callback: parseHN,
img: "img/hackernews.png",
count: null
},
reddit: {
link: "https://www.reddit.com/r/Python/comments/7o23lb/hacking_wifi_to_inject_cryptocurrency_miner_to/",
url:"https://www.reddit.com/r/Python/comments/7o23lb/hacking_wifi_to_inject_cryptocurrency_miner_to.json",
callback: parseReddit,
img: "img/reddit.png",
count: null
}
};
</script>
```

17
bower.json Normal file
View File

@@ -0,0 +1,17 @@
{
"name": "socialCountBadge",
"main": "socialCountBadge.js",
"authors": [
"arnaucode <arnaucode@gmail.com>"
],
"description": "",
"license": "MIT",
"homepage": "https://arnaucode.com",
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
]
}

BIN
img/hackernews.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
img/reddit.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 49 KiB

41
index.html Normal file
View File

@@ -0,0 +1,41 @@
<!DOCTYPE html>
<html>
<head>
<title>socialCountBadge - demo</title>
<link rel="stylesheet" href="socialCountBadge.css">
</head>
<body>
<div id="socialCountBadge"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="socialCountBadge.js"></script>
<script>
var badges = {
hn: {
link: "https://news.ycombinator.com/item?id=16069200",
url:"https://hacker-news.firebaseio.com/v0/item/16069200.json",
callback: parseHN,
img: "img/hackernews.png",
count: null
},
reddit: {
link: "https://www.reddit.com/r/Python/comments/7o23lb/hacking_wifi_to_inject_cryptocurrency_miner_to/",
url:"https://www.reddit.com/r/Python/comments/7o23lb/hacking_wifi_to_inject_cryptocurrency_miner_to.json",
callback: parseReddit,
img: "img/reddit.png",
count: null
}
};
socialCountBadge_init();
</script>
</body>
</html>

10
socialCountBadge.css Normal file
View File

@@ -0,0 +1,10 @@
.scc_badge {
border-radius: 50%;
background-color: #000;
color: #fff;
display: inline-block;
padding-left: 8px;
padding-right: 8px;
text-align: center;
margin-left: -10px;
}

42
socialCountBadge.js Normal file
View File

@@ -0,0 +1,42 @@
function get(badge) {
var result = null;
var url = badge.url;
var callback = badge.callback;
$.get(url, callback);
}
function parseHN(data) {
console.log(data);
badges.hn.count = data.score;
dataToBadge(badges.hn);
}
function parseReddit(data) {
console.log(data);
badges.reddit.count = data[0].data.children[0].data.ups;
dataToBadge(badges.reddit);
}
function dataToBadge(badge) {
console.log(badge);
var html = "";
html += "<a target='_blank' href='" + badge.link + "'>";
html += "<img src='" + badge.img + "' style='width:30px;' />";
html += "<span class='scc_badge'>" + badge.count + "</span>";
html += "</a> ";
document.getElementById("socialCountBadge").innerHTML += html;
}
function socialCountBadge_init() {
//create htmk badges
//get badges data
get(badges.hn)
get(badges.reddit)
}
var html = "";