Skip to content

Instantly share code, notes, and snippets.

@peponi
peponi / debug-focus-in-cms.js
Created August 19, 2021 07:56
Debug :focus in CMS
var css = document.createElement('style');
css.type = 'text/css';
var styles = 'a:focus {background: blue}';
if (css.styleSheet) css.styleSheet.cssText = styles;
else css.appendChild(document.createTextNode(styles));
document.getElementsByTagName("head")[0].appendChild(css);
@peponi
peponi / GifAnimationHandler.js
Last active August 17, 2021 13:34
deactivate all animated GIFs on the page after 5 sec
// needs https://github.com/liddiard/preview-gif
const GifAnimationHandler = function({timeoutInSec = 5000} = {}) {
const self = this;
const allImgs = document.querySelectorAll("img");
self.deactivateAnimatedGifs = (gifNodeList) => {
gifNodeList.forEach(gif => {
PreviewGIF(gif.dataset.src, (err, imageData) => {
if (err) console.error(err);
@peponi
peponi / details.polyfill.js
Last active May 6, 2019 12:41
details element polyfill for IE11, supoorts elements inside summary
/**
* based on
* @url https://github.com/rstacruz/details-polyfill
* @todo https://www.sitepoint.com/fixing-the-details-element/
* @todo https://www.smashingmagazine.com/2014/11/complete-polyfill-html5-details-element/
*/
const detailsPolyfillEs6 = ({
CSS_CLASS = 'no-details',
CSS_STRING = false,
@peponi
peponi / is.js
Last active May 6, 2019 12:36
is.js - es6 - just browser detection, nothing elese
// based on https://github.com/arasatasaygin/is.js/blob/master/is.js
// this is a cut off minimal version
const userAgent = (navigator && navigator.userAgent.toLowerCase()) || '';
const vendor = (navigator && navigator.vendor || '').toLowerCase();
// build a 'comparator' object for various comparison checks
const comparator = {
'<': (a, b) => a < b,
'<=': (a, b) => a <= b,
const l = localStorage
const crappyStore = {
get: (key) => JSON.parse(l.getItem(key)),
set: (key, data) => l.setItem(key, JSON.stringify(data)),
rm: (key) => l.removeItem(key),
getKeysFor: (prefix) => {
const ret = []
for (let key in l) {
ret.push(key)
@peponi
peponi / README.md
Last active October 17, 2018 12:21
prevent doubeled objects in array
@peponi
peponi / store.js
Created October 2, 2018 12:29
simple one level immutable store object
const store = {
storageIndex: undefined,
debug: false,
state: Object.freeze({
}),
setState(keyword, value) {
if (this.debug) console.log(`STATE: ${keyword}:`, value); // eslint-disable-line no-console
const newObject = Object.assign({}, this.state, { [keyword]: value });
this.state = Object.freeze(newObject);
if (this.storageIndex) localStorage.setItem(this.storageIndex, JSON.stringify(newObject));
@peponi
peponi / device_metrics.scss
Created January 19, 2016 14:31
lsit of constans for device metrics ios & android
/* GENERAL DEVICE CONSTANTS
##################################################################################################################### */
/*
* iOS
*/
// iOS metrics
$ios-status-bar-height: em-calc(20);
$ios-nav-bar-height: em-calc(44);
@peponi
peponi / gulp-task-to-create-git-tags.js
Created January 13, 2016 13:46
a simple gulp task to set & overwrite git tags on remote
// set a git tag & overwrite if already set
gulp.task('push-tag', function(cb) {
if(process.argv[3] !== '--tag' ) {
console.error('ERROR: no "--tag" parameter found');
} else if (process.argv[4] == undefined ) {
console.error('ERROR: no tag name found in parameter');
} else {
exec( 'git tag -d ' + process.argv[4] +
';git push origin :refs/tags/' + process.argv[4] +
@peponi
peponi / detect-orientation.js
Created January 13, 2016 13:03
A small helper, which detects orientation of viewport. Sets 'is-landscape' or 'is-portrait' to the html element.
'use strict';
(function(){
window.NIJS = window.NIJS || {};
NIJS.detection = NIJS.detection || {};
var html = document.getElementsByTagName('html')[0],
removeClass = function(str, className){
var classArr = str.split(' '),