Skip to content

Instantly share code, notes, and snippets.

View G-MontaG's full-sized avatar

Artur Osypenko G-MontaG

  • Bynder
  • Netherlands
View GitHub Profile
@G-MontaG
G-MontaG / utils.js
Created November 22, 2020 15:03
Scroll helpers and more
export function isDocumentElement(el: Element) {
return [document.documentElement, document.body, window].indexOf(el) > -1;
}
// Normalized Scroll Top
// ------------------------------
export function normalizedHeight(el: Element): number {
if (isDocumentElement(el)) {
return window.innerHeight;
@G-MontaG
G-MontaG / filter.js
Created November 22, 2020 14:47
Filter options by user input
// @flow
type Config = {
ignoreCase?: boolean,
ignoreAccents?: boolean,
stringify?: Object => string,
trim?: boolean,
matchFrom?: 'any' | 'start',
};
@G-MontaG
G-MontaG / index.jsx
Created November 22, 2020 14:04
Uncontrolled form inputs
import React from "react";
import "./styles.css";
function EditUser({ user }) {
function saveUser(ev) {
ev.preventDefault();
const elementsArray = [...ev.target.elements];
const formData = elementsArray.reduce((acc, elem) => {
if (elem.id) {
function handleFile(e) {
var files = e.target.files, f = files[0];
var reader = new FileReader();
reader.onload = function(e) {
var data = new Uint8Array(e.target.result);
var workbook = XLSX.read(data, {type: 'array'});
var json = XLSX.utils.sheet_to_json(workbook.Sheets[workbook.SheetNames[0]], { raw: true });
console.log(JSON.stringify(json));
};
reader.readAsArrayBuffer(f);
@G-MontaG
G-MontaG / blockquote.css
Created July 30, 2020 15:30
Styling Blockquote
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic);
blockquote{
font-size: 1.4em;
width:60%;
margin:50px auto;
font-family:Open Sans;
font-style:italic;
color: #555555;
padding:1.2em 30px 1.2em 75px;
border-left:8px solid #78C0A8 ;
@G-MontaG
G-MontaG / index.html
Created July 28, 2020 22:04
Skip to main content link
<body>
<a href="#content">Skip to main content</a>
<header>
</header>
<main id="content"> <!-- The skip link jumps to here -->
@G-MontaG
G-MontaG / index.html
Created July 21, 2020 20:38
Relative path demonstration
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My test page</title>
</head>
<body>
<img src="images/your-image-filename" alt="My test image">
</body>
</html>
@G-MontaG
G-MontaG / promisify.js
Created March 7, 2020 12:32
Promisify function
function promisify(fn) {
return function(...args) {
return new Promise(function (resolve, reject) {
function cb(result) {
resolve(result);
}
fn.apply(this, args.concat(cb));
});
}
@G-MontaG
G-MontaG / sleep.js
Created March 7, 2020 12:31
Sleep function
const sleep = time => new Promise((resolve) => {
setTimeout(()=>{
resolve();
}, time);
});
@G-MontaG
G-MontaG / moveElement.js
Created March 7, 2020 12:27
Movement function
function moveElement(duration, distance, element) {
const start = performance.now();
function move(currentTime) {
const elapsedTime = currentTime - start;
const progress = elapsedTime / duration;
const amountToMove = progress * distance;
element.style.transform = `translateX(${amountToMove}px)`;