Skip to content

Commit 52973d1

Browse files
Merge branch 'master' into master
2 parents e1eda96 + 5d8cd85 commit 52973d1

File tree

4 files changed

+155
-0
lines changed

4 files changed

+155
-0
lines changed

README.md

+5
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,20 @@ It works on web users’ computers — even when they are offline and allows you
1010
* Make a Todo List with persisting browser storage using localStorage api
1111
* Make a unit converter (time, distance, currency, etc)
1212
* Random Maze Generator as an online game
13+
* Make a web based digital clock
1314

1415
### Intermediate Level Projects
1516

1617
* Make a script which autofills common signup fields using random data
1718
* Use Yahoo! Weather api to build a weather widget
1819
* Integrate SoundCloud on a web page to play a song according to the user's mood
1920
* Use [StarWars-API](https://swapi.co/) to generate a profile of all the characters and their weapons/vehicles
21+
* Use [Unsplash-API](https://source.unsplash.com/) to create an image carousel
22+
* Use [Paper.js](http://paperjs.org/showcase) to create amazing graphics.
23+
* Use [ParallaxJS](http://matthew.wagerfield.com/parallax/) to create full page parallax boilerplates
2024

2125
### Advanced Level Projects
2226

2327
* Use [NASA's Gene Lab API](https://api.nasa.gov/api.html#genelab) to build a tool to visualize and display data in an interactive manner
2428
* Use [USGS's API](https://earthquake.usgs.gov/fdsnws/event/1/) to visualise legacy data of Earthquakes with various filters(Magnitude, Date, Areas affected, Place of Origin)
29+
* Use [Google MAP API](https://developers.google.com/maps/) and [World Bank's Climate Data API](https://datahelpdesk.worldbank.org/knowledgebase/articles/902061-climate-data-api) to build an interactive tool to visualize historical climate data by countries, regions, etc.

calculator/calc.css

+56
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
h1{
2+
text-align: center;
3+
color: red;
4+
height: 50px;
5+
padding: 25px;
6+
}
7+
*{
8+
margin: 0px;
9+
padding: 0px;
10+
}
11+
html{
12+
background: #93f273;
13+
}
14+
hr{
15+
background-color: grey;
16+
height: 2px;
17+
}#container{
18+
position: relative;
19+
width: 300px;
20+
border: 3px solid black;
21+
margin: 30px auto;
22+
border-radius: 10px;
23+
background: #666666;
24+
box-shadow: 2px 2px 2px 1px black 1;
25+
}
26+
input[type=text]{
27+
position: relative;
28+
display: block;
29+
width: 98%;
30+
margin: 10px auto 0 auto;
31+
font-size: 20px;
32+
border: 1px solid black;
33+
background: white;
34+
}
35+
input[type=button]{
36+
position: relative;
37+
width: 20%;
38+
font-weight: bold;
39+
background: #b3b3b3;
40+
border: 1px solid brown;
41+
margin: 2%;
42+
font-size: 20px;
43+
border-radius: 10px;
44+
box-shadow: 2px 2px 2px 0px;
45+
}
46+
input[type=button]:hover{
47+
background: aqua;
48+
49+
}
50+
input[type=text]:hover{
51+
background: darkgrey;
52+
}
53+
input[type=text]:disabled{
54+
color: black;
55+
56+
}

calculator/calc.html

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>calculator</title>
5+
<link rel="stylesheet" href="calc.css">
6+
7+
8+
</head>
9+
<body>
10+
<h1>My calculator app</h1>
11+
<hr><br>
12+
<div id="container">
13+
<form name="calc" >
14+
<input type="text" name="output" placeholder="Enter the nos" disabled="disabled"><br>
15+
<input type="button" value=" 1 " onclick="document.calc.output.value+='1'" >
16+
<input type="button" value=" 2 " onclick="document.calc.output.value+='2'" >
17+
<input type="button" value=" 3 " onclick="document.calc.output.value+='3'">
18+
<input type="button" value=" / " onclick="document.calc.output.value+='/'" >
19+
<br>
20+
21+
22+
<input type="button" value=" 4 " onclick="document.calc.output.value+='4'" >
23+
<input type="button" value=" 5 " onclick="document.calc.output.value+='5'" >
24+
<input type="button" value=" 6 " onclick="document.calc.output.value+='6'" >
25+
<input type="button" value=" * " onclick="document.calc.output.value+='*'" >
26+
<br>
27+
28+
<input type="button" value=" 7 " onclick="document.calc.output.value+='7'" >
29+
<input type="button" value=" 8 " onclick="document.calc.output.value+='8'" >
30+
<input type="button" value=" 9 " onclick="document.calc.output.value+='9'" >
31+
<input type="button" value=" - " onclick="document.calc.output.value+='-'" >
32+
<br>
33+
34+
<input type="button" value=" ( " onclick="document.calc.output.value+='('" >
35+
<input type="button" value=" ) " onclick="document.calc.output.value+=')'" >
36+
<input type="button" value=" 0 " onclick="document.calc.output.value+='0'" >
37+
<input type="button" value=" + " onclick="document.calc.output.value+='+'" >
38+
<br>
39+
40+
41+
42+
43+
<input type="button" value=" c " onclick="document.calc.output.value =''" >
44+
<input type="button" value=" . " onclick="document.calc.output.value+='.'" >
45+
<input type="button" value=" = " onclick="calculate()" >
46+
<input type="button" value=" % " onclick="document.calc.output.value+='%'" >
47+
<br>
48+
49+
50+
51+
52+
53+
54+
55+
56+
</form>
57+
</div>
58+
59+
60+
61+
62+
63+
64+
65+
66+
<p>Made By Gaurang</p>
67+
<hr><br>
68+
69+
70+
71+
72+
73+
74+
75+
76+
77+
78+
<script type="text/javascript" src="calc.js"></script>
79+
80+
</body>
81+
</html>

calculator/calc.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
function calculate(){
2+
document.calc.output.value=eval(document.calc.output.value);
3+
4+
}
5+
/*
6+
function erase(){
7+
document.calc.output.value="";
8+
}
9+
function entery(s){
10+
document.cal.output.value+=s;
11+
12+
}
13+
*/

0 commit comments

Comments
 (0)