Skip to content

Commit 5e79378

Browse files
committed
changed naming conventions as per the review comments
1 parent 625ee8e commit 5e79378

2 files changed

Lines changed: 27 additions & 28 deletions

File tree

homework/index.js

Lines changed: 19 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -50,12 +50,12 @@
5050
}
5151

5252
const htmlString = divElement.join('');
53-
document.getElementById('section2').innerHTML = htmlString;
53+
document.getElementById('contributorinfomation').innerHTML = htmlString;
5454
}
5555

5656
// Load the Repository information into section1 div element.
5757

58-
function loadDiv(repoInfo, optionValue) {
58+
function loadRepoDetails(repoInfo, optionValue) {
5959
const templateElement = [];
6060

6161
// eslint-disable-next-line no-restricted-syntax
@@ -95,16 +95,15 @@
9595
}
9696
}
9797
const htmlString = templateElement.join('');
98-
document.getElementById('section1').innerHTML = htmlString;
98+
document.getElementById('repodetails').innerHTML = htmlString;
9999
}
100100

101101
// Create options under 'SELECT' element which should have HYF Repositories.
102102

103-
function loadSelectionValues(userInfo) {
103+
function loadSelectionValues(userRepo) {
104104
const sortRepoName = [];
105105

106-
const userRepo = JSON.parse(userInfo);
107-
const mySelect = document.getElementById('myselect');
106+
const selectRepo = document.getElementById('selectrepo');
108107

109108
// push all the HYP repo names to sort array.
110109

@@ -125,54 +124,54 @@
125124
const option = document.createElement('option');
126125
option.value = repo;
127126
option.text = repo;
128-
mySelect.appendChild(option);
127+
selectRepo.appendChild(option);
129128
}
130129

131-
const selectBox = document.getElementById('myselect');
130+
const selectBox = document.getElementById('selectrepo');
132131
const selectedValue = selectBox.options[selectBox.selectedIndex].value;
133132

134133
// Load Repository information for the choose repository name in the select box.
135-
loadDiv(userRepo, selectedValue);
134+
loadRepoDetails(userRepo, selectedValue);
136135
selectBox.onchange = function() {
137-
loadDiv(userRepo, selectBox.value);
136+
loadRepoDetails(userRepo, selectBox.value);
138137
};
139138
}
140139

141140
function main(url) {
142141
fetchJSON(url, (err, data) => {
143142
const root = document.getElementById('root');
144-
const myParent = document.body;
143+
const BodyEl = document.body;
145144

146145
if (err) {
147146
createAndAppend('div', root, { text: err.message, class: 'alert-error' });
148147
} else {
149148
// Create div element 'select' in document body to hold the label element and list box.
150149

151-
createAndAppend('div', myParent, { id: 'select' });
152-
const select = document.getElementById('select');
150+
createAndAppend('div', BodyEl, { id: 'seletcontainer' });
151+
const select = document.getElementById('seletcontainer');
153152
createAndAppend('LABEL', select, {
154153
text: 'HYF Repositories: ',
155154
id: 'label',
156155
for: 'repo',
157156
});
158-
createAndAppend('select', select, { id: 'myselect' });
157+
createAndAppend('select', select, { id: 'selectrepo' });
159158

160159
// Create two div elements section1 and section2 under 'Root' div to have
161160
// section1 - Repository Information.
162161
// section2 - Contributions.
163162

164-
createAndAppend('div', root, { id: 'section1' });
165-
createAndAppend('div', root, { id: 'section2' });
163+
createAndAppend('div', root, { id: 'repodetails' });
164+
createAndAppend('div', root, { id: 'contributorinfomation' });
166165

167166
// Insert section1 before section2 div element under 'root' div.
168-
const newNode = document.getElementById('section2');
169-
const referenceNode = document.querySelector('section1');
167+
const newNode = document.getElementById('contributorinfomation');
168+
const referenceNode = document.querySelector('repodetails');
170169
root.insertBefore(newNode, referenceNode);
171170

172171
// Insert Select div first in the body before root div.
173-
myParent.insertBefore(select, document.getElementById('root'));
172+
BodyEl.insertBefore(select, document.getElementById('root'));
174173

175-
loadSelectionValues(JSON.stringify(data, null, 2));
174+
loadSelectionValues(data);
176175
}
177176
});
178177
}

homework/style.css

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -13,25 +13,25 @@
1313
margin: 10px;
1414
padding: 20px;
1515
}
16-
#select {
16+
#seletcontainer {
1717
background-color: blue;
1818
margin-bottom: 10px;
1919
text-align: justify;
2020
width: 100%;
2121
font-size: 10px;
2222
}
23-
#myselect {
23+
#selectrepo {
2424
margin-bottom: 10px;
2525
margin-top: 10px;
2626
font-size: 10px;
2727
}
28-
#root #section1 {
28+
#root #repodetails {
2929
background-color: grey;
3030
margin-bottom: 10px;
3131
width: 85%;
3232
height: 50%;
3333
}
34-
#root #section2 {
34+
#root #contributorinfomation {
3535
background-color: grey;
3636
width: 80%;
3737
}
@@ -56,15 +56,15 @@ ul li:last-child {
5656
#root {
5757
flex-direction: row;
5858
}
59-
#myselect {
59+
#selectrepo {
6060
font-size: 15px;
6161
}
62-
#select {
62+
#seletcontainer {
6363
font-size: 15px;
6464
}
65-
#root #section2 {
65+
#root #contributorinfomation {
6666
width: 100%;
6767
}
68-
#root #section1 {
68+
#root #repodetails {
6969
width: 100%;
7070
}

0 commit comments

Comments
 (0)