Ashish Nandan Singh sirdarthvader

🤷‍♂️

console.log(NaN === NaN); //-> false

Humorous Being

sirdarthvader / App.js

Created March 26, 2018 23:49

Initial state of App Component before adding any new code.

	import React, { Component } from 'react';
	import logo from './logo.svg';
	import './App.css';

	class App extends Component {
	render() {
	return (
	<div className="App">
	<header className="App-header">
	<img src={logo} className="App-logo" alt="logo" />

sirdarthvader / index.js

Created March 26, 2018 23:57

Initial state for index.js file

	import React from 'react';
	import ReactDOM from 'react-dom';
	import './index.css';
	import App from './App';
	import registerServiceWorker from './registerServiceWorker';

	ReactDOM.render(<App />, document.getElementById('root'));
	registerServiceWorker();

sirdarthvader / index.html

Created March 26, 2018 23:59

Initial and final state for index.html

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<meta name="theme-color" content="#000000">
	<!--
	manifest.json provides metadata used when your web app is added to the
	homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
	-->

sirdarthvader / Navigation.js

Last active March 27, 2018 00:33

sirdarthvader / index.html

Created April 1, 2018 21:59

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>HTML5 Canvas</title>
	<link rel="stylesheet" href="style.css" />
	</head>
	<body>
	<canvas id="canvas" width="800" height="800"></canvas>
	<script src="app.js"></script>

sirdarthvader / app1.js

Created April 1, 2018 22:07

	const canvas = document.querySelector('#canvas');
	const ctx = canvas.getContext('2d');

	canvas.width = window.innerWidth;
	canvas.height = window.innerHeight;

	ctx.strokeStyle = '#BADA55';
	ctx.lineWidth = 1;
	ctx.lineJoin = 'round';
	ctx.lineCap = 'round';

sirdarthvader / app2.js

Created April 1, 2018 22:39

	let isDrawing = false;

	function draw (e) {
	if(!isDrawing) return ;
	console.log(e);
	}

	canvas.addEventListener('mousemove', draw);
	canvas.addEventListener('mousedown', () => isDrawing = true);
	});

sirdarthvader / app3.js

Created April 1, 2018 22:58

sirdarthvader / app4.js

Last active April 1, 2018 23:38

	function draw (e) {
	if(!isDrawing) return ;
	console.log(e);
	ctx.beginPath();
	ctx.moveTo(lastX, lastY);
	ctx.lineTo(e.offsetX, e.offsetY);
	ctx.stroke();
	[lastX, lastY] = [e.offsetX, e.offsetY];
	}

sirdarthvader / app5.js

Last active April 1, 2018 23:52

	let hue = 0;
	let direction = true;

	function draw (e) {
	if(!isDrawing) return ;
	console.log(e);
	ctx.strokeStyle = `hsl(${hue}, 100%, 50%)`;
	ctx.beginPath();
	ctx.moveTo(lastX, lastY);
	ctx.lineTo(e.offsetX, e.offsetY);