Dimitrios Kalkasinas desinas

- Information Technology / Bachelor’ s Degree in Computer Science - Master in Business Administration The University of Sheffield, UK

desinas / avoidManyEvents.js

Last active June 12, 2023 20:17

Avoid too many events & Event Delegation - Working w Browser Events - Udacity FrontENDev

	const myCustomDiv = document.createElement('div');

	function respondToTheClick(evt) {
	console.log('A paragraph was clicked: ' + evt.target.textContent);
	}

	for (let i = 1; i <= 200; i++) {
	const newElement = document.createElement('p');
	newElement.textContent = 'This is paragraph number ' + i;

desinas / pattern-layout-offcanvas.html

Created March 6, 2018 12:23

media screen Off-Canvas Layout pattern responsive - FEWDev Udacity Lesson 14

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title></title>
	<style type="text/css">
	@import url(https://fonts.googleapis.com/css?family=Roboto);

	html, body {

desinas / pattern-layaout-shifter.html

Created March 6, 2018 11:20

media screen Layout Shifter pattern responsive - FEWDev Udacity Lesson 14

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<title>Mostly Fluid - Quiz</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style type="text/css">
	/*
	These are the default styles. No need to change these.
	*/

desinas / pattern-mostly-fluid-quiz-blankcss.html

Last active March 6, 2018 10:21

media screen Layout pattern responsive - FEWDev Udacity Lesson 14

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<title>Mostly Fluid - Quiz</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style type="text/css">
	/*
	These are the default styles. No need to change these.
	*/

desinas / animation.js

Last active February 10, 2018 12:36

try jQuery by Code school / Styling / Animation

	//5.8 Animate I, 5.9 Animate II, 5.10 Animation Speed, 5.11 Animate III
	$(document).ready(function() {
	$('.tour').on('mouseenter', function() {
	$(this).addClass('highlight');
	$(this).find('.per-night').animate({'top': '-14px', 'opacity': '1'}, 'fast'); //adding one more key/value to this object representing a top of -14px
	});
	$('.tour').on('mouseleave', function() {
	$(this).removeClass('highlight');
	$(this).find('.per-night').animate({'top': '0px', 'opacity': '0'}, 'fast');
	});

desinas / tamingCss.js

Last active February 10, 2018 11:59

try jQuery by Code school / Styling / Taming CSS

	//5.3 CSS I, 5.4 CSS II, 5.5 Show Photo, 5.6 Refactoring to CSS
	$(document).ready(function() {
	$('.tour').on('mouseenter', function() {
	$(this).addClass('highlight'); //We've extracted out our styles into a new CSS class called highlight.
	$(this).find('.photos').show();
	});
	$('.tour').on('mouseleave', function() {
	$(this).removeClass('highlight');
	});
	});

desinas / linkLayover.js

Last active February 10, 2018 10:28

try jQuery by Code school / Listening to DOM events / Link Layover

	//4.18 Link Events I, 4.19 Link Events II
	// 4.20 Event Parameter I, 4.21 Event Parameter II
	$(document).ready(function() {
	$('.see-photos').on('click', function(event) {
	event.stopPropagation(); //use that event to stop the second event handler from being called
	event.preventDefault(); //prevent the browser from jumping to the top of the page when the link is clicked
	$(this).closest('.tour').find('.photos').slideToggle();
	});
	$('.tour').on('click', function() {
	alert('This event handler should not be called.');

desinas / keyUpEvent.js

Last active January 30, 2018 11:04

try jQuery by Code school / Listening to DOM events / keyboard events

	//chapt4.13 Keyup Event, 4.14 Keyup Event Handler I,
	// 4.15 Keyup Event Handler II, 4.16 Another Event Handler
	$(document).ready(function() {
	$('#nights').on('keyup', function() {
	var nights = +$(this).val();
	var dailyPrice = +$(this).closest('.tour').data('daily-price');
	$('#total').text(nights * dailyPrice);
	$('#nights-count').text($(this).val());
	});
	$('#nights').on('focus', function() {

desinas / mouseover-leave.js

Last active January 30, 2018 11:02

try jQuery by Code school / Listening to DOM events / expanding on on()

	//chapt4.8 Mouseover I, 4.9 Mouseover II, 4.10 Mouseleave, 4.11 Named Functions
	$(document).ready(function() {
	$('#tour').on('click', 'button', function() {
	$('.photos').slideToggle();
	});

	function showPhotos() {
	$(this).find('span').slideToggle();
	}

desinas / centuryFromYear.java

Created January 16, 2018 10:52

Get the century, given the year

	// Given a year, return the century it is in. The first century spans from the year 1
	// up to and including the year 100, the second - from the year 101 up to
	// and including the year 200, etc.

	int centuryFromYear(int year) {
	double century; //typecasting year to double precision
	century = (double)year / 100; // and divide it by 100
	century = Math.ceil(century);// and get the ceiling of it
	return (int)century;
	}