Skip to content

Commit 8f0f9aa

Browse files
zubyjzubyj
committed
refactoring
1 parent 9e0f509 commit 8f0f9aa

File tree

2 files changed

+132
-137
lines changed

2 files changed

+132
-137
lines changed

‎src/content-script/get-user-code.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
/* Reads the code from the user's code editor and sends it to the background script
2+
*/
3+
14
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
25
if (request.type === 'getCode') {
36
sendResponse({ data: getCode() });

‎src/content-script/update-description.ts‎

Lines changed: 129 additions & 137 deletions
Original file line numberDiff line numberDiff line change
@@ -1,151 +1,143 @@
1-
chrome.runtime.onMessage.addListener((request) => {
2-
if (request.action === 'updateDescription') {
3-
4-
5-
chrome.storage.local.get(['showExamples'], (result) => {
6-
let showExamples = true;
7-
showExamples = result.showExamples;
8-
if (!showExamples) {
9-
let descriptionContainer = document.querySelector('div._1l1MA');
10-
if (descriptionContainer) {
11-
let exampleElements = descriptionContainer.getElementsByClassName('example');
12-
if (exampleElements.length > 0) {
13-
let startIndex = Array.from(descriptionContainer.children).indexOf(exampleElements[0].parentNode);
14-
for (let i = startIndex; i < descriptionContainer.children.length; i++) {
15-
descriptionContainer.children[i].style.display = 'none';
16-
}
17-
}
18-
}
19-
}
20-
else {
21-
let descriptionContainer = document.querySelector('div._1l1MA');
22-
if (descriptionContainer) {
23-
let exampleElements = descriptionContainer.getElementsByClassName('example');
24-
if (exampleElements.length > 0) {
25-
let startIndex = Array.from(descriptionContainer.children).indexOf(exampleElements[0].parentNode);
26-
for (let i = startIndex; i < descriptionContainer.children.length; i++) {
27-
descriptionContainer.children[i].style.display = 'block';
28-
}
29-
}
30-
}
31-
}
32-
});
331

34-
chrome.storage.local.get(['showCompanyTags'], (result) => {
35-
let showCompanyTags = true;
36-
showCompanyTags = !result.showCompanyTags;
37-
if (showCompanyTags) {
38-
const title = request.title.split('-')[0].trim();
39-
addCompanyTags(title);
2+
// shows the examples if the user has enabled the option
3+
function showExamples() {
4+
chrome.storage.local.get(['showExamples'], (result) => {
5+
let showExamples = result.showExamples;
6+
let descriptionContainer = document.querySelector('div._1l1MA');
7+
let style = showExamples ? 'block' : 'none';
8+
if (!descriptionContainer) {
9+
return;
10+
}
11+
let exampleElements = descriptionContainer.getElementsByClassName('example');
12+
if (exampleElements && exampleElements.length > 0) {
13+
let startIndex = Array.from(descriptionContainer.children).indexOf(exampleElements[0].parentNode);
14+
for (let i = startIndex; i < descriptionContainer.children.length; i++) {
15+
descriptionContainer.children[i].style.display = style;
4016
}
41-
else {
42-
let buttonContainer = document.getElementById('companyButtonContainer');
43-
if (buttonContainer) {
44-
buttonContainer.remove();
45-
}
17+
}
18+
});
19+
}
20+
21+
// TODO : refactor this function
22+
// showCompanyTags shouldnt worry about if its allowed to show the tags or not
23+
// it should only worry about showing the tags
24+
// that logic should be handled by the caller
25+
function showCompanyTags(problemTitle: string) {
26+
chrome.storage.local.get(['showCompanyTags'], (result) => {
27+
let showCompanyTags = result.showCompanyTags;
28+
let companyTagContainer = document.getElementById('companyTagContainer');
29+
if (!showCompanyTags) {
30+
if (companyTagContainer) {
31+
companyTagContainer.style.display = 'none';
4632
}
47-
});
48-
49-
let oldBtn = document.getElementById('openSolutionsBtn');
50-
if (oldBtn) {
51-
oldBtn.remove();
33+
return;
5234
}
53-
54-
let openSolutionBtn = document.createElement('button');
55-
openSolutionBtn.id = 'openSolutionsBtn';
56-
openSolutionBtn.style.minWidth = '100px';
57-
openSolutionBtn.style.backgroundColor = '#373737';
58-
openSolutionBtn.style.height = '30px';
59-
openSolutionBtn.style.fontSize = '10px';
60-
openSolutionBtn.style.borderRadius = '10px';
61-
openSolutionBtn.textContent = 'Solution Video';
62-
63-
openSolutionBtn.onmouseover = function () {
64-
openSolutionBtn.style.color = 'orange';
35+
const descriptionBtns = document.querySelectorAll('div.mt-3.flex')[0];
36+
if (!descriptionBtns) {
37+
return;
6538
}
66-
openSolutionBtn.onmouseout = function () {
67-
openSolutionBtn.style.color = 'white';
39+
// Find the old button container or create a new one
40+
if (companyTagContainer) {
41+
// Clear the old content
42+
companyTagContainer.style.display = 'flex';
43+
return;
6844
}
6945

70-
openSolutionBtn.onclick = function () {
71-
// Get all div elements that contain the text 'Solutions'
72-
// If a solutions tab was found, simulate a click on it
73-
let solutionsTabs = document.querySelectorAll('div.relative.flex.h-full.select-none');
74-
if (solutionsTabs.length > 0) {
75-
solutionsTabs[2].click();
76-
} else {
77-
// If no solutions tab was found, log an error message
78-
console.log('No solutions tab found');
46+
// create a new container for buttons
47+
companyTagContainer = document.createElement('div');
48+
companyTagContainer.id = 'companyTagContainer'; // add an id
49+
companyTagContainer.style.display = 'flex';
50+
companyTagContainer.style.flexDirection = 'row';
51+
companyTagContainer.style.marginTop = '10px';
52+
companyTagContainer.style.gap = '5px';
53+
// add the button container to the main container
54+
descriptionBtns.parentElement?.appendChild(companyTagContainer);
55+
56+
chrome.storage.local.get(['leetcodeProblems'], (result) => {
57+
const problem = result.leetcodeProblems.questions.find((problem) => problem.title === problemTitle);
58+
if (problem.companies && problem.companies.length > 0) {
59+
// slice the array to get only the first five companies
60+
const topCompanies = problem.companies.slice(0, 5);
61+
62+
// create a button for each company
63+
topCompanies.forEach(company => {
64+
const button = document.createElement('button');
65+
button.style.display = 'flex';
66+
button.style.alignItems = 'center'; // align items vertically in the center
67+
button.style.justifyContent = 'center'; // align items horizontally in the center
68+
69+
const icon = document.createElement('img');
70+
icon.src = `https://logo.clearbit.com/${company.name.toLowerCase().replace(/\s/g, '')}.com`; // replace spaces with nothing
71+
icon.style.height = '12px';
72+
icon.style.width = '12px';
73+
icon.style.marginRight = '5px'; // some space between the icon and the name
74+
button.appendChild(icon);
75+
76+
button.style.color = '#fff';
77+
button.style.minWidth = '100px';
78+
button.style.height = '25px';
79+
button.style.padding = '1px';
80+
button.style.backgroundColor = '#373737';
81+
button.style.borderRadius = '10px';
82+
button.style.fontSize = '10px';
83+
84+
const companyName = document.createTextNode(`${company.name}`);
85+
button.appendChild(companyName);
86+
87+
const score = document.createElement('span');
88+
score.textContent = ` ${company.score}`;
89+
score.style.fontSize = '12px';
90+
score.style.fontWeight = 'bold';
91+
score.style.fontFamily = 'monospace';
92+
score.style.marginLeft = '5px'; // some space between the name and the score
93+
button.appendChild(score);
94+
companyTagContainer!.appendChild(button);
95+
});
7996
}
80-
};
81-
82-
function addCompanyTags(title: string) {
83-
const container = document.querySelectorAll('div.mt-3.flex')[0];
97+
});
98+
});
99+
}
84100

85-
if (!container) {
86-
return;
87-
}
101+
function showOpenSolutionsBtn() {
102+
let oldBtn = document.getElementById('openSolutionsBtn');
103+
if (oldBtn) {
104+
oldBtn.remove();
105+
}
88106

89-
// Find the old button container or create a new one
90-
let buttonContainer = document.getElementById('companyButtonContainer');
91-
if (buttonContainer) {
92-
// Clear the old content
93-
buttonContainer.innerHTML = '';
94-
} else {
95-
// create a new container for buttons
96-
buttonContainer = document.createElement('div');
97-
buttonContainer.id = 'companyButtonContainer'; // add an id
98-
buttonContainer.style.display = 'flex';
99-
buttonContainer.style.flexDirection = 'row';
100-
buttonContainer.style.marginTop = '10px';
101-
buttonContainer.style.gap = '5px';
102-
103-
// add the button container to the main container
104-
container.parentElement?.appendChild(buttonContainer);
105-
}
107+
let openSolutionBtn = document.createElement('button');
108+
openSolutionBtn.id = 'openSolutionsBtn';
109+
openSolutionBtn.style.minWidth = '100px';
110+
openSolutionBtn.style.backgroundColor = '#373737';
111+
openSolutionBtn.style.height = '30px';
112+
openSolutionBtn.style.fontSize = '10px';
113+
openSolutionBtn.style.borderRadius = '10px';
114+
openSolutionBtn.textContent = 'Solution Video';
115+
116+
openSolutionBtn.onmouseover = function () {
117+
openSolutionBtn.style.color = 'orange';
118+
}
119+
openSolutionBtn.onmouseout = function () {
120+
openSolutionBtn.style.color = 'white';
121+
}
106122

107-
chrome.storage.local.get(['leetcodeProblems'], (result) => {
108-
const problem = result.leetcodeProblems.questions.find((problem) => problem.title === title);
109-
if (problem.companies && problem.companies.length > 0) {
110-
// slice the array to get only the first five companies
111-
const topCompanies = problem.companies.slice(0, 5);
112-
113-
// create a button for each company
114-
topCompanies.forEach(company => {
115-
const button = document.createElement('button');
116-
button.style.display = 'flex';
117-
button.style.alignItems = 'center'; // align items vertically in the center
118-
button.style.justifyContent = 'center'; // align items horizontally in the center
119-
120-
const icon = document.createElement('img');
121-
icon.src = `https://logo.clearbit.com/${company.name.toLowerCase().replace(/\s/g, '')}.com`; // replace spaces with nothing
122-
icon.style.height = '12px';
123-
icon.style.width = '12px';
124-
icon.style.marginRight = '5px'; // some space between the icon and the name
125-
button.appendChild(icon);
126-
127-
button.style.color = '#fff';
128-
button.style.minWidth = '100px';
129-
button.style.height = '25px';
130-
button.style.padding = '1px';
131-
button.style.backgroundColor = '#373737';
132-
button.style.borderRadius = '10px';
133-
button.style.fontSize = '10px';
134-
135-
const companyName = document.createTextNode(`${company.name}`);
136-
button.appendChild(companyName);
137-
138-
const score = document.createElement('span');
139-
score.textContent = ` ${company.score}`;
140-
score.style.fontSize = '12px';
141-
score.style.fontWeight = 'bold';
142-
score.style.fontFamily = 'monospace';
143-
score.style.marginLeft = '5px'; // some space between the name and the score
144-
button.appendChild(score);
145-
buttonContainer.appendChild(button);
146-
});
147-
}
148-
});
123+
openSolutionBtn.onclick = function () {
124+
// If a solutions tab was found, simulate a click on it
125+
let solutionsTabs = document.querySelectorAll('div.relative.flex.h-full.select-none');
126+
if (solutionsTabs.length > 0) {
127+
solutionsTabs[2].click();
128+
} else {
129+
console.log('No solutions tab found');
149130
}
131+
};
132+
}
133+
134+
chrome.runtime.onMessage.addListener((request) => {
135+
if (request.action === 'updateDescription') {
136+
showExamples();
137+
showCompanyTags(request.title.split('-')[0].trim());
138+
}
139+
140+
if (request.action === 'toggleShowExamples') {
141+
150142
}
151143
});

0 commit comments

Comments
 (0)