Skip to content

Instantly share code, notes, and snippets.

@bachors
Last active April 23, 2018 09:25
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save bachors/58e5f2205646958057b4 to your computer and use it in GitHub Desktop.
Save bachors/58e5f2205646958057b4 to your computer and use it in GitHub Desktop.
jQuery github repository search. Display all github repository search on your website .. http://ibacor.com/demo/jquery-github-repository-search/
<!DOCTYPE html>
<html>
<head>
<!-- Include jQuery -->
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<!-- Include Fontawesome (optional) -->
<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<!-- This is jQuery search github repository -->
<script>
$( document ).ready(function() {
$('#gt_btn').click(function(){
$('#github_search').html('');
var gt_keywoard = $('#gt_keywoard').val();
github_search(gt_keywoard,gt_page=1);
return false;
});
});
// search github repository function
function github_search(gt_keywoard,gt_page) {
$.ajax({
url: 'https://api.github.com/search/repositories?q='+gt_keywoard+'&sort=stars&order=desc&page='+gt_page,
crossDomain: true,
dataType: 'json'
}).done(function (data) {
var html = '';
$.each(data.items, function(i, item) {
html += '<div class="gt_repos"><a href="'+data.items[i].svn_url+'" target="_BLANK">'+data.items[i].full_name+'</a>';
html += '<span class="fa fa-code-fork pull-right meta"> <a href="'+data.items[i].svn_url+'/network/members" target="_BLANK">'+addCommas(data.items[i].forks_count)+'</a></span><span class="fa fa-star pull-right meta"> <a href="'+data.items[i].svn_url+'/stargazers" target="_BLANK">'+addCommas(data.items[i].stargazers_count)+'</a></span><span class="fa pull-right meta"> '+data.items[i].language+'</span>';
if(data.items[i].description != ''){
html += '<br><pre>'+htmlEntities(data.items[i].description)+'</pre>';
}else{
html += '<br>';
}
html += '<span class="fa fa-clock-o meta"> updated on '+relative_time(data.items[i].updated_at)+'</span></div>';
});
html += '<p align="center" class="github_more_rep"><input type="submit" value="More" class="gt_more"></p>';
$('#github_search').append(html);
$('.gt_more').click(function(){
github_search(gt_keywoard,gt_page + 1);
$( ".github_more_rep" ).css( "display", "none" );
return false;
});
});
}
// htmlEntities function
function htmlEntities(str) {
return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
}
// relative_time function
function relative_time(date_str) {
if (!date_str) {return;}
date_str = $.trim(date_str);
date_str = date_str.replace(/\.\d\d\d+/,"");
date_str = date_str.replace(/-/,"/").replace(/-/,"/");
date_str = date_str.replace(/T/," ").replace(/Z/," UTC");
date_str = date_str.replace(/([\+\-]\d\d)\:?(\d\d)/," $1$2");
var parsed_date = new Date(date_str);
var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
var delta = parseInt((relative_to.getTime()-parsed_date)/1000);
delta=(delta<2)?2:delta;
var r = '';
if (delta < 60) {
r = 'Just now';
} else if(delta < 120) {
r = 'a minute';
} else if(delta < (45*60)) {
r = (parseInt(delta / 60, 10)).toString() + ' minutes ago';
} else if(delta < (2*60*60)) {
r = 'a hour';
} else if(delta < (24*60*60)) {
r = (parseInt(delta / 3600, 10)).toString() + ' hours ago';
} else if(delta < (48*60*60)) {
r = 'a day';
} else {
r = (parseInt(delta / 86400, 10)).toString() + ' days ago';
}
return r;
};
// number_format function
function addCommas(nStr)
{
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
</script>
<!-- Custom style -->
<style>
.gt_repos{
padding:10px;
border-bottom:1px solid #ddd;
margin-bottom:20px
}
</style>
</head>
<body>
<p align="center"><input type="text" id="gt_keywoard" placeholder="Keyworad" title="Keyworad"> <input type="submit" id="gt_btn" value="Search"><br>
Example1: <b>tetris</b><br>
Example2: <b>tetris language:javascript</b></p><hr>
<!-- Display al github repository -->
<div id="github_search"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment