alterebro

I am attesting that this GitHub handle alterebro is linked to the Tezos account tz2BUeVRyvnCMwkRTVG24hssSGXPL6ao9HRF for tzprofiles

sig:spsig1VagJ4VsjoYcy9Bj5LKhH5dnKMQ4b6k3cXeSXKr4iVpFz45tF4NjVmLCQe3BZ922MSp3vzkLEdHCUdibxXBLFFp71KZH9c

alterebro

/* 
mini.css (@alterebro) 

https://git.io/mini.css // returns wrong mime type. Use the one below
https://gistcdn.githack.com/alterebro/85f4271ce1bdfbbdd4689f02a71d0571/raw/mini.css (https://bit.ly/3wgknNz)
*/

body { 
    max-width: 42rem; 
    margin: 0 auto; 

alterebro

// -------------------------------------
// The amazing always useful LERP function:
function lerp (start, end, t) {
    return start * (1 - t) + end * t;
}

// -------------------------------------
const linearInterpolation = function(canvas) {

    // Options

alterebro

Image lazy loading stuff

• IntersectionObserver

  • Intersection Observer API : https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
  • Polyfill : https://github.com/w3c/IntersectionObserver/tree/master/polyfill
  • Sample : https://googlechrome.github.io/samples/intersectionobserver/

• Five Techniques to Lazy Load Images for Website Performance: https://www.sitepoint.com/five-techniques-lazy-load-images-website-performance/

• How to Build Your Own Progressive Image Loader (default blured image):

alterebro

- RESAMPLE 			: ffmpeg -i [INPUT] -b:v 800k -b:a 128k [OUTPUT]
- RESAMPLE (codecs) : ffmpeg -i [INPUT] -c:v libx264 -preset medium -b:v 1M -c:a aac -b:a 64k [OUTPUT]
- NOISE 			: ffmpeg -i [INPUT] -codec:v copy -codec:a copy -bsf:a noise [OUTPUT]
- CUT 				: ffmpeg -i [INPUT] -ss 30 -c copy -t 180 [OUTPUT]
- CUT (sec)			: ffmpeg -i [INPUT] -ss 00:00:05 -t 00:00:35 -async 1 -c copy cut.mp4
- SEGMENTS 			: ffmpeg -i [INPUT] -c copy -map 0 -segment_time 3 -f segment clip%04d.mp4
- CONCAT 			: ffmpeg -f concat -i files.txt -c copy [OUTPUT]
- SCALE 			: ffmpeg -i [INPUT] -vf scale=640:360 [OUTPUT]
- SPEED :
	ffmpeg -i [input] -filter_complex "[0:v]setpts=0.5*PTS[v];[0:a]atempo=2.0[a]" -map "[v]" -map "[a]" out-fast.mp4

alterebro

init

# init project
$ npm init -y

# save dependencies
$ npm install --save-dev babel-core babel-loader babel-preset-es2015 css-loader extract-text-webpack-plugin html-webpack-plugin style-loader webpack 

alterebro

// FROM : https://gist.github.com/mathewbyrne/1280286
function slugify(text) {
  return text.toString().toLowerCase()
    .replace(/\s+/g, '-')           // Replace spaces with -
    .replace(/[^\w\-]+/g, '')       // Remove all non-word chars
    .replace(/\-\-+/g, '-')         // Replace multiple - with single -
    .replace(/^-+/, '')             // Trim - from start of text
    .replace(/-+$/, '');            // Trim - from end of text
}

alterebro

// Setup operaDetect object
var operaDetect = new Object;

// Check if current browser is Opera
operaDetect.isOpera = !!window.opera |
					  !!window.opr |
					  ( navigator.userAgent.indexOf(' OPR/') > -1 ) |
					  ( navigator.userAgent.indexOf(' Coast/') > -1 ) |
					  ( navigator.userAgent.indexOf(' OPiOS/') > -1 );

alterebro

GitHub Collaboration Workflow

Taken from : https://code.tutsplus.com/tutorials/how-to-collaborate-on-github--net-34267

1. Forking Fork the repo on GitHub.com

2. Cloning Clone the repo using the URL in the right sidebar:

git clone git@github.com:jcutrell/jquery.git

alterebro

SVG Tools

• SVG Editor. Editor and Optimiser
• SVG-edit. browser SVG drawing editor. ( GitHub Project : https://github.com/SVG-Edit/svgedit )
• SVGOMG. Online Graphical User interface for SVGO. ( GitHub Repo : https://github.com/jakearchibald/svgomg/ )
• SVGO. Command line tool to optimize SVG vector graphics files built with NodeJS.
• › SVG-encoder. Encode SVG in data URI to make it work in all modern browsers.
• › URL-encoder for SVG Same as above

---