echo "Enter m3u8 link:";read link;echo "Enter output filename:";read filename;ffmpeg -i "$link" -bsf:a aac_adtstoasc -vcodec copy -c copy -crf 50 $filename.mp4
| function traverse(obj,func, parent) { | |
| for (i in obj){ | |
| func.apply(this,[i,obj[i],parent]); | |
| if (obj[i] instanceof Object && !(obj[i] instanceof Array)) { | |
| traverse(obj[i],func, i); | |
| } | |
| } | |
| } | |
| function getPropertyRecursive(obj, property){ |
| #!/bin/bash | |
| # store the current dir | |
| CUR_DIR=$(pwd) | |
| # Let the person running the script know what's going on. | |
| echo "\n\033[1mPulling in latest changes for all repositories...\033[0m\n" | |
| # Find all git repositories and update it to the master latest revision | |
| for i in $(find . -name ".git" | cut -c 3-); do |
| /* Polyfill indexOf. */ | |
| var indexOf; | |
| if (typeof Array.prototype.indexOf === 'function') { | |
| indexOf = function (haystack, needle) { | |
| return haystack.indexOf(needle); | |
| }; | |
| } else { | |
| indexOf = function (haystack, needle) { | |
| var i = 0, length = haystack.length, idx = -1, found = false; |
| #!/bin/bash | |
| curl -X POST -d @- $1 --header "Content-Type:application/json" |
| // Part of https://github.com/chris-rock/node-crypto-examples | |
| // Nodejs encryption of buffers | |
| var crypto = require('crypto'), | |
| algorithm = 'aes-256-ctr', | |
| password = 'd6F3Efeq'; | |
| var fs = require('fs'); | |
| var zlib = require('zlib'); |
| import * as http from 'http' | |
| import * as _ from 'lodash' | |
| //! In the standard implementation of http server, calling close is not guaranteed to close the | |
| //! server. Any idle connections being kept alive by clients will stay open until their timeout | |
| //! is reached. This is problematic for gracefully shutting down a process with an http server. | |
| //! This function will create an http server that tracks the open connections. On close, idle | |
| //! connections are closed and any newly idled connection is immediately closed as well. When there | |
| //! are no more connections on the server, the 'empty' event is raised. |
| // deep copy: | |
| // String, Number, undefined, null, Set, Map, typed Array, Object, Boolean, RegExp, Date, ArrayBuffer, Node | |
| // Functions, Properties of types: (Primitive, Symbol) | |
| // shallow copy (by reference): | |
| // WeakMap, WeakSet, Symbol | |
| // increased compatibility: IE, Node | |
| var $jscomp = $jscomp || {}; | |
| $jscomp.scope = {}; | |
| $jscomp.ASSUME_ES5 = !1; | |
| $jscomp.defineProperty = $jscomp.ASSUME_ES5 || "function" == typeof Object.defineProperties ? Object.defineProperty : function(a, b, c) { |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>unpkg.com dynamic import module test</title> | |
| </head> | |
| <body> | |
| <script type="module"> | |
| window.module = { | |
| set exports(module) { | |
| window.module.modules.push(module); |
As the number of different possible states and transitions between states in a user interface grows, managing styles and animations can quickly become complicated. Even a simple login form has many different "user flows":
https://codepen.io/davidkpiano/pen/WKvPBP
State machines are an excellent pattern for managing state transitions in user interfaces in an intuitive, declarative way. We've been using them a lot on the Keyframers as a way to simplify otherwise complex animations and user flows, like the one above.
So, what is a state machine? Sounds technical, right? It’s actually more simple and intuitive than you might think. (Don’t look at Wikipedia just yet… trust me.)
Let’s approach this from an animation perspective. Suppose you’re creating a loading animation, which can be in only one of four states at any given time:
