codebubb codebubb

🎯

Focusing

codebubb / fizzbuzz-iterator.js

Created November 25, 2019 16:41

FizzBuzz Iterator

	const fizzBuzz = {
	[Symbol.iterator]() {
	let i=0;
	return {
	next() {
	return { done: i++ >= 100, value: i % 15 === 0 ? 'FizzBuzz' : i % 5 === 0 ? 'Buzz' : i % 3 === 0 ? 'Fizz' : i };
	}
	}
	}
	}

codebubb / classes-2.js

Created November 19, 2019 14:23

Class Inheritance

	class User {
	constructor(name, password, loggedIn = false) {
	this.username = name;
	this._password = password;
	this.loggedIn = loggedIn;
	}

	set password (pwd) { this._password = pwd };
	get password () { return '*'.repeat(this._password.length); };

codebubb / classes-1.js

Last active November 19, 2019 14:18

Simple Class Example

	class User {
	constructor(username, password, loggedIn = false) {
	this.username = username;
	this._password = password;
	this.loggedIn = loggedIn;
	}

	set password (pwd) { this._password = pwd };
	get password () { return '*'.repeat(this._password.length); };

codebubb / firstwordtitle.js

Created October 8, 2019 11:30

First word title case, other words uppercase.

	const firstWordTitleCase = str => str.split(' ').map((word, index) => index === 0 ? word[0].toUpperCase() + word.slice(1).toLowerCase() : word.toUpperCase()).join(' ');

	'This is bird.it can fly.thank you.'.split('.').filter(line => line).map(firstWordTitleCase).join('\n');

codebubb / scrollimage.html

Created September 30, 2019 16:37

Scroll transition image

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>
	<style>
	body {
	margin: 0;

codebubb / hover.html

Created September 23, 2019 14:18

Hover with JavaScript

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Hover with JavaScript</title>
	<style>
	#hoverlink {
	padding: 5px;

codebubb / moveblock.js

Created September 16, 2019 09:41

how to move an object with arrow keys in javascript

	// <div id="block" style="position: absolute; top: 0; left: 0; width: 100px; height: 100px; background-color: red;"></div>

	<script>
	let modifier = 5;
	window.addEventListener('keydown', (event) => {
	const { style } = block;
	switch(event.key) {
	case 'ArrowUp': style.top = `${parseInt(style.top) - modifier}px`; break;
	case 'ArrowDown': style.top = `${parseInt(style.top) + modifier}px`; break;
	case 'ArrowLeft': style.left = `${parseInt(style.left) - modifier}px`; break;

codebubb / emailValidate.js

Created September 16, 2019 08:51

Validate Emails with JavaScript

	// Really simple validation
	const simpleEmailRegex = /\S+@\S+\.\S+/;
	simpleEmailRegex.test('[email protected]'); // true

	// Complex validation
	const complexEmailRegex = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)\|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])\|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
	complexEmailRegex.test('[email protected]'); // true

	// Source: https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript

codebubb / encodeHTML.js

Created September 16, 2019 08:06

Encode HTML Entities with JavaScript

const encodeHTML = str => str.replace(/[\u00A0-\u9999<>\&]/gim, (i) => `&#${i.charCodeAt(0)};`);

codebubb / today.js

Created September 6, 2019 12:44

Get today's date in JavaScript

	const today = new Date();
	const dd = String(today.getDate()).padStart(2, '0');
	const mm = String(today.getMonth() + 1).padStart(2, '0');
	const yyyy = today.getFullYear();

	const todayDate = `${dd}/${mm}/${yyyy}`;