Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Various upgrades #4

Open
wants to merge 8 commits into
base: master
Choose a base branch
from
Open

Various upgrades #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
a0ee311
Update README.md
lwcorp Oct 16, 2024
4dae0bb
Update index.html
lwcorp Oct 16, 2024
a576e2b
Added CSS for new features
lwcorp Oct 16, 2024
a5cd44a
Update script.js
lwcorp Oct 16, 2024
9c52111
Update styles.css
lwcorp Oct 16, 2024
807df91
Avoided clashes
lwcorp Oct 16, 2024
f7d56cc
Avoided long anchor names
lwcorp Oct 16, 2024
3a71d9e
Avoided long anchor names
lwcorp Oct 16, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 2 additions & 14 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,22 +23,10 @@ Go to your projects's html page and make sure you reference the JavaScript file
```

### If you want a form instead of auto list
Find the script.js file located at `js/script.js`, place the file in your project and **comment out** the following lines:

```javascript
var user = ...;
window.onload = genRepo(user);
```

In the html page **remove the comment ou**t besides the div with ID of `title` to return the form.
In the HTML page **remove the comment out** besides the div with ID of `title` to return the form.

### If you want to show the repositories of a different user than yourself
Find the script.js file located at `js/script.js`, place the file in your project and **manually** fill `var user = 'alternate_username';` in the following lines:

```javascript
var user = ...;
window.onload = genRepo(user);
```
In the HTML page **manually** fill `user = 'alternate_username';` in the following lines:

### Extras
In the html page you can move the div named `repo-box` to where you want the repositiories to show:
Expand Down
12 changes: 11 additions & 1 deletion css/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,16 @@ body {
width: 100%;
}

#repo-box>ol {
float: left;
margin: 0.9% 5% 0%;
}

#repo-box>div>h1 {
margin-left: 20%;
color: white;
}

/* css for start page asking for username */

#title {
Expand Down Expand Up @@ -146,4 +156,4 @@ body {
a:hover{
text-decoration: none;
}
/* End code to modify */
/* End code to modify */
47 changes: 32 additions & 15 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,32 +24,49 @@
</head>

<body>

<!--
<div id="title">
<h1>Enter GitHub Username:</h1>
<input id="user" type="text" placeholder="seyon123">
<button id="btn" onclick="getusername()">View Repos</button>
<button id="btn" onclick="getusername(this.previousElementSibling.value)">View Repos</button>
<br><i>*Repos may appear at a slower rate compared to other content on screen.</i>
</div>
-->

<div id="back">
<a href="index.html">Go Back</a>
<a href=".">Go Back</a>
</div>
-->

<!-- The div below is all you need to list all repositories-->
<div id="repo-box"></div>


<script>
document.getElementById("back").style.display = "none";
function getusername() {
var user = document.getElementById("user").value;
document.getElementById("title").style.display = "none";
document.getElementById("repo-box").style.display = "block";
document.getElementById("back").style.display = "block";
genRepo(user);
<div id="repo-box">
<ol>
<li><a href="#originals">Originals</a></li>
<li><a href="#forks">Forks</a></li>
</ol>
<div id="originals"><h1>Originals</h1></div>
<hr>
<div id="forks"><h1>Forks</h1></div>
</div>

<script>
var full = document.querySelectorAll("#title").length > 0;
if (full) {
document.getElementById("back").style.display = "none";
document.getElementById("repo-box").style.display = "none";
} else {
getusername('');
}
function getusername(user) {
var params = ""; // API allowed paramters like "?type=all&sort=updated&direction=asc";
if (full) {
document.getElementById("title").style.display = "none";
document.getElementById("repo-box").style.display = "block";
document.getElementById("back").style.display = "block";
} else {
user = document.domain.split('.', 1); // alternatively, manually enter a different user than yourself
}
genRepo(user, params);
}
</script>
</body>
Expand Down
17 changes: 6 additions & 11 deletions js/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,18 @@
// Copyright (c) 2022 Seyon Rajagopal
// -------------------------------------------


// To use a form instead of a specific user comment out the following 2 lines of code:

var user = document.domain.split('.', 1); // alternatively, manually enter a different user than yourself using var user = 'alternate_username';
window.onload = genRepo(user);


function genRepo(user) {
function genRepo(user, params) {
const testuser = /^[a-z\d](?:[a-z\d]|-(?=[a-z\d])){0,38}$/i;

if (testuser.test(user) == false || user == "" || user == null) {
$("#repo-box").append("<div class='error-box'><h1 class='error-msg'> Sorry the GitHub username appears to be invalid </h1></div>");
}

else {

var requestURL = 'https://api.github.com/users/' + user + '/repos';
if (params == "") {
params = location.search;
}
var requestURL = 'https://api.github.com/users/' + user + '/repos' + params;
var request = $.get(requestURL, function () {
})
.done(function () {
Expand Down Expand Up @@ -47,7 +42,7 @@ function genRepo(user) {
}

// Puts repo information into div
$("#repo-box").append("<a href='" + repo_url + "' target='_blank'><div class='repo-item'><h1 class='title'>" +
$("#" + (request[i].fork ? "forks" : "originals")).append("<a href='" + repo_url + "' target='_blank'><div class='repo-item'><h1 class='title'>" +
username + "/" +
repo_name + "</h1><p class='description'>" +
repo_description + "</p>" + "<div class='bottom'><div class='language'><span class='img' uk-icon='code' class='uk-icon'></span>" +
Expand Down