Skip to content

Instantly share code, notes, and snippets.

Avatar

Jim Cummins jimthedev

View GitHub Profile
View gist:eac58936619798f29f6c78fb2238132f
searchNow = (term) => {
if (!window.divs) {
window.divs = [...$$('.grid > div')];
}
window.divs.forEach(div => div.style.display= "block");
window.divs.forEach(function(div) {
if(div.innerText.startsWith(term)) {
//console.log('found!', div);
div.style.display = "block"
} else {
@jimthedev
jimthedev / gist:70ff81a2d3ab1e74b953ea7b83b747d9
Created Apr 13, 2020
onKeyCombo directive angular.js angular1
View gist:70ff81a2d3ab1e74b953ea7b83b747d9
const angular = require('angular');
function OnKeyComboDirective () {
return function (scope, element, attributes) {
// We're using a custom event listener on keyup
const comboListener = e => {
if ((e.ctrlKey || e.metaKey) && e.shiftKey && e.which == 65) {
setTimeout(function () {
scope.$eval(attributes.onKeycombo);
View load-latest-react.js
// Make sure you have an html element with an id of root and thewn you can run this. r is react, d is react-dom
Promise.all([
import(
"https://cdn.jsdelivr.net/npm/@esm-bundle/react-dom/esm/react-dom.resolved.production.min.js"
),
import(
"https://cdn.jsdelivr.net/npm/@esm-bundle/react/esm/react.production.min.js"
)
]).then(([{ default: d }, { default: r }]) =>
@jimthedev
jimthedev / index.android.js
Created Feb 6, 2020
iowa caucus app bundle. have fun.
View index.android.js
This file has been truncated, but you can view the full file.
var __BUNDLE_START_TIME__=this.nativePerformanceNow?nativePerformanceNow():Date.now(),__DEV__=false,process=this.process||{};process.env=process.env||{};process.env.NODE_ENV=process.env.NODE_ENV||"production";
@jimthedev
jimthedev / gist:74d451f71975b504f0a223850481c9c2
Last active Jan 21, 2020
React StoreProvider, useStore hook
View gist:74d451f71975b504f0a223850481c9c2
const context = React.createContext()
export const StoreProvider = ({ children, initialState = {} }) => {
const [store, setStore] = React.useState(() => initialState)
const contextValue = React.useMemo(() => [store, setStore], [store])
return (
<context.Provider value={contextValue}>
{children}
@jimthedev
jimthedev / React-Table-Plugin-Rules.md
Created Jan 21, 2020
the rules of react table's plugin system
View React-Table-Plugin-Rules.md

They are reducers. Unlike other places, don't return existing state. Return undefined, unless something actually changed. Any action can be handled by all other plugins. No way for one plugin to block another.

@jimthedev
jimthedev / statemachine.js
Created Jan 21, 2020
state machine using reducer
View statemachine.js
const reducer = (state, action) => {
if (state.status === 'idle') {
if (action.type === 'fetch') {
return {
status: 'fetching'
}
}
}
if (state.status === 'fetching') {
if (action.type === 'resolve') {
@jimthedev
jimthedev / call.js
Last active Jan 11, 2020
faunadb incrementbyid function
View call.js
Call(Function("increment"), "topics", "254119747652682260", [
"data",
"clickCount"
]);
/*
each document in the topics collection looks like this:
@jimthedev
jimthedev / Component.js
Last active Jul 23, 2020
use web component hook for react
View Component.js
import { useCustomElement } from "./useCustomElement";
// My regular react app that is using a web component /
// custom element inside it.
// Notice that we have some handlers, some state, etc.
function Component() {
const [txt, setTxt] = React.useState("init")
function handleClick() {
setTxt("clicked")
}