Skip to content

Instantly share code, notes, and snippets.

Matthew Conlen mathisonian

Block or report user

Report or block mathisonian

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@mathisonian
mathisonian / nav.js
Last active Jul 11, 2019
Nav Component
View nav.js
const React = require('react');
class CustomComponent extends React.Component {
render() {
const { hasError, idyll, updateProps, ...props } = this.props;
return (
<div style={{position: 'fixed', top: 0, left: 0, right: 0, display: 'flex', padding: '1em', background: '#000', justifyContent: 'space-between'}}>
<div style={{fontWeight: 'bold', fontSize: '2em', color: '#fff'}}>MY BLOG</div>
<div style={{display: 'flex'}}>
<div style={{fontSize: '1.5em', color: '#fff', marginRight: '1em'}}>A Link</div>
@mathisonian
mathisonian / index.md
Last active May 22, 2019
requiring npm modules in the browser console
View index.md

demo gif

The final result: require() any module on npm in your browser console with browserify

This article is written to explain how the above gif works in the chrome (and other) browser consoles. A quick disclaimer: this whole thing is a huge hack, it shouldn't be used for anything seriously, and there are probably much better ways of accomplishing the same.

Update: There are much better ways of accomplishing the same, and the script has been updated to use a much simpler method pulling directly from browserify-cdn. See this thread for details: https://github.com/mathisonian/requirify/issues/5

inspiration

@mathisonian
mathisonian / index.js
Last active Feb 27, 2019
postgres full text search in sequelize.js. see this blog post for more information http://www.mathisonian.com/weblog/postgres-full-text-search-with-sequelizejs
View index.js
var Sequelize = require('sequelize');
module.exports = function(config) {
var models = {};
sequelize = new Sequelize(config.database, config.username, config.password, config.options);
// Bootstrap models
fs.readdirSync(__dirname).forEach(function (file) {
@mathisonian
mathisonian / gist:4067528
Created Nov 13, 2012
Getting the starting index of selected text
View gist:4067528
/*
* Gets the starting index of the selected text
*/
function _getSelectionHtml() {
/*
* Returns HTML String of current selection
*/
var html = "";
@mathisonian
mathisonian / youtube.js
Last active Aug 23, 2018
Idyll Youtube Component
View youtube.js
import React from 'react';
let YouTube;
class YoutubeComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
mounted: false
}
@mathisonian
mathisonian / emoji-support.js
Created Dec 10, 2013
Detect emoji support
View emoji-support.js
/**
* Determine if this browser supports emoji.
*
* Modified from https://gist.github.com/mwunsch/4710561
* and probobly originally github's javascript source
*/
function doesSupportEmoji() {
var context, smiley;
if (!document.createElement('canvas').getContext) return;
context = document.createElement('canvas').getContext('2d');
@mathisonian
mathisonian / d3-component.js
Last active Dec 4, 2017
Example stepper / play / pause
View d3-component.js
const React = require('react');
const D3Component = require('idyll-d3-component');
const d3 = require('d3');
const size = 600;
class CustomD3Component extends D3Component {
initialize(node, props) {
View filter.js
const React = require('react');
const D3Component = require('idyll-d3-component');
const d3 = require('d3');
class FilterComponent extends D3Component {
initialize(node, props) {
// instead of adding an svg, add a canvas
var canvas = d3.select(node).append("canvas")
@mathisonian
mathisonian / mycomponent.js
Created Nov 27, 2017
injecting props in Idyll component
View mycomponent.js
import React from 'react';
import ReactDOM from 'react-dom';
class MyComponent extends React.PureComponent {
unwrapChildren() {
return this.props.children.map((c) => {
if (c => c.type.name && c.type.name.toLowerCase() === 'wrapper') {
return c.props.children[0];
}
return c;
View app.js
var svg = d3.select('#example-2')
.append('svg')
.attr('width', '100%')
.attr('viewBox', '0 0 202 202');
var data = d3.range(10).map(function (d, i) {
return i;
});
You can’t perform that action at this time.