Skip to content
This repository has been archived by the owner on Nov 27, 2024. It is now read-only.

Commit

Permalink
#8: Extra "Labels" column in the Dashboard (#20)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Moeenahamd
Moeenahamd authored Dec 14, 2023
1 parent 73683c7 commit 015be5e
Show file tree
Hide file tree
Showing 3 changed files with 126 additions and 14 deletions.
12 changes: 12 additions & 0 deletions sass/_custom.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -175,3 +175,15 @@ th[data-dir="desc"]::after {
background-color: #ffea9e;
color: white;
}

@media screen and (max-width: 480px) {
#languages {
text-align: center;
}
#platforms {
text-align: center;
}
#label {
text-align: center;
}
}
108 changes: 102 additions & 6 deletions static/js/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ urlParams.set('tab', val);

// Replace the current URL's search string with the updated parameters
window.history.replaceState({}, '', `${window.location.pathname}?${urlParams}`);
console.log(val)
}

document.addEventListener('DOMContentLoaded', function() {
Expand All @@ -45,6 +44,13 @@ const colorScheme = {
Kotlin: "#A97BFF"
}

const labelsColor = {
bug: "#ff5733",
enhancement: "#ffea9e",
"good first issue": "#3498db",
feature: "#22cc77",
}

function copyWalletAddress(){
var wallet_address = document.getElementById('wallet_address')
wallet_address.select()
Expand All @@ -53,7 +59,6 @@ function copyWalletAddress(){
}

function openPopup(data) {
console.log(data)
document.getElementById("myPopup").style.display = "block";
const popupContent = document.getElementById("popupContent");

Expand Down Expand Up @@ -109,29 +114,49 @@ async function fetchAllIssues() {
try {
const response = await fetch(apiUrl, {
});
const issuesData = await response.json();
const issuesData = await response.json();
let data = issuesData;

function fillTableWithData(dataList) {
dataList.sort(function(a, b){return a.date - b.date})
bugData = dataList.filter(element=> element.labels.find(item => item == 'bug'));
enhancementData = dataList.filter(element=> element.labels.find(item => item == 'enhancement'));
featureData = dataList.filter(element=> element.labels.find(item => item == 'feature'));
goodFirstIssueData = dataList.filter(element=> element.labels.find(item => item == 'good first issue'));
let tempBug = JSON.parse(JSON.stringify(bugData))
let tempFeature = JSON.parse(JSON.stringify(featureData))
let tempEnhancement = JSON.parse(JSON.stringify(enhancementData))
let tempgoodFirstIssueData = JSON.parse(JSON.stringify(goodFirstIssueData))
tempBug.forEach((item)=>{
item.label = item.labels.filter(item => item != 'bug')
})
tempFeature.forEach((item)=>{
item.label = item.labels.filter(item => item != 'feature')
})
tempEnhancement.forEach((item)=>{
item.label = item.labels.filter(item => item != 'enhancement')
})
tempgoodFirstIssueData.forEach((item)=>{
item.label = item.labels.filter(item => item != 'good first issue')
item.label = item.label? item.label: ''
})
bugData= JSON.parse(JSON.stringify(tempBug))
goodFirstIssueData= JSON.parse(JSON.stringify(tempgoodFirstIssueData))
enhancementData= JSON.parse(JSON.stringify(tempEnhancement))
featureData= JSON.parse(JSON.stringify(tempFeature))
sortGoodFirstTable('date', 'asc');
sortBugTable('date', 'asc');
sortFeatureTable('date', 'asc');
sortEnhancementTable('date', 'asc');
loader.style.display = 'none'; // Hide the loader
}

fillTableWithData(data);
} catch (error) {
console.error('Error fetching repositories:', error);
}
}

function sortGoodFirstTable(column, direction){
console.log(column)
let tempData = [];
if(direction == 'asc'){
if(column == 'date'){
Expand All @@ -151,6 +176,13 @@ function sortGoodFirstTable(column, direction){
return joinedA.localeCompare(joinedB);
});
}
else if(column == 'label'){
tempData = goodFirstIssueData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedA.localeCompare(joinedB);
});
}
else{
tempData = goodFirstIssueData.sort((a, b) => a[column].localeCompare(b[column]));
}
Expand All @@ -173,6 +205,13 @@ function sortGoodFirstTable(column, direction){
return joinedB.localeCompare(joinedA);
});
}
else if(column == 'label'){
tempData = goodFirstIssueData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedB.localeCompare(joinedA);
});
}
else
{
tempData = goodFirstIssueData.sort((a, b) => b[column].localeCompare(a[column]));
Expand Down Expand Up @@ -208,6 +247,13 @@ function sortBugTable(column, direction){
return joinedA.localeCompare(joinedB);
});
}
else if(column == 'label'){
tempData = bugData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedA.localeCompare(joinedB);
});
}
else{
tempData = bugData.sort((a, b) => a[column].localeCompare(b[column]));
}
Expand All @@ -230,6 +276,13 @@ function sortBugTable(column, direction){
return joinedB.localeCompare(joinedA);
});
}
else if(column == 'label'){
tempData = bugData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedB.localeCompare(joinedA);
});
}
else
{
tempData = bugData.sort((a, b) => b[column].localeCompare(a[column]));
Expand Down Expand Up @@ -266,6 +319,13 @@ function sortFeatureTable(column, direction){
return joinedA.localeCompare(joinedB);
});
}
else if(column == 'label'){
tempData = featureData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedA.localeCompare(joinedB);
});
}
else{
tempData = featureData.sort((a, b) => a[column].localeCompare(b[column]));
}
Expand All @@ -288,6 +348,13 @@ function sortFeatureTable(column, direction){
return joinedB.localeCompare(joinedA);
});
}
else if(column == 'label'){
tempData = featureData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedB.localeCompare(joinedA);
});
}
else
{
tempData = featureData.sort((a, b) => b[column].localeCompare(a[column]));
Expand Down Expand Up @@ -323,6 +390,13 @@ function sortEnhancementTable(column,direction){
return joinedA.localeCompare(joinedB);
});
}
else if(column == 'label'){
tempData = enhancementData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedA.localeCompare(joinedB);
});
}
else{
tempData = enhancementData.sort((a, b) => a[column].localeCompare(b[column]));
}
Expand All @@ -345,6 +419,13 @@ function sortEnhancementTable(column,direction){
return joinedB.localeCompare(joinedA);
});
}
else if(column == 'label'){
tempData = enhancementData.sort((a, b) => {
const joinedA = a.label.sort().join('');
const joinedB = b.label.sort().join('');
return joinedB.localeCompare(joinedA);
});
}
else
{
tempData = enhancementData.sort((a, b) => b[column].localeCompare(a[column]));
Expand Down Expand Up @@ -405,6 +486,7 @@ function populateTable(data, type){
let cell4 = newRow.insertCell(3);
let cell5 = newRow.insertCell(4);
let cell6 = newRow.insertCell(5);
let cell7 = newRow.insertCell(6);

cell1.innerHTML = repo;
cell2.innerHTML = data.title;
Expand All @@ -413,7 +495,7 @@ function populateTable(data, type){
cell4.innerHTML = data.date

data.languages.forEach((item)=>{
var spanElement = document.createElement('span');
let spanElement = document.createElement('span');
spanElement.textContent = item;
spanElement.style.backgroundColor = colorScheme[item]
spanElement.style.borderRadius = '10px'
Expand Down Expand Up @@ -449,6 +531,20 @@ function populateTable(data, type){
})

cell6.style.textAlign = 'center';
data.label.forEach((item)=>{
var span = document.createElement('span');
span.textContent = item;
span.style.backgroundColor = labelsColor[item];
span.style.borderRadius = '10px';
span.style.padding = '0px 5px';
span.style.marginLeft = '2px';
span.style.color = 'white';
cell7.appendChild(span);
var lineBreak = document.createElement("br");
cell7.appendChild(lineBreak);
cell7.style.textAlign = 'center';
})

})
var rows = document.querySelectorAll("tbody tr");
for (var i = 0; i < rows.length; i++) {
Expand Down
20 changes: 12 additions & 8 deletions templates/contribute/section.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,10 +36,11 @@ <h1 class="text-center">{{ section.title }}</h1>
<tr>
<th id="repo" scope="col">Repository</th>
<th id="title" scope="col">Title</th>
<th id="user" scope="col">Author</th>
<th id="user" style="width: 85px;" scope="col">Author</th>
<th id="date" scope="col">Date</th>
<th id="languages" scope="col">Languages</th>
<th id="platforms" scope="col">Platforms</th>
<th id="platforms" style="width: 110px;" scope="col">Platforms</th>
<th id="label"style="width: 145px;" scope="col">Labels</th>
</tr>
</thead>
<tbody class="good-first-issue">
Expand All @@ -54,10 +55,11 @@ <h1 class="text-center">{{ section.title }}</h1>
<tr>
<th id="repo" scope="col">Repository</th>
<th id="title" scope="col">Title</th>
<th id="user" scope="col">Author</th>
<th id="user" style="width: 85px;" scope="col">Author</th>
<th id="date" scope="col">Date</th>
<th id="languages" scope="col">Languages</th>
<th id="platforms" scope="col">Platforms</th>
<th id="platforms" style="width: 110px;" scope="col">Platforms</th>
<th id="label"style="width: 145px;" scope="col">Labels</th>
</tr>
</thead>
<tbody class="bug">
Expand All @@ -70,10 +72,11 @@ <h1 class="text-center">{{ section.title }}</h1>
<tr>
<th id="repo" scope="col">Repository</th>
<th id="title" scope="col">Title</th>
<th id="user" scope="col">Author</th>
<th id="user" style="width: 85px;" scope="col">Author</th>
<th id="date" scope="col">Date</th>
<th id="languages" scope="col">Languages</th>
<th id="platforms" scope="col">Platforms</th>
<th id="platforms" style="width: 110px;" scope="col">Platforms</th>
<th id="label"style="width: 145px;" scope="col">Labels</th>
</tr>
</thead>
<tbody class="enhancement">
Expand All @@ -86,10 +89,11 @@ <h1 class="text-center">{{ section.title }}</h1>
<tr>
<th id="repo" scope="col">Repository</th>
<th id="title" scope="col">Title</th>
<th id="user" scope="col">Author</th>
<th id="user" style="width: 85px;" scope="col">Author</th>
<th id="date" scope="col">Date</th>
<th id="languages" scope="col">Languages</th>
<th id="platforms" scope="col">Platforms</th>
<th id="platforms" style="width: 110px;" scope="col">Platforms</th>
<th id="label"style="width: 145px;" scope="col">Labels</th>
</tr>
</thead>
<tbody class="feature">
Expand Down

0 comments on commit 015be5e

Please sign in to comment.