Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit e16f574

Browse files
text editor
1 parent 0e1f7a7 commit e16f574

File tree

8 files changed

+411
-2
lines changed

8 files changed

+411
-2
lines changed

‎Index.html

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -176,8 +176,42 @@ <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white"
176176
</svg>
177177
</a>
178178
</div>
179-
180-
179+
<div class="max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700">
180+
<a href="#">
181+
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">String Method</h5>
182+
</a>
183+
<p class="mb-3 font-normal text-gray-700 dark:text-gray-400">Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.</p>
184+
<a href="StringMethod/index.html" class="inline-flex items-center px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
185+
Read more
186+
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
187+
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
188+
</svg>
189+
</a>
190+
</div>
191+
<div class="max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700">
192+
<a href="#">
193+
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">Number Method</h5>
194+
</a>
195+
<p class="mb-3 font-normal text-gray-700 dark:text-gray-400">Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.</p>
196+
<a href="NumberMethod/index.html" class="inline-flex items-center px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
197+
Read more
198+
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
199+
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
200+
</svg>
201+
</a>
202+
</div>
203+
<div class="max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow-sm dark:bg-gray-800 dark:border-gray-700">
204+
<a href="#">
205+
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">Text Editor</h5>
206+
</a>
207+
<p class="mb-3 font-normal text-gray-700 dark:text-gray-400">Here are the biggest enterprise technology acquisitions of 2021 so far, in reverse chronological order.</p>
208+
<a href="TextEditorProject/index.html" class="inline-flex items-center px-3 py-2 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
209+
Read more
210+
<svg class="rtl:rotate-180 w-3.5 h-3.5 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
211+
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
212+
</svg>
213+
</a>
214+
</div>
181215
</div>
182216
</body>
183217
</html>

‎NumberMethod/app.js

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
2+
3+
// decimal ko hata ke number aajae
4+
// Math.round krna (4.6 => 5) (4.4 => 4)
5+
// Math.floor krna decimal gaeb krdo or number rehne do (4.6 => 4) (4.9 => 4)
6+
// Math.ceil krna , halka sa bhe decimal ho aik number barhado , (4.001 ==> 5)
7+
8+
9+
// var number = 4.5
10+
// // Math.round
11+
// console.log(Math.round(number))
12+
13+
// // Math Ceil
14+
// console.log(Math.ceil(number))
15+
16+
// // Math Floor
17+
// console.log(Math.floor(number))
18+
19+
20+
var h2 = document.getElementById('random')
21+
function generateRandomNumber() {
22+
var num =Math.ceil(Math.random()*6)
23+
// var round = Math.round(num)
24+
h2.innerText = num
25+
}
26+
27+
var num = Math.ceil(Math.random()*6)
28+
console.log('num',num);
29+
30+
31+
function matchNumber(val){
32+
console.log(val);
33+
if(val == num ){
34+
alert("correct")
35+
}
36+
}

‎NumberMethod/index.html

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Document</title>
8+
</head>
9+
10+
<body style="text-align: center;">
11+
<h1>Number Methods</h1>
12+
13+
<div onclick="matchNumber(1)">1</div>
14+
<div>2</div>
15+
<div>3</div>
16+
<div>4</div>
17+
<div>5</div>
18+
<div>6</div>
19+
<h2 id="random">-</h2>
20+
<button onclick="generateRandomNumber()">Generate Random Number</button>
21+
<script src="app.js"></script>
22+
</body>
23+
24+
</html>

‎StringMethod/app.js

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
// property => jo simple aik value ho
2+
// method => us type ke related function ko function kehte hen
3+
4+
5+
// length
6+
var SMIT_11 = 'We are learning Javascript.'
7+
console.log(SMIT_11.length)
8+
9+
//USE CASE
10+
11+
// var username = prompt('Add your name')
12+
// if (username.length > 3 && username.length < 12) {
13+
// console.log('ok')
14+
// } else {
15+
// alert('Please add proper name')
16+
// }
17+
18+
// if (username.length < 3 || username.length > 12) {
19+
// alert('Please add proper name')
20+
// }
21+
22+
23+
// charAt , ye index number leta he or us position pe jo value hoti he usko return krta he
24+
var qoute = "Insaan jab bolta he to uska character pata chal jata he."
25+
// console.log(qoute.charAt(5))
26+
// var count = 0
27+
// for (var i = 0; i < qoute.length; i++) {
28+
// console.log(qoute.charAt(i))
29+
// if (qoute.charAt(i) === 'c') {
30+
// count++
31+
// }
32+
// }
33+
// console.log(count)
34+
35+
36+
37+
// toUpperCase , ye string to uppercase mein krke new string return krta he
38+
39+
// MUTABLE => WO DATA TYPE JO UPDATE HOSAKTI e.g Object-Array
40+
// IMMUTABLE => WO DATA TYPE JO UPDATE NAHN HOTI BALKE REPLACE HOTI HE.
41+
42+
var smit = 'smit'
43+
console.log(smit.toUpperCase())
44+
smit = smit.toUpperCase()
45+
console.log(smit)
46+
47+
// toLowerCase , ye string to lowercase mein krke new string return krta he
48+
49+
// var lowerCase = 'LowerCasE'
50+
// console.log(lowerCase.toLowerCase())
51+
//use case
52+
var a = 'a'
53+
var A = 'A'
54+
console.log(a === A)
55+
56+
var cities = ['KarAChi', 'LaHore', 'IslAMAbad', 'Mirpur']
57+
var userCity = prompt('Add City')
58+
for (var i = 0; i < cities.length; i++) {
59+
60+
if (cities[i].toLowerCase() === userCity.toLowerCase()) {
61+
alert('Match')
62+
}
63+
}
64+
// slice , copy krke new string return krta he
65+
// var username = 'Bilal Raza'
66+
// console.log(username.slice(1, 5))
67+
68+
var username = 'basit'
69+
username = username[0].toUpperCase() + username.slice(1)
70+
console.log(username)
71+
72+
73+
// indexOf , alphabet/character dete hen to agr wo alphabet mojood ho to uska index number return krta he wrna -1 return krta he
74+
75+
// lastIndexOf , alphabet/character dete hen to agr wo alphabet mojood ho to uska last wala index number return krta he wrna -1 return krta he
76+
77+
// replace , ye 2 parameters leta he, jisko krna he or jis se krna he , updated new string return krdega
78+
79+
// replaceAll , ye replace ki tarha he lekin sab jaga se replace krdeta he
80+
81+
// trim , start or end se empty spaces ko remove krdeta he
82+
83+
84+
85+
86+
// AIK HOGA SECRET NUMBER
87+
// SECRET NUMBER => 15
88+
// 1.USER 1 OR USER 2 SE NUMBER LENGE USING PROMPT
89+
// 2.2 PRIZES HE
90+
// => LOW=> 5 SE ZYADA HO OR 20 SE KAM HO LEKIN 15 NA HO , 11 , 18
91+
// => MEDIUM PRIZE => KOI BHE NUMBER DAALE JIS MEIN 5 PLUS YA MINUS KAREN TO 15 HOJAE , 10 ,20
92+
// => HIGH PRIZE => EXACT SECRET NUMBER BATADE ., 15
93+
94+
let userName = prompt("Enter name").toUpperCase();
95+
if(userName === "MAAZ"){
96+
console.log("Found")
97+
}else{
98+
console.log("Not Found")
99+
}
100+
101+
102+
let arr = ['ali', 'shehzad','ahmed'];
103+
for(let i=0 ; i< arr.length ; i++){
104+
console.log(arr[i][0].toUpperCase() +arr[i].slice(1) )
105+
}

‎StringMethod/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Document</title>
7+
</head>
8+
<body style="text-align: center;">
9+
<h1>String Methods</h1>
10+
<script src="app.js"></script>
11+
</body>
12+
</html>

‎TextEditorProject/app.js

Lines changed: 108 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,108 @@
1+
let text = document.getElementById('text')
2+
console.log('Text ==> ', text);
3+
4+
let buttons = document.getElementsByClassName('action-btn')
5+
console.log(buttons);
6+
7+
let fontOptions = document.getElementById('font-family')
8+
console.log(fontOptions);
9+
10+
let fontSize = document.getElementById('font-size')
11+
console.log(fontSize);
12+
13+
14+
fontOptions.addEventListener('change',function(){
15+
console.log(this.value);
16+
if(this.value === 'monospace'){
17+
text.style.fontFamily = 'monospace'
18+
}
19+
if(this.value === 'serif'){
20+
text.style.fontFamily = 'serif'
21+
}
22+
if(this.value === 'sans-serif'){
23+
text.style.fontFamily = 'sans-serif'
24+
}
25+
26+
})
27+
28+
fontSize.addEventListener('change',function(){
29+
console.log(this.value);
30+
if(this.value === 'heading'){
31+
text.style.fontSize = '41px'
32+
}
33+
if(this.value === 'sub-heading'){
34+
text.style.fontSize = '25px'
35+
}
36+
if(this.value === 'normal'){
37+
text.style.fontSize = '15px'
38+
}
39+
40+
})
41+
42+
for (let i = 0; i < buttons.length; i++) {
43+
buttons[i].addEventListener('click', function () {
44+
console.log(this);
45+
46+
switch (this.innerText) {
47+
case 'Bold':
48+
if (text.style.fontWeight === 'bold') {
49+
text.style.fontWeight = 'normal';
50+
} else {
51+
text.style.fontWeight = 'bold';
52+
}
53+
break;
54+
55+
case 'Italic':
56+
if (text.style.fontStyle === 'italic') {
57+
text.style.fontStyle = 'normal';
58+
} else {
59+
text.style.fontStyle = 'italic';
60+
}
61+
break;
62+
63+
case 'Underline':
64+
if (text.style.textDecoration === 'underline') {
65+
text.style.textDecoration = 'none';
66+
} else {
67+
text.style.textDecoration = 'underline';
68+
}
69+
break;
70+
71+
case 'Center':
72+
if (text.style.textAlign === 'center') {
73+
text.style.textAlign = 'left'; // reset back
74+
} else {
75+
text.style.textAlign = 'center';
76+
}
77+
break;
78+
79+
case 'Left':
80+
if (text.style.textAlign === 'left') {
81+
text.style.textAlign = 'initial'; // reset
82+
} else {
83+
text.style.textAlign = 'left';
84+
}
85+
break;
86+
87+
case 'Right':
88+
if (text.style.textAlign === 'right') {
89+
text.style.textAlign = 'initial';
90+
} else {
91+
text.style.textAlign = 'right';
92+
}
93+
break;
94+
95+
case 'Justify':
96+
if (text.style.textAlign === 'justify') {
97+
text.style.textAlign = 'initial';
98+
} else {
99+
text.style.textAlign = 'justify';
100+
}
101+
break;
102+
}
103+
});
104+
}
105+
106+
107+
108+

‎TextEditorProject/index.html

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Document</title>
7+
<link rel="stylesheet" href="style.css">
8+
</head>
9+
<body>
10+
<h1>Text Editor</h1>
11+
<select name="" id="font-family">
12+
<option value="">Select Font Family</option>
13+
<option value="monospace">Monospace</option>
14+
<option value="serif">Serif</option>
15+
<option value="sans-serif">Sans Serif</option>
16+
</select>
17+
<select name="" id="font-size">
18+
<option value="">Select Font Size</option>
19+
<option value="heading">Heading</option>
20+
<option value="sub-heading">Sub Heading</option>
21+
<option value="normal">Normal</option>
22+
</select>
23+
<div>
24+
<button class="action-btn">Bold</button>
25+
<button class="action-btn">Italic</button>
26+
<button class="action-btn">Underline</button>
27+
<button class="action-btn">Center</button>
28+
<button class="action-btn">Left</button>
29+
<button class="action-btn">Right</button>
30+
<button class="action-btn">Justify</button>
31+
</div>
32+
<div>
33+
<p id="text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem esse facere error sapiente. Dolores similique, nostrum necessitatibus iste rerum architecto consectetur beatae, eum eos magni ab delectus labore, tempora voluptate!</p>
34+
</div>
35+
<script src="app.js"></script>
36+
</body>
37+
</html>

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /