Petr Tripolsky tripolskypetr

💻

Frontend dev fueled by a passion for UI/UX and art, design

React, TypeScript, Python, C++

tripolskypetr / domChanges.js

Last active February 5, 2020 15:57

JavaScript show DOM changes

	(function() {
	const visualize = (target) => {
	const {x, y, height, width} = target.getBoundingClientRect();
	const div = document.createElement('div');
	[div.style.position, div.style.opacity, div.style.zIndex] = ['fixed', 0.5, 999];
	[div.style.backgroundColor, div.style.border] = ['green', '1px solid black'];
	[div.style.height, div.style.width] = [`${height}px`, `${width}px`];
	[div.style.left, div.style.top] = [`${x}px`, `${y}px`];
	div.style.transition = 'opacity 0.5s';
	div.className = 'visualizer';

tripolskypetr / scrollbar.html

Last active February 21, 2020 14:08

Facebook like scrollbar (from here, https://codepen.io/hiago_silverio/pen/RRdJbz)

	<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
	<style>
	a.item-navbar{
	border: 1px solid #e3e3e3;
	padding: 10px 5px;
	color: #333;
	margin: 20px 0 !important;
	display: table;

tripolskypetr / web-components-commonjs.js

Created March 4, 2020 09:13

Using WebComponents without ES2015 classes with new operator

	export function OneSearchBadgePhoto() {
	const div: HTMLElement = Reflect.construct(HTMLElement, [], OneSearchBadgePhoto);
	div.innerText = 'omg';
	return div;
	}

	OneSearchBadgePhoto.prototype = Object.create(HTMLElement.prototype);
	customElements.define('one-search-badgephoto', OneSearchBadgePhoto);

	/**

tripolskypetr / generate-closure-externs.js

Last active May 23, 2020 17:39

Google Closure Compiler browser runtime externs generator

	(function (global) {

	const FUNCTION = 'FUNCTION';

	const entries = (obj, cycles, f = FUNCTION) => {
	const tree = {};
	const checkCycle = (obj, key) => cycles.find(([o, k]) => obj === o && key === k);
	Object.entries(obj).forEach(([key, value]) => {
	if (checkCycle(obj, key)) {
	return;

tripolskypetr / steida-react-externs.js

Created April 6, 2020 15:15

Clone of steida/react-externs

	/**
	* @fileoverview Closure Compiler externs for Facebook React.js 0.13.2.
	* @see http://reactjs.org
	* @externs
	*/

	/**
	* @const
	*/
	var React = {};

tripolskypetr / generate-typescript-entries.js

Last active April 11, 2020 17:14

Typescript entries from Google Closure Compiler externs generated by https://gist.github.com/tripolskypetr/ed33439520b59c5077cbdf5d0ff4ea62

	(function (global) {

	const applyUserGesture = () => new Promise((resolve) => {
	alert('Click on web page to continue');
	const handler = () => {
	document.body.removeEventListener('click', handler);
	resolve();
	}
	document.body.addEventListener('click', handler, false);
	});

tripolskypetr / console.js

Created April 15, 2020 11:20

Async console.log and console.warn

	(function (global) {

	const console = global.console;

	global.console = Object.assign(console, Object.fromEntries(Object.entries(console)
	.filter(([key]) => ['log', 'warn'].includes(key))
	.map(([key, value]) => [key, (...args) => requestIdleCallback(() => value(...args))])));


	})(window);

tripolskypetr / youtube-capture.js

Created May 11, 2020 13:17

Capture youtube video frame

	(function (global) {

	const save = (blob, name = 'image.png') => {
	const a = document.createElement("a");
	a.href = URL.createObjectURL(blob);
	a.download = name;
	a.click();
	};

	const capture = (video, format, quality) => {

tripolskypetr / webrtc-interception

Created May 11, 2020 15:58

WebRTC media interception

	(function() {
	window.RTCPeerConnectionBackup = window.RTCPeerConnectionBackup \|\| window.RTCPeerConnection;
	window.RTCPeerConnectionArray = window.RTCPeerConnectionArray \|\| [];
	window.RTCPeerConnection = class extends RTCPeerConnectionBackup {
	constructor(...args) {
	super(...args);
	window.RTCPeerConnectionArray.push(this)
	}
	}
	)();

tripolskypetr / transparentImage.html

Last active May 25, 2020 15:13

Transparent image https://jsfiddle.net/7haLkg6s/