Skip to content

Commit 7770408

Browse files
sarfraz-mohsinsarfraz-mohsin
committed
This is a chrome extension which saves all your important URL's in just one click and you can delete them as well in one simple click
1 parent af5a0b3 commit 7770408

File tree

5 files changed

+154
-0
lines changed

5 files changed

+154
-0
lines changed

‎leadGenerator-ChromeExtension/index.html

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<link rel="stylesheet" href="style.css">
8+
<title>Chrome Extension</title>
9+
</head>
10+
<body>
11+
<input id="input-el" type="text">
12+
<div class="buttons">
13+
<button id="input-btn">SAVE INPUT</button>
14+
<button id="tab-btn">SAVE TAB</button>
15+
<button id="delete-btn">DELETE ALL</button>
16+
</div>
17+
<ul id="ul-el"></ul>
18+
19+
<script src="script.js"></script>
20+
</body>
21+
</html>
22+
23+

‎leadGenerator-ChromeExtension/logo.png

14.2 KB
Loading

‎leadGenerator-ChromeExtension/manifest.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"manifest_version": 3,
3+
"version": "1.9",
4+
"name": "Leads Tracker",
5+
"action": {
6+
"default_popup": "index.html",
7+
"dafult_icon": "icon.png"
8+
},
9+
"permissions": [
10+
"tabs"
11+
]
12+
}

‎leadGenerator-ChromeExtension/script.js

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
let myLeads = [];
2+
const inputButton = document.getElementById('input-btn')
3+
const inputEl = document.getElementById('input-el')
4+
const ulel = document.getElementById('ul-el');
5+
const deletebtn = document.getElementById('delete-btn')
6+
const storeData = JSON.parse(localStorage.getItem("myLeads"))
7+
const tabBtn = document.getElementById('tab-btn')
8+
9+
if(storeData){
10+
myLeads = storeData
11+
render(myLeads)
12+
}
13+
14+
tabBtn.addEventListener('click', function (){
15+
chrome.tabs.query({currentWindow: true, active: true}, function(tabs){
16+
myLeads.push(tabs[0].url)
17+
localStorage.setItem("myLeads", JSON.stringify(myLeads))
18+
render(myLeads)
19+
})
20+
})
21+
22+
function render(leads) {
23+
24+
let listItems = ''
25+
for(let i=0; i<leads.length; i++){
26+
listItems +=
27+
`<li>
28+
<a href='${leads[i]}' target='_black'>
29+
${leads[i]}
30+
</a>
31+
</li>`
32+
}
33+
34+
ulel.innerHTML = listItems;
35+
}
36+
37+
deletebtn.addEventListener('dblclick', ()=>{
38+
localStorage.clear()
39+
myLeads = []
40+
render(myLeads);
41+
})
42+
43+
inputButton.addEventListener('click', function (){
44+
myLeads.push(inputEl.value)
45+
inputEl.value = ''
46+
localStorage.setItem("myLeads", JSON.stringify(myLeads))
47+
//console.log(localStorage.getItem("myLeads"))
48+
render(myLeads)
49+
})
50+
51+
52+

‎leadGenerator-ChromeExtension/style.css

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
body{
2+
display: flex;
3+
flex-direction: column;
4+
min-height: 150px ;
5+
width: 500px;
6+
border: 1px solid rgb(73, 95, 73);
7+
}
8+
9+
#input-el{
10+
height: 30px;
11+
margin: 5px;
12+
border: 1.5px solid rgb(36, 158, 36);
13+
}
14+
15+
#input-btn{
16+
height: 30px;
17+
width: 100px;
18+
border: none;
19+
margin-left: 5px;
20+
background-color: rgb(36, 158, 36);
21+
color: white;
22+
font-weight: bold;
23+
cursor: pointer;
24+
}
25+
26+
#input-el:hover{
27+
background-color: rgb(199, 231, 242);
28+
}
29+
30+
ul{
31+
list-style: none;
32+
margin-left: 0;
33+
padding-left: 5px;
34+
padding-top: 0px;
35+
margin-top: 7px;
36+
}
37+
li{
38+
margin-top: 2px;
39+
}
40+
41+
li a{
42+
color:rgb(36, 158, 36);
43+
}
44+
45+
#delete-btn{
46+
height: 30px;
47+
width: 100px;
48+
border: none;
49+
margin-left: 5px;
50+
background-color: white;
51+
color: rgb(36, 158, 36);
52+
font-weight: bold;
53+
cursor: pointer;
54+
border: 1px solid rgb(36, 158, 36);
55+
}
56+
57+
#tab-btn{
58+
height: 30px;
59+
width: 100px;
60+
border: none;
61+
margin-left: 5px;
62+
background-color: rgb(36, 158, 36);
63+
color: white;
64+
font-weight: bold;
65+
cursor: pointer;
66+
}
67+

0 commit comments

Comments
 (0)