Paolo Priotto depoulo

## gif.php
// get random image from Giphy
function getRandomGif($topic = 'fail') {
    $data = file_get_contents("http://giphy.com/search/$topic");
    preg_match_all('@href="/gifs/(.*?)"@', $data, &$matches);
    $gifId = $matches[1][array_rand($matches[1])];
    return "http://media2.giphy.com/media/$gifId/giphy.gif";
}

## gist:5832073
@import "compass/css3/images";

// CSS-only multi-line ellipsis with generated content
// yields `position:relative`, so remember to declare an eventual `position:absolute/fixed` *after* including this mixin
@mixin limitLines(
    $maxLinesPortrait, // Mandatory: The number of lines after which the clipping should take action.
    $maxLinesLandscape: $maxLinesPortrait, // You may provide a different line limit for landscape orientation.
        // Note that 'portrait' is our default orientation. However, if you omit $maxLinesLandscape,
        // the value of $maxLinesPortrait is used for whatever orientation (that is, without a media query).

## compare-html-bodys-with-branch.sh
#!/bin/bash

if [[ $# -eq 0 ]] ; then
  echo 'No branchname provided.'
  exit 0
fi

themes=( editorial limelight neutral spotlight structure uptown vision )
fattyPages=( en p/apple-jam-with-gallery p/apple-jam-without-gallery p/t-shirt-includes-basic-product-type p/navy-shoes search search?q=* l/contact i/about-us c/category cart unknown )
skinnyPages=( i/home p/test-product p/neues-produkt p/product-with-video p/refrence-price-test-product-1 search search?q=prod l/contact i/about-us p/unknown i/unknown cart unknown checkout/personal-data checkout/shipping checkout/payment checkout/confirmation )

## serviceworker.js
try {
  document.body.innerHTML =
    '<div id="sw-failure" style="z-index: 1; position: fixed; pointer-events: none">ServiceWorker failed</div>'
    + document.body.innerHTML
} catch (_err) {
  console.log('Hello from ServiceWorker', String(registration))
}

## tracking-orders-to-console.js
if(window.eComEventTarget){window.eComEventTarget.addEventListener('order:completed',function(event){console.log('order completed:',event.detail)})}

## color-contrast.css
/*
  The CSS4 contrast adjuster mimicked with just custom properties and calc().
  While it's pretty straightforward to mimick the hue, saturation and
  lightness adjusters, color contrast requires some "serious" math.
  Results are not perfect, but very much usable IMHO.
  Syntax of course is even more bloated than for the simple adjusters stated above.
*/
html::before {
  /* A few demo styles. */
  position: fixed;

## create-100kb-of-random-text.sh
# Windows (Git bash)
dd if=/dev/urandom of=tmp bs=100kB count=1 && base64 tmp > big && rm tmp && cat big > /dev/clipboard && rm big
# Mac OS
dd if=/dev/urandom of=tmp bs=100kB count=1 && base64 tmp > big && rm tmp && cat big | pbcopy && rm big

## MySQL-query-log.sql
set global general_log = 1;
set global log_output = 'table';
--
select event_time, substring(argument,1,100) from mysql.general_log where event_time > time('08:58');
--
SET global general_log = 0;

## console-paste-styles.js
(() => {
  var style = document.createElement("style");
  style.appendChild(document.createTextNode(""));
  document.head.appendChild(style);
  var rules = prompt('Paste CSS rules here');
  var importStatements = (rules.split(';') || []).filter(s => s.startsWith('@import')).map(s => s + ';');
  importStatements.forEach((importStatement, index) => style.sheet.insertRule(importStatement, index));
  style.sheet.insertRule(`@media all{${rules}`, importStatements.length);
}())

## gist:d8c79e180b269b237803303122feee07
Browser unresponsive when large amount of text is inside text input field.

1. Visit this page: data:text/html,<!doctype html><html style="min-height: 300vh"><input autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" type="text"></input>
2. Paste a large amount of text (between 10k and 100k characters, depending on your machine) into the text input.
3. Try repositioning the cursor, or scrolling
=> You'll experience serious lag, whereas Chrome on Mac OS, as well as other browsers, are just fine.
	// get random image from Giphy
	function getRandomGif($topic = 'fail') {
	$data = file_get_contents("http://giphy.com/search/$topic");
	preg_match_all('@href="/gifs/(.*?)"@', $data, &$matches);
	$gifId = $matches[1][array_rand($matches[1])];
	return "http://media2.giphy.com/media/$gifId/giphy.gif";
	}
	@import "compass/css3/images";

	// CSS-only multi-line ellipsis with generated content
	// yields `position:relative`, so remember to declare an eventual `position:absolute/fixed` after including this mixin
	@mixin limitLines(
	$maxLinesPortrait, // Mandatory: The number of lines after which the clipping should take action.
	$maxLinesLandscape: $maxLinesPortrait, // You may provide a different line limit for landscape orientation.
	// Note that 'portrait' is our default orientation. However, if you omit $maxLinesLandscape,
	// the value of $maxLinesPortrait is used for whatever orientation (that is, without a media query).
	#!/bin/bash

	if [[ $# -eq 0 ]] ; then
	echo 'No branchname provided.'
	exit 0
	fi

	themes=( editorial limelight neutral spotlight structure uptown vision )
	fattyPages=( en p/apple-jam-with-gallery p/apple-jam-without-gallery p/t-shirt-includes-basic-product-type p/navy-shoes search search?q=* l/contact i/about-us c/category cart unknown )
	skinnyPages=( i/home p/test-product p/neues-produkt p/product-with-video p/refrence-price-test-product-1 search search?q=prod l/contact i/about-us p/unknown i/unknown cart unknown checkout/personal-data checkout/shipping checkout/payment checkout/confirmation )
	try {
	document.body.innerHTML =
	'<div id="sw-failure" style="z-index: 1; position: fixed; pointer-events: none">ServiceWorker failed</div>'
	+ document.body.innerHTML
	} catch (_err) {
	console.log('Hello from ServiceWorker', String(registration))
	}
	/*
	The CSS4 contrast adjuster mimicked with just custom properties and calc().
	While it's pretty straightforward to mimick the hue, saturation and
	lightness adjusters, color contrast requires some "serious" math.
	Results are not perfect, but very much usable IMHO.
	Syntax of course is even more bloated than for the simple adjusters stated above.
	*/
	html::before {
	/* A few demo styles. */
	position: fixed;
	# Windows (Git bash)
	dd if=/dev/urandom of=tmp bs=100kB count=1 && base64 tmp > big && rm tmp && cat big > /dev/clipboard && rm big
	# Mac OS
	dd if=/dev/urandom of=tmp bs=100kB count=1 && base64 tmp > big && rm tmp && cat big \| pbcopy && rm big
	set global general_log = 1;
	set global log_output = 'table';
	--
	select event_time, substring(argument,1,100) from mysql.general_log where event_time > time('08:58');
	--
	SET global general_log = 0;
	(() => {
	var style = document.createElement("style");
	style.appendChild(document.createTextNode(""));
	document.head.appendChild(style);
	var rules = prompt('Paste CSS rules here');
	var importStatements = (rules.split(';') \|\| []).filter(s => s.startsWith('@import')).map(s => s + ';');
	importStatements.forEach((importStatement, index) => style.sheet.insertRule(importStatement, index));
	style.sheet.insertRule(`@media all{${rules}`, importStatements.length);
	}())
	Browser unresponsive when large amount of text is inside text input field.

	1. Visit this page: data:text/html,<!doctype html><html style="min-height: 300vh"><input autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" type="text"></input>
	2. Paste a large amount of text (between 10k and 100k characters, depending on your machine) into the text input.
	3. Try repositioning the cursor, or scrolling
	=> You'll experience serious lag, whereas Chrome on Mac OS, as well as other browsers, are just fine.