Skip to content

Commit 49bac75

Browse files
bilgedemirkayabilgedemirkaya
committed
lecture6
1 parent 0fc680c commit 49bac75

65 files changed

Lines changed: 1029 additions & 0 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎newversion-2020/commerce-project2/.idea/commerce-project2.iml‎

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

‎newversion-2020/lecture6/addition.html‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Hello!</title>
5+
<link rel="stylesheet" href="addition.css" type="text/css">
6+
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
7+
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
8+
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
9+
</head>
10+
<body>
11+
<div id="app" />
12+
<script type="text/babel" src="addition.js"> </script>
13+
</body>
14+
15+
</html>

‎newversion-2020/lecture6/addition.js‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
class App extends React.Component {
2+
3+
constructor(props) {
4+
super(props);
5+
this.state = {
6+
num1: 1,
7+
num2: 1,
8+
response: "",
9+
score: 0,
10+
incorrect: false
11+
};
12+
}
13+
14+
render() {
15+
if (this.state.score === 10) {
16+
return this.renderWinnerScreen();
17+
} else {
18+
return this.renderProblem();
19+
}
20+
}
21+
22+
renderWinnerScreen() {
23+
return <div id="winner">You won!</div>;
24+
}
25+
26+
renderProblem() {
27+
return (
28+
<div>
29+
<div className={this.state.incorrect ? "incorrect" : ""} id="problem">{this.state.num1} + {this.state.num2}</div>
30+
<input onKeyPress={this.inputKeyPress} onChange={this.updateResponse} autoFocus={true} value={this.state.response} />
31+
<div>Score: {this.state.score}</div>
32+
</div>);
33+
}
34+
35+
inputKeyPress = (event) => {
36+
if (event.key === "Enter") {
37+
const answer = parseInt(this.state.response);
38+
if (answer === this.state.num1 + this.state.num2) {
39+
// User got question right
40+
this.setState(state => ({
41+
score: state.score + 1,
42+
response: "",
43+
num1: Math.ceil(Math.random() * 10),
44+
num2: Math.ceil(Math.random() * 10),
45+
incorrect: false
46+
}));
47+
} else {
48+
// User got question wrong
49+
this.setState(state => ({
50+
score: state.score - 1,
51+
incorrect: true,
52+
response: ""
53+
}));
54+
}
55+
}
56+
}
57+
58+
updateResponse = (event) => {
59+
this.setState({
60+
response: event.target.value
61+
});
62+
}
63+
}
64+
65+
ReactDOM.render(<App />, document.querySelector("#app"));

‎newversion-2020/lecture6/animate.html‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>SinglePage</title>
5+
<script src="animate.js"></script>
6+
<style>
7+
@keyframes grow{
8+
/* I spesify some keyframes for this particular element meaning where should animation start what should its styles properties be,
9+
and the end what should its styles properties be. */
10+
from {
11+
font-size:20px;
12+
background-color: sienna;
13+
left:0%;
14+
}
15+
to{
16+
font-size:100px;
17+
color:rosybrown;
18+
background-color: seashell;
19+
left:50%;
20+
}
21+
}
22+
h1{
23+
position:relative; /* it position should be relative to other elements, **left thing wouldnt work without this */
24+
animation-name: grow;
25+
animation-duration: 5s;
26+
animation-fill-mode: forwards;
27+
animation-iteration-count: infinite;
28+
}
29+
</style>
30+
</head>
31+
<body>
32+
<button>Click here</button>
33+
<h1>Welcome </h1>
34+
</body>
35+
</html>

‎newversion-2020/lecture6/animate.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
document.addEventListener("DOMContentLoaded",function(){
2+
const h1 = document.querySelector('h1');
3+
h1.style.animationPlayState = 'paused';
4+
5+
document.querySelector('button').onclick = () => {
6+
if(h1.style.animationPlayState === "paused"){
7+
h1.style.animationPlayState = 'running';
8+
}
9+
else{
10+
h1.style.animationPlayState = 'paused';
11+
}
12+
}
13+
14+
})

‎newversion-2020/lecture6/hide/db.sqlite3‎

Whitespace-only changes.

‎newversion-2020/lecture6/hide/hide/__init__.py‎

Whitespace-only changes.

‎newversion-2020/lecture6/hide/hide/__pycache__/__init__.cpython-38.pyc‎

144 Bytes
Binary file not shown.

‎newversion-2020/lecture6/hide/hide/__pycache__/settings.cpython-38.pyc‎

2.23 KB
Binary file not shown.

‎newversion-2020/lecture6/hide/hide/__pycache__/urls.cpython-38.pyc‎

964 Bytes
Binary file not shown.

0 commit comments

Comments
 (0)