Created URL Bookmark project #335 · ishika1501/30DaysOfJavaScript@254611e · GitHub
Skip to content

Commit 254611e

Browse files
Salma-HamedSalma-Hamed
committed
Created URL Bookmark project swapnilsparsh#335 
1 parent 9202920 commit 254611e

9 files changed

Lines changed: 300 additions & 0 deletions

File tree

‎30DaysOfJavaScript/assets/63.PNG‎

32.4 KB
Loading

‎63 - URL Bookmark/css/bootstrap.min.css‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎63 - URL Bookmark/css/main.css‎

Lines changed: 111 additions & 0 deletions

‎63 - URL Bookmark/index.html‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<html>
2+
<head>
3+
<link rel="stylesheet" href="css/bootstrap.min.css">
4+
<link rel="stylesheet" href="css/main.css">
5+
</head>
6+
<body>
7+
<div class="container">
8+
<h3 class="p-title my-5">Bookmark</h3>
9+
<div class="row1">
10+
<div id="r1" class="row">
11+
<div class="col-md-12 p-5 cont">
12+
<h2 class="mb-4">Bookmark your favorite websites</h2>
13+
<label for="site_name" class="pg-label mt-2">Website Name</label>
14+
<input id="site_name" class="pg-input" placeholder="Bookmark Name" type="text" name="">
15+
<p class="py-1" id="p1"></p>
16+
<label for="site_url" class="pg-label mt-2">Website URL</label>
17+
<input id="site_url" class="pg-input" placeholder="Website URL" type="text" name="">
18+
<p class="py-1" id="p2"></p>
19+
<button onclick="add()" class="cont-btn my-1">Save</button>
20+
</div>
21+
</div>
22+
<div class="row" id="snd-row"></div>
23+
</div>
24+
<p class="my-4">© 2021 Example Inc.</p>
25+
</div>
26+
27+
28+
<script src="js/jquery-3.5.1.slim.min.js"></script>
29+
<script src="js/popper.min.js"></script>
30+
<script src="js/bootstrap.min.js"></script>
31+
<script src="js/main.js"></script>
32+
</body>
33+
</html>

‎63 - URL Bookmark/js/bootstrap.min.js‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎63 - URL Bookmark/js/jquery-3.5.1.slim.min.js‎

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎63 - URL Bookmark/js/main.js‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
var x = document.getElementById('site_name');
2+
var num = 0;
3+
var y = document.getElementById('site_url');
4+
var p1_in = document.getElementById('p1');
5+
var p2_in = document.getElementById('p2');
6+
var count = 0;
7+
var items = [];
8+
if(localStorage.getItem('items',items) == null)
9+
{
10+
items = [];
11+
}
12+
else
13+
{
14+
items = JSON.parse(localStorage.getItem('items',items));
15+
display();
16+
}
17+
18+
// check() returns zero if the user entered a valid input, and the number of invalid inputs otherwise
19+
function check(){
20+
for(var i = 0; i < items.length; i++)
21+
{
22+
if(x.value == items[i].name)
23+
{
24+
p1_in.innerHTML = "This name already exists";
25+
p1_in.style.display = "block";
26+
count ++;
27+
break;
28+
}
29+
}
30+
if(x.value == "")
31+
{
32+
p1_in.innerHTML = "Name is required";
33+
p1_in.style.display = "block";
34+
count ++;
35+
}
36+
if(y.value == "")
37+
{
38+
p2_in.innerHTML = "Url is required";
39+
p2_in.style.display = "block";
40+
count++;
41+
}
42+
num = 0;
43+
for(var c = 0; c < y.value.length; c++)
44+
{
45+
if(y.value[c] == '.' && y.value.slice(c - 3, 3).toLowerCase() != "www")
46+
{
47+
num++;
48+
console.log(num);
49+
console.log(y.value.slice(c - 3, 3).toLowerCase());
50+
}
51+
}
52+
if(num < 1)
53+
{
54+
p2_in.innerHTML = "Url must contain TLD (e.g. \".com\")";
55+
p2_in.style.display = "block";
56+
count++;
57+
}
58+
return count;
59+
60+
}
61+
62+
// add an item to the local storage:
63+
function add(){
64+
if (check() == 0)
65+
{
66+
var item = {
67+
name: x.value,
68+
url: y.value
69+
};
70+
// add http:// if it doesn't exist
71+
if(item.url.slice(0,4) != "http")
72+
{
73+
item.url = "https://" + y.value;
74+
}
75+
// add www. if it doesn't exist
76+
for(var i = 0; i < item.url.length; i++)
77+
{
78+
if(item.url.slice(0, i + 1) == "https://")
79+
{
80+
if(item.url[i + 1].toLowerCase() != "w" && item.url[i + 1] != '/')
81+
{
82+
item.url = item.url.slice(0, i + 1) + "www." + item.url.slice(i + 1);
83+
break;
84+
}
85+
else
86+
{
87+
item.url = item.url.toLowerCase();
88+
}
89+
}
90+
}
91+
92+
items.push(item);
93+
localStorage.setItem('items', JSON.stringify(items));
94+
x.value = "";
95+
y.value = "";
96+
display();
97+
}
98+
}
99+
100+
// delete an item from the local storage:
101+
function del(index){
102+
items.splice(index,1);
103+
localStorage.setItem('items',JSON.stringify(items));
104+
display();
105+
}
106+
107+
// display all saved items:
108+
function display(){
109+
var x = "";
110+
for (var i = 0; i < items.length; i++)
111+
{
112+
x += `
113+
<div class="col-md-12 my-4 py-4 t-r">
114+
<div class="row">
115+
<div class="col-md-3">
116+
<h3 class="pp-title">${items[i].name}</h3>
117+
</div>
118+
<div class="col-md-9">
119+
<div class="btns">
120+
<a href="${items[i].url}" target="_blank" class="btn1 mr-2">Visit</a>
121+
<button onclick="del(${i})" class="btn2">Delete</button>
122+
</div>
123+
</div>
124+
</div>
125+
</div>`
126+
}
127+
document.getElementById('snd-row').innerHTML = x;
128+
}

‎63 - URL Bookmark/js/popper.min.js‎

Lines changed: 5 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎index.html‎

Lines changed: 7 additions & 0 deletions

0 commit comments

Comments
 (0)