Serhiy Illarionov maplemap

## seconds-to-HHMMSS.js
String.prototype.toHHMMSS = function () {
    var sec_num = parseInt(this, 10); // don't forget the second param
    var hours   = Math.floor(sec_num / 3600);
    var minutes = Math.floor((sec_num - (hours * 3600)) / 60);
    var seconds = sec_num - (hours * 3600) - (minutes * 60);

    if (hours   < 10) {hours   = "0"+hours;}
    if (minutes < 10) {minutes = "0"+minutes;}
    if (seconds < 10) {seconds = "0"+seconds;}
    var time    = hours+':'+minutes+':'+seconds;

## transfer-connections-down.html
<body onload="onload();">

<script>
    function onLoad() {
        var head = document.getElementsByTagName("head")[0];
        var css = document.createElement("link");
        css.href = "./css/bundle.css";
        css.type = "text/css";
        css.rel = "stylesheet";
        css.async = true;

## react-redux-middleware.js
import React from 'react'
import ReactDOM from 'react-dom'
import { createStore, applyMiddleware } from 'redux'
import Counter from './components/Counter'
import counter from './reducers'

const customMiddleWare = store => next => action => {
  console.log("Middleware triggered:", action);
  next(action);
}

## isElementInViewport.js
/*
No jQuery necessary.
Thanks to Dan's StackOverflow answer for this:
http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport

This solution was tested on IE7+, iOS5+ Safari, Android2+, Blackberry, Opera Mobile, and IE Mobile
*/

function isElementInViewport(el) {
  var rect = el.getBoundingClientRect();

## pattern-visitor.js
/**
 *
 * ПАТТЕРН ПОСЕТИТЕЛЬ (visitor)
 *
 * ПОСЕТИТЕЛЬ — используется для расширения возможностей комбинации объектов, т.е. паттерн Посетитель позволяет
 * добавлять объектам дополнительные операции, не изменяя их исходный код.
 *
 * Когда вам нужно выполнить какую-то операцию над всеми элементами сложной структуры объектов, например, деревом.
 * Посетитель позволяет применять одну и ту же операцию к объектам различных классов. ИЛИ когда новое поведение имеет
 * смысл только для некоторых классов из существующей иерархии.

## pattern-memento.js
/**
 *
 * ПАТТЕРН ХРАНИТЕЛЬ (memento)
 *
 * Паттерн ХРАНИТЕЛЬ (memento) -  Паттерн Хранитель используется для реализации возврата к одному из предыдущих
 * состояний (например, если пользователь выполнил команду «Отменить»).
 * Хранитель – это объект, в котором сохраняется внутреннее состояния другого объекта – хозяина хранителя. Для работы
 * механизма отката нужно, чтобы хозяин предоставил хранитель, когда возникнет необходимость записать контрольную точку
 * состояния хозяина. Только хозяину разрешено помещать в хранитель информацию и извлекать ее оттуда, для других
 * объектов хранитель непрозрачен.

## pattern-mediator.js
/**
 *
 * ПАТТЕРН ПОСРЕДНИК (mediator)
 *
 * Паттерн ПОСРЕДНИК (mediator) -  это поведенческий паттерн проектирования, который позволяет уменьшить связанность
 * множества классов между собой, благодаря перемещению этих связей в один класс-посредник.
 * Паттерн Посредник используется для централизации сложных взаимодействий и управляющих операций между объектами.
 * Один из модулей медиатора изменяет состояние -> оповещает об этом медиатор -> медиатор оповещает об этом другие
 * модули, которым положено знать о случившемся.
 * Довольно популярна реализация Посредника при помощи Наблюдателя. При этом объект посредника будет выступать

## pattern-flyweight.js

/**
 *
 * ПАТТЕРН ПРИСПОСОБЛЕНЕЦ/ЛЕГКОВЕС (Flyweight)
 *
 * Паттерн ПРИСПОСОБЛЕНЕЦ/ЛЕГКОВЕС -  структурный шаблон проектирования, при котором объект, представляющий себя как
 * уникальный экземпляр в разных местах программы, по факту не является таковым.
 * Данный паттерн проектирования позволяет вместить большее количество объектов в отведённую оперативную память.
 * Легковес экономит память, разделяя общее состояние объектов между собой, вместо хранения одинаковых данных в
 * каждом объекте.

## pattern-bridge.js
/**
 *
 * ПАТТЕРН МОСТ (bridge)
 *
 * Паттерн МОСТ - отделяет абстракцию от реализации, благодаря чему появляется возможность независимо изменять то и
 * другое. Это структурный паттерн проектирования, который разделяет один или несколько классов на две отдельные
 * иерархии — абстракцию и реализацию, позволяя изменять их независимо друг от друга.
 * Например у нас есть класс Круг, и мы хотим создавать круги разного цвета, для этого нужно будет создать подклассы
 * Синий Круг, Желтый круг и т.д. А если потом появятся квадраты и треугольники, то для них тоже нужно будет создавать
 * большое количество подклассов. В итоге иерархия будет огромной. Логичнее создать две независимых иерархии -

## pattern-proxy.js
/**
 *
 * ПАТТЕРН ЗАМЕСТИТЕЛЬ (proxy)
 * Предоставляет суррогатный объект, управляющий доступом к другому объекту.
 *
 * Заместитель это обертка, которая применяется в следующих случаях:
 * 1. Ленивая инициализация (виртуальный прокси). Когда у вас есть тяжёлый объект,
 * грузящий данные из файловой системы или базы данных.
 * 2. Защита доступа (защищающий прокси). Когда в программе есть разные типы пользователей, и вам хочется
 * защищать объект от неавторизованного доступа. Прокси может проверять доступ при каждом вызове и передавать
	String.prototype.toHHMMSS = function () {
	var sec_num = parseInt(this, 10); // don't forget the second param
	var hours = Math.floor(sec_num / 3600);
	var minutes = Math.floor((sec_num - (hours * 3600)) / 60);
	var seconds = sec_num - (hours * 3600) - (minutes * 60);

	if (hours < 10) {hours = "0"+hours;}
	if (minutes < 10) {minutes = "0"+minutes;}
	if (seconds < 10) {seconds = "0"+seconds;}
	var time = hours+':'+minutes+':'+seconds;
	<body onload="onload();">

	<script>
	function onLoad() {
	var head = document.getElementsByTagName("head")[0];
	var css = document.createElement("link");
	css.href = "./css/bundle.css";
	css.type = "text/css";
	css.rel = "stylesheet";
	css.async = true;
	import React from 'react'
	import ReactDOM from 'react-dom'
	import { createStore, applyMiddleware } from 'redux'
	import Counter from './components/Counter'
	import counter from './reducers'

	const customMiddleWare = store => next => action => {
	console.log("Middleware triggered:", action);
	next(action);
	}
	/*
	No jQuery necessary.
	Thanks to Dan's StackOverflow answer for this:
	http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport

	This solution was tested on IE7+, iOS5+ Safari, Android2+, Blackberry, Opera Mobile, and IE Mobile
	*/

	function isElementInViewport(el) {
	var rect = el.getBoundingClientRect();
	/**
	*
	* ПАТТЕРН ПОСЕТИТЕЛЬ (visitor)
	*
	* ПОСЕТИТЕЛЬ — используется для расширения возможностей комбинации объектов, т.е. паттерн Посетитель позволяет
	* добавлять объектам дополнительные операции, не изменяя их исходный код.
	*
	* Когда вам нужно выполнить какую-то операцию над всеми элементами сложной структуры объектов, например, деревом.
	* Посетитель позволяет применять одну и ту же операцию к объектам различных классов. ИЛИ когда новое поведение имеет
	* смысл только для некоторых классов из существующей иерархии.
	/**
	*
	* ПАТТЕРН ХРАНИТЕЛЬ (memento)
	*
	* Паттерн ХРАНИТЕЛЬ (memento) - Паттерн Хранитель используется для реализации возврата к одному из предыдущих
	* состояний (например, если пользователь выполнил команду «Отменить»).
	* Хранитель – это объект, в котором сохраняется внутреннее состояния другого объекта – хозяина хранителя. Для работы
	* механизма отката нужно, чтобы хозяин предоставил хранитель, когда возникнет необходимость записать контрольную точку
	* состояния хозяина. Только хозяину разрешено помещать в хранитель информацию и извлекать ее оттуда, для других
	* объектов хранитель непрозрачен.
	/**
	*
	* ПАТТЕРН ПОСРЕДНИК (mediator)
	*
	* Паттерн ПОСРЕДНИК (mediator) - это поведенческий паттерн проектирования, который позволяет уменьшить связанность
	* множества классов между собой, благодаря перемещению этих связей в один класс-посредник.
	* Паттерн Посредник используется для централизации сложных взаимодействий и управляющих операций между объектами.
	* Один из модулей медиатора изменяет состояние -> оповещает об этом медиатор -> медиатор оповещает об этом другие
	* модули, которым положено знать о случившемся.
	* Довольно популярна реализация Посредника при помощи Наблюдателя. При этом объект посредника будет выступать

	/**
	*
	* ПАТТЕРН ПРИСПОСОБЛЕНЕЦ/ЛЕГКОВЕС (Flyweight)
	*
	* Паттерн ПРИСПОСОБЛЕНЕЦ/ЛЕГКОВЕС - структурный шаблон проектирования, при котором объект, представляющий себя как
	* уникальный экземпляр в разных местах программы, по факту не является таковым.
	* Данный паттерн проектирования позволяет вместить большее количество объектов в отведённую оперативную память.
	* Легковес экономит память, разделяя общее состояние объектов между собой, вместо хранения одинаковых данных в
	* каждом объекте.
	/**
	*
	* ПАТТЕРН МОСТ (bridge)
	*
	* Паттерн МОСТ - отделяет абстракцию от реализации, благодаря чему появляется возможность независимо изменять то и
	* другое. Это структурный паттерн проектирования, который разделяет один или несколько классов на две отдельные
	* иерархии — абстракцию и реализацию, позволяя изменять их независимо друг от друга.
	* Например у нас есть класс Круг, и мы хотим создавать круги разного цвета, для этого нужно будет создать подклассы
	* Синий Круг, Желтый круг и т.д. А если потом появятся квадраты и треугольники, то для них тоже нужно будет создавать
	* большое количество подклассов. В итоге иерархия будет огромной. Логичнее создать две независимых иерархии -
	/**
	*
	* ПАТТЕРН ЗАМЕСТИТЕЛЬ (proxy)
	* Предоставляет суррогатный объект, управляющий доступом к другому объекту.
	*
	* Заместитель это обертка, которая применяется в следующих случаях:
	* 1. Ленивая инициализация (виртуальный прокси). Когда у вас есть тяжёлый объект,
	* грузящий данные из файловой системы или базы данных.
	* 2. Защита доступа (защищающий прокси). Когда в программе есть разные типы пользователей, и вам хочется
	* защищать объект от неавторизованного доступа. Прокси может проверять доступ при каждом вызове и передавать