Skip to content

Instantly share code, notes, and snippets.

View snewcomer's full-sized avatar

Scott Newcomer snewcomer

View GitHub Profile
@snewcomer
snewcomer / live_view_dom_event_thoughts.md
Last active October 21, 2019 00:15
Phoenix Live View DOM Events thoughts

DOM Event Order

  • Events execution order is not guaranteed based on the heirarchy of the DOM when using window.addEventListener. Instead window.addEventListener will run listeners in the order they are registered.
  • DOM3 specifies events flow down the DOM tree and then back up. addEventListener's are called on the way back up, but can be called as evt propogates down the tree with true for the useCapture argument.

Ideas

Taking control of event listeners for the user limits a lot of the flexibility the DOM + JS provides. See this issue for an example.

Basically, we have not covered bubbling and cancellation DOM Events with LiveView.

@snewcomer
snewcomer / when-to-use-microtask-queue.md
Last active September 29, 2019 22:20
queueMicroTask

The microtask queue is useful for allowing the current browser task to finish while pushing some logic to happen immediately after that task (or next task).

  • "click" event with non trivial, expensive logic. To allow the browser to finish that event, return sync control to that task while throwing the resulting logic in a queueMicrotask callback.
  • async rendering
@snewcomer
snewcomer / flatten.exs
Created September 15, 2019 01:15 — forked from veelenga/flatten.exs
Flattening array in elixir
def flatten(list), do: flatten(list, []) |> Enum.reverse
def flatten([h | t], acc) when h == [], do: flatten(t, acc)
def flatten([h | t], acc) when is_list(h), do: flatten(t, flatten(h, acc))
def flatten([h | t], acc), do: flatten(t, [h | acc])
def flatten([], acc), do: acc
@snewcomer
snewcomer / components.my-component-nested.js
Last active May 22, 2019 14:55
update-class-names-timer
import Ember from 'ember';
export default Ember.Component.extend({
classNames: ['red']
});
@snewcomer
snewcomer / project-user-m2m.ex
Created April 30, 2019 04:48
project-user-m2m
def join_project(%Project{} = project, %User{} = me) do
project = Repo.preload(project, :users)
users =
project.users ++ [me]
|> Enum.map(&Ecto.Changeset.change/1)
event
|> change_project()
|> put_assoc(:users, users)
|> Repo.update()
@snewcomer
snewcomer / tree-walker.js
Created April 2, 2019 01:49
Tree Walker
function indexTree(root) {
var treeWalker = document.createTreeWalker(
root,
NodeFilter.SHOW_ELEMENT);
var el;
while((el = treeWalker.nextNode())) {
var key = getNodeKey(el);
if (key) {
fromNodesLookup[key] = el;
@snewcomer
snewcomer / matching-line.js
Created March 22, 2019 19:20
matching line
const removeMatchingLine = (str, match) => {
let index = str.indexOf(match);
// If it is not found, return str
if (index === -1) {
return str;
}
// Look for the previous line feed
let start = index;
while(str.charAt(start) !== "\n") {
@snewcomer
snewcomer / functional-store.js
Last active March 2, 2019 19:48
Functional Store
import Ember from 'ember';
/**
* example data structure
*
* persistentContainer: {
* tickets: Map.{
* id: Obj,
* id: Obj
* },
@snewcomer
snewcomer / pascal-triangle.ex
Last active February 23, 2019 07:00
Calculate binomial coefficient of one diagonal of pascal's triangle
defmodule Easydiagonal do
def diagonal(n, p) do
{sum, _acc} = build_triangle(n, p)
sum
end
defp build_triangle(n, p) do
# [[1], [1, 1], [1, 2, 1], [1, 3, 3, 1], [1, 4, 6, 4, 1], ...]
Stream.iterate({0, [1]}, fn {sum, last} ->
@snewcomer
snewcomer / spiral.js
Created February 7, 2019 17:26
spiral-algorithm
let arrayOfApps = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24];
const N = [0, -1];
const E = [1, 0];
const S = [0, 1];
const W = [-1, 0];
const EMPTY = `~EMPTY_SIGIL~`
let directions = { N, E, S, W };
let r_directions = { 'N': 'E', 'E': 'S', 'S': 'W', 'W': 'N' };