Skip to content

Instantly share code, notes, and snippets.

:octocat:
...

Michael Gerstmann webdesignberlin

View GitHub Profile
View helper.js
// Find max used z-index
[...document.querySelectorAll('*')].map(e => ~~getComputedStyle(e,null).getPropertyValue('z-index'))
// Find elements with z-index
[...document.querySelectorAll('*')].filter(e => getComputedStyle(e,null).getPropertyValue('z-index') > 0)
@webdesignberlin
webdesignberlin / nav.js
Created Jan 2, 2018
Backup old nav script - refactor or delete
View nav.js
function initNavigation(){
//var docElement = document.documentElement;
console.log('init navigation');
var currId,
idTarget,
navCurrent,
buttonOpen = document.querySelectorAll('.js-open-nav'),
topBar = document.querySelectorAll('.top-bar'),
topBarNavButton = topBar.querySelectorAll(buttonOpen),
View mapsresolve.js
export const getSuggestions = (input) => {
return new Promise((resolve, reject) => {
const empty = input.length < 3 || !window || !window.google || !window.google.maps
if (empty) resolve([])
try {
const service = new window.google.maps.places.AutocompleteService()
service.getQueryPredictions({ input }, (suggestions) => {
resolve(suggestions || [])
})
View flip.css
.element.collapsed {
height: 90px;
width: 100%;
}
.element.expanded {
top: 0;
bottom: 0;
left: 0;
width: 100%;
@webdesignberlin
webdesignberlin / demo.html
Created Jan 4, 2017
Move Image Focus via Device Orientation
View demo.html
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<title>Panorama</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="image-wrapper">
<img class="image" src="http://lorempixel.com/1920/200" alt="Just a Placeholder Image">
@webdesignberlin
webdesignberlin / awaitIdle.js
Created Dec 16, 2016 — forked from potch/awaitIdle.js
Rather rough sketch of using requestIdleCallback to break up JS execution
View awaitIdle.js
function idle(action) {
return new Promise((resolve, reject) => {
requestIdleCallback(timing => resolve(action(timing)));
});
}
async function init() {
criticalPath();
await idle(lessImportant);
await idle(nonCritical);
View accessible-menu.css
.nav__trigger[aria-expanded="false"] + .nav__menu {
/* u-visually-hidden */
border: none !important;
clip: rect(0 0 0 0) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
white-space: nowrap !important;
@webdesignberlin
webdesignberlin / sort.js
Created Nov 18, 2016 — forked from laggingreflex/sort.js
Sort github comments by reactions
View sort.js
(() => {
const q = (e, s) => e.querySelector(s);
const qA = (e, s) => e.querySelectorAll(s);
const num = e => parseInt(e.nextSibling.wholeText.trim())
const d = document.querySelector('.js-discussion.js-socket-channel');
/* uncomment one of these to sort by */
const sortBy = '+1';
// const sortBy = '-1';
// const sortBy = 'smile';
View canvasrecord.js
(function() {
let canvas = document.querySelector('canvas');
// Optional frames per second argument.
let stream = canvas.captureStream(25);
let recorder = new MediaRecorder(stream, options);
let blobs = [];
function download(blob) {
var url = window.URL.createObjectURL(blob);
var a = document.createElement('a');
View object-assign-arrays.js
const original = [0,1,2,3];
const copy = Object.assign([], original, { 2: 42 }); // [0,1,42,3]
console.log(original);
// [ 0, 1, 2, 3 ]
console.log(copy);
// [ 0, 1, 42, 3 ]
You can’t perform that action at this time.