Skip to content

Commit 134b8ae

Browse files
authored
Code files
1 parent 23512ab commit 134b8ae

100 files changed

Lines changed: 15081 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
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+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<title>To-Do-List</title>
8+
<link rel="stylesheet" href="styles.css">
9+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
10+
</head>
11+
<body>
12+
13+
<nav class="navbar navbar-inverse navbar-fixed-top">
14+
<div class="container">
15+
<div class="navbar-header">
16+
<a class="navbar-brand" href="/">ToDo List</a>
17+
</div>
18+
</div>
19+
</nav>
20+
21+
<div class="container">
22+
23+
<div class="content-area row">
24+
<div class="col-md-2 col-xs-2 col-lg-2 col-sm-2"></div>
25+
26+
<div class="col-md-8 col-xs-8 col-lg-8 col-sm-8">
27+
<h2>ToDo List</h2>
28+
29+
<div class="row input-area">
30+
<div class="col-md-1"></div>
31+
<div class="form-group col-md-9">
32+
<input type="text" placeholder="New Task" class="form-control" id="addTask">
33+
</div>
34+
<div class="form-group col-md-1">
35+
<button class="btn btn-primary" onclick="toDo.addTaskClick()">Add</button>
36+
</div>
37+
<div class="col-md-1"></div>
38+
</div>
39+
40+
<ul class="list-group" id="taskList">
41+
42+
</ul>
43+
</div>
44+
45+
<div class="col-md-2 col-xs-2 col-lg-2 col-sm-2"></div>
46+
</div>
47+
48+
</div><!-- /.container -->
49+
50+
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
51+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
52+
<script src="dist/scripts.js"></script>
53+
</body>
54+
</html>
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{
2+
"name": "todo-list",
3+
"version": "1.0.0",
4+
"description": "",
5+
"main": "index.js",
6+
"scripts": {
7+
"watch": "concurrently \"npm run serve\" \"babel src -d dist --presets=es2015 -ws\"",
8+
"build": "rm -rf dist && babel src -d dist --presets=es2015",
9+
"serve": "http-server"
10+
},
11+
"author": "Dani Akash S",
12+
"license": "ISC",
13+
"devDependencies": {
14+
"babel-cli": "^6.24.1",
15+
"babel-preset-es2015": "^6.24.1",
16+
"concurrently": "^3.4.0",
17+
"http-server": "^0.10.0"
18+
}
19+
}

Chapter01/StarterFiles/index.html

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
body {
2+
padding-top: 50px;
3+
}
4+
.starter-template {
5+
padding: 40px 15px;
6+
text-align: center;
7+
}
8+
.content-area {
9+
margin: 30px;
10+
}
11+
.input-area {
12+
margin: 25px;
13+
}
14+
.task-text {
15+
display: flex;
16+
align-items: center;
17+
height: 40px;
18+
}
19+
.hidden {
20+
display: none;
21+
}
22+
.delete-icon-area {
23+
display: flex;
24+
align-items: center;
25+
height: 40px;
26+
}
27+
.delete-icon {
28+
color: red;
29+
}
30+
.complete {
31+
text-decoration: line-through;
32+
}

Chapter01/StarterFiles/styles.css

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
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+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<title>To-Do-List</title>
8+
<link rel="stylesheet" href="styles.css">
9+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
10+
</head>
11+
<body>
12+
13+
<nav class="navbar navbar-inverse navbar-fixed-top">
14+
<div class="container">
15+
<div class="navbar-header">
16+
<a class="navbar-brand" href="/">ToDo List</a>
17+
</div>
18+
</div>
19+
</nav>
20+
21+
<div class="container">
22+
23+
<div class="content-area row">
24+
<div class="col-md-2 col-xs-2 col-lg-2 col-sm-2"></div>
25+
26+
<div class="col-md-8 col-xs-8 col-lg-8 col-sm-8">
27+
<h2>ToDo List</h2>
28+
29+
<div class="row input-area">
30+
<div class="col-md-1"></div>
31+
<div class="form-group col-md-9">
32+
<input type="text" placeholder="New Task" class="form-control" id="addTask">
33+
</div>
34+
<div class="form-group col-md-1">
35+
<button class="btn btn-primary">Add</button>
36+
</div>
37+
<div class="col-md-1"></div>
38+
</div>
39+
40+
<ul class="list-group" id="taskList">
41+
<li class="list-group-item checkbox">
42+
<div class="row">
43+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 checkbox">
44+
<label><input type="checkbox" value="" class="" checked></label>
45+
</div>
46+
<div class="col-md-10 col-xs-10 col-lg-10 col-sm-10 task-text complete">
47+
First item
48+
</div>
49+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 delete-icon-area">
50+
<a class="" href="/"><i class="delete-icon glyphicon glyphicon-trash"></i></a>
51+
</div>
52+
</div>
53+
</li>
54+
<li class="list-group-item checkbox">
55+
<div class="row">
56+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 checkbox">
57+
<label><input type="checkbox" value="" class=""></label>
58+
</div>
59+
<div class="col-md-10 col-xs-10 col-lg-10 col-sm-10 task-text">
60+
Second item
61+
</div>
62+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 delete-icon-area">
63+
<a class="" href="/"><i class="delete-icon glyphicon glyphicon-trash"></i></a>
64+
</div>
65+
</div>
66+
</li>
67+
<li class="list-group-item checkbox">
68+
<div class="row">
69+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 checkbox">
70+
<label><input type="checkbox" value="" class=""></label>
71+
</div>
72+
<div class="col-md-10 col-xs-10 col-lg-10 col-sm-10 task-text">
73+
Third item
74+
</div>
75+
<div class="col-md-1 col-xs-1 col-lg-1 col-sm-1 delete-icon-area">
76+
<a class="" href="/"><i class="delete-icon glyphicon glyphicon-trash"></i></a>
77+
</div>
78+
</div>
79+
</li>
80+
</ul>
81+
</div>
82+
83+
<div class="col-md-2 col-xs-2 col-lg-2 col-sm-2"></div>
84+
</div>
85+
86+
</div><!-- /.container -->
87+
88+
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
89+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
90+
<script src="scripts.js"></script>
91+
</body>
92+
</html>

Chapter02/CompletedCode/npm-shrinkwrap.json

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
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+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<title>Meme Creator</title>
8+
<link rel="stylesheet" href="./dist/memes.css">
9+
</head>
10+
<body>
11+
<nav class="navbar navbar-inverse navbar-fixed-top">
12+
<div class="container">
13+
<div class="navbar-header">
14+
<a class="navbar-brand" href="/">Meme Creator</a>
15+
</div>
16+
<div id="navbar" class="collapse navbar-collapse">
17+
</div>
18+
<!--/.nav-collapse -->
19+
</div>
20+
</nav>
21+
22+
<div class="body">
23+
24+
<div class="canvas-area">
25+
<canvas id="imgCanvas" class="img-canvas">
26+
Canvas Not supported in your browser... Sorry!
27+
</canvas>
28+
</div>
29+
30+
<div class="input-area">
31+
32+
<div class="form-group">
33+
<label for="image">Source Image:</label>
34+
<input type="file" id="image" class="form-control" accept=".png,.jpg,.jpeg">
35+
</div>
36+
37+
<div class="form-group">
38+
<label for="topText">Top Text:</label>
39+
<input type="text" id="topText" class="form-control">
40+
</div>
41+
42+
<div class="form-group">
43+
<label for="bottomText">Bottom Text:</label>
44+
<input type="text" id="bottomText" class="form-control">
45+
</div>
46+
47+
<a class="btn btn-primary download-button" id="downloadMeme" download="meme.png">Download</a>
48+
49+
</div>
50+
51+
</div>
52+
<div class="has-error" style="display: none;"></div>
53+
<script src="./dist/memes.js"></script>
54+
</body>
55+
</html>
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
body {
2+
padding-top: 65px;
3+
}
4+
.body {
5+
display: flex;
6+
flex-direction: row;
7+
flex-wrap: wrap;
8+
justify-content: space-around;
9+
}
10+
.canvas-area {
11+
flex: 2;
12+
display: flex;
13+
align-items: center;
14+
justify-content: center;
15+
margin: 10px;
16+
}
17+
.img-canvas {
18+
border: 1px solid #000000;
19+
}
20+
.input-area {
21+
flex: 1;
22+
display: flex;
23+
flex-direction: column;
24+
align-items: center;
25+
justify-content: center;
26+
margin: 10px;
27+
}
28+
.form-group {
29+
width: 90%;
30+
}
31+
.download-button {
32+
margin-top: 10px;
33+
}
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import "../../node_modules/bootstrap/less/bootstrap.less";
2+
import '../css/styles.css';
3+
4+
import 'bootstrap';
5+
6+
console.log('General JS File');

0 commit comments

Comments
 (0)