Skip to content

Instantly share code, notes, and snippets.

// Never forget a stray console.log()
// ----------------------------------
//
// This one is for you printf debuggers
//
// This spies on console.*() calls and reports the call sites
// ordered by file name then by position, all at once at the
// end of the report (while making the suite fail, this counts
// as a failed assertion).
// USAGE
// -----
//
// TODO("Finish this")
// Add this anywhere in your project or test suite,
// it will cause your tests to fail with the message.
//
// This is not meant to ever be commited, but you're sure
// to never lose track of a TODO before pushing your
// changes
<!doctype html>
<title>ChargingGate </title>
<input type=checkbox id="hasGetBattery"><input type=checkbox id="batteryStatus">
<div id=ua></div>
<hr>
<h1>
#ChargingGate?
</h1>
<p>
Another day, another dystopian browser API...

Keybase proof

I hereby claim:

  • I am pygy on github.
  • I am pygy (https://keybase.io/pygy) on keybase.
  • I have a public key ASAuqI8Te5JdZeup5yQBEEPyoy-24Wl6UwYGMBg8PQ9WvAo

To claim this, I am signing this object:

[vella][1]

Hopefully quick and light view library (benchmarks TBD :-).

S.js tutorial

vella is currently built on top of S.js by Adam Haile. It is more or less Surplus, but with Hyperscript (and composability cranked to eleven). We may end up forking or replacing S, but the core idea will probably persist. Understanding S is required to get what comes next.

Lexicon: in the S docs, streams are called "signals", and dependent streams are called "computations". I'll use the same terminology for now here to make it easier for you if you're also scouring the S docs. They are mostly push streams AFAIU, but the author descrbes them as hybrid push/pull somewhere in the issues, not sure what he meant.

@pygy
pygy / force-layout.js
Created April 7, 2018 21:58
For those times you want to add entrance animations in Mithril, and the adding a class/animation in `oncreate` doesn't cut it.
fuction forceLayout(dom) {
dom.getBoundingClientRect().height
}
let prm
let nodes = []
function debouncedLayout(dom) {
if (nodes.length === 0) {
prm = Promise.resolve(null).then(() => {
nodes.forEach(forceLayout)
@pygy
pygy / combinators.js
Created February 20, 2018 12:18 — forked from Avaq/combinators.js
Common combinators in JavaScript
const I = x => x;
const K = x => y => x;
const A = f => x => f(x);
const T = x => f => f(x);
const W = f => x => f(x)(x);
const C = f => y => x => f(x)(y);
const B = f => g => x => f(g(x));
const S = f => g => x => f(x)(g(x));
const P = f => g => x => y => f(g(x))(g(y));
const Y = f => (g => g(g))(g => f(x => g(g)(x)));
@pygy
pygy / mithril-hyperscript.md
Created July 27, 2017 14:22 — forked from CarlMungazi/mithril-hyperscript.md
Understanding mithril's hyperscript function

Earlier this year at work we re-wrote an internal framework we used to create SPA e-learning courses. After briefly trying out React, Angular 2, Ember and Vue, we settled on mithril (https://mithril.js.org). If I were to compare it to the frameworks we tried out, I would say it's more like React but with a simpler, smaller codebase. By the way, if you like geeking out on code articles, the articles from mithril's old site have some real nuggets of gold (http://lhorie.github.io/mithril-blog/).

A few months after the re-write was done, I dug into mithril's codebase to gain a deeper understanding and this is what I found...

The main entry point into mithril's source code is the m() function, which is a hyperscript function that, according to the docs (https://mithril.js.org/hyperscript.html), represents an element in a mithril view. It's demonstrated below as:

m("div", {id: "box"}, "hello")
// equivalent HTML:
// <div id="box">hello</div>