Skip to content

Instantly share code, notes, and snippets.

View FremyCompany's full-sized avatar

François REMY FremyCompany

75 followers · 1 following
View GitHub Profile
@FremyCompany
FremyCompany / index.html
Created February 23, 2015 23:15
Proof position:relative is necessary to create layout islands
<main>
some main content here
<section style="position: not-relative; width: 100px; height: 100px; background: blue; color: white; overflow: hidden;">
some section content here
<aside style="position: absolute; top: 5px; left: 50px; background: red; -ms-wrap-flow: both">
some aside content here
</aside>
</section>
</main>
@FremyCompany
FremyCompany / AA5-INTRO.MD
Last active August 29, 2015 14:17
"Hooking into InputDevice's Raw Input" (proposal)

At the time of writing, the input devices landscape is fragmented, very fragmented. Beside a few common concepts inherited from the very first input devices (mouses and keyboards), it's impossible to get out of input devices the raw input they collect and make something useful out of it.

Inspirations

The aim of this proposal is to philosophically draw from the Pointer Events specification and unify a large range of input devices by providing a new set of fundamental concepts

@FremyCompany
FremyCompany / gist:55f5f6fc44f8e62afa2a
Created June 10, 2015 19:28
//
// HELPER
//
var MetadataHolder = function() {
var map = new WeakMap();
var get = function(obj) {
return map.get(obj)
}
get.init = function(obj, val) {
map.set(obj, val);
@FremyCompany
FremyCompany / 1-readme.md
Last active August 29, 2015 14:23
onecharaway-tree.js

This algorithm collects the words of a dictionary identical to a given words, one letter excepted.

To achieve a faster speed, the dictionnary is transformed into a tree of nodes containing the words letter by letter, as such:

{
  "a": {
    "b": {
      "c": {
 "d": {
@FremyCompany
FremyCompany / proxy-dom.js
Created February 5, 2016 07:02
An extended version of https://jsbin.com/tebevak/edit?js,output
const element = dom.div.id("main-content").role("main")`
Hello, my name is ${html.a.href('//jakearchibald.com')`Jake Archibald`}.
I like:
${dom.ul`
${dom.li`The web`}
${dom.li`Food`}
${dom.li`…actually that's it`}
`}
`;
@FremyCompany
FremyCompany / Chakra-ToCaseCore-Test.js
Created March 14, 2016 08:24
This file has been truncated, but you can view the full file.
//
// TEST EVERY TWO-CHAR TO-LOWER/TO-UPPER COMBINATION
//
var arr = []; for(var i = 0; i<=256; i++) { for(var j = 0; j<=256; j++) { var str = String.fromCharCode(i)+String.fromCharCode(j); arr.push(str+str.toLowerCase()+str.toUpperCase()) } };
var resultArr = [ "\u0000\u0000\u0000\u0000\u0000\u0000", "\u0000\u0001\u0000\u0001\u0000\u0001", "\u0000\u0002\u0000\u0002\u0000\u0002", "\u0000\u0003\u0000\u0003\u0000\u0003", "\u0000\u0004\u0000\u0004\u0000\u0004", "\u0000\u0005\u0000\u0005\u0000\u0005", "\u0000\u0006\u0000\u0006\u0000\u0006", "\u0000\u0007\u0000\u0007\u0000\u0007", "\u0000\b\u0000\b\u0000\b", "\u0000\t\u0000\t\u0000\t", "\u0000\n\u0000\n\u0000\n", "\u0000\u000b\u0000\u000b\u0000\u000b", "\u0000\f\u0000\f\u0000\f", "\u0000\r\u0000\r\u0000\r", "\u0000\u000e\u0000\u000e\u0000\u000e", "\u0000\u000f\u0000\u000f\u0000\u000f", "\u0000\u0010\u0000\u0010\u0000\u0010", "\u0000\u0011\u0000\u0011\u0000\u0011", "\u0000\u0012\u0000\u0012\u0000\u0012", "\u0000\u0013\u0000\u0013\u0000\u0013", "\u0000\u0014\u0000\
@FremyCompany
FremyCompany / height-distribution-ideas.md
Last active April 23, 2016 06:42
Table height distribution -- ideas

Computing the table height

The height of a table is the largest of:

  • The specified height of the table (percentages are resolved against ancestors as usual)
  • The height required for the rows and the vertical border-spacings. For each row, the largest of:
  • The row’s specified height if it is defined in non-percentages units (0 otherwise)
    • Also the eventual rowgroup specified size, using the usual splitting among tracks
  • The height deemed necessary to render all its cells when running the same algorithm that is being used to compute a column min-width, where the min-height of a cell is the largest of:
    • The cell’s specified height if it is defined in non-percentages units (0 otherwise)
    • The height of the cell border and padding plus the scrollHeight of its content layouted as if:
  • the cell height was set to 0px and overflow was set to hidden,
@FremyCompany
FremyCompany / mapping-system.d.ts
Created June 8, 2016 22:51
Node Mapping System
declare var Map: { new(): Map<any,any> };
interface Map<IndexType, ValueType> {
get(index:IndexType): ValueType,
set(index:IndexType, value:ValueType)
}
declare var MappingSystem: MappingSystemConstructor;
interface MappingSystemConstructor {
new(): MappingSystem<any,any,any,any>
NodeMappingSystem: NodeMappingSystemConstructor
@FremyCompany
FremyCompany / index.html
Last active January 27, 2017 04:20
Get the line of source code that generated an element for jsfiddle/etc purposes
<!doctype html><script onload="document.scripts[0].remove()">
var html =
`<html>
<head>
<title>Test page</title>
<style>
input:hover {
outline: 3px solid red;
}
</style>
@FremyCompany
FremyCompany / typescript-jsx-mithril.tsx
Created February 22, 2017 23:45
Small helper to get autocompletion when authoring Mitrhil components in Typescript
function Component<T>(view: (attributes: T, children: Array<any>) => Mithril.VirtualElement): () => Mithril.Component<Mithril.ControllerWithAttributes<T>> & { attributes?: T} {
return () => ({ view(n) { return view(n.attributes, n.children); } } as any);
}
var Abc = Component<{ input:string, value:string }>(a =>
<div>{a.input}</div>
);
var t = <Abc input="true" value="true" />