jazlalli’s gists

jazlalli / index.html

Last active June 5, 2020 18:04

JS Bin - Responsive Layout (https://jsbin.com/kaxonig)

	<!DOCTYPE html>
	<html>
	<head>
	<meta name="description" content="Responsive Layout">
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>Responsive Layout (3-col -> mobile)</title>
	</head>
	<body>
	<div class="wrapper">

jazlalli / modalify.js

Last active November 24, 2016 16:19

A higher-order React component for wrapping things in a Modal

	import React, { Component, PropTypes } from 'react';
	import Modal from 'react-modal';

	/*
	@desc: wraps any component provided in a react-modal
	@param: ModalContent - any React component that you want as a modal
	@param: Trigger (optional) - a clickable component that will trigger the modal to open
	@param: triggerProps (optional) - some data to provide to the trigger component

	@usage:

jazlalli / React-callback-example.jsx

Last active December 22, 2016 10:44

What is the "ideal" way to pass data to a callback prop? An inline function callback which invokes the prop? Or use prop as is and attach data to the event object?

	// inline event handler which invokes callback prop
	const UsingAnInlineFunction = ({
	itemId,
	itemName,
	itemCount,
	onClick
	}) => (
	<div onClick={() => onClick(itemId)}>
	<span>{`${itemCount}x ${itemName}`}</span>
	</div>

jazlalli / listWithModal.js

Last active August 29, 2015 14:26

Pseudo-code example of single Modal, which is triggered by items in a list that also pass in their data. After editing that data, how can I ensure that the right list item gets it's value back?

	var Modal = React.createClass({
	getInitialState() {
	return {
	text: this.props.text
	};
	},
	onChange(e) {
	this.setState({text: e.target.value});
	},
	closeModal() {

jazlalli / desktop.css

Created February 27, 2015 10:28

Disable all pointer events when you're scrolling the window

	.disable-hover,
	.disable-hover * {
	pointer-events: none !important;
	}

jazlalli / scrollToX.js

Created January 23, 2015 11:23

Function to scroll to specified X coord with a map of easing functions to choose from.

	function scrollTo(X, duration, easingFunction, callback) {
	callback = callback \|\| function () {};

	var start = Date.now(),
	elem = document.scrollLeft ? document : document.body,
	from = elem.scrollLeft;

	if (from === X) {
	callback();
	return; /* Prevent scrolling to the X point if already there */

jazlalli / gist:6510962

Created September 10, 2013 15:19

Example of a node-amqp subscriber with dead lettering

	var amqpconnection = amqp.createConnection({url: config.CLOUD_AMQP}, connOptions);

	amqpconnection.on('ready', function() {

	// dead letter exchange for rejected messages
	amqpconnection.exchange(
	deadLetterExchange,
	options = {durable: true, autoDelete: false, type: 'topic'},
	function (ex) {

jazlalli / gist:4757988

Created February 11, 2013 21:59

server.js - connects to amqp and registers router.route as the subscriber

	var environment = process.env.NODE_ENV \|\| '';

	var amqp = require('amqp'),
	router = require('./routing/messagerouter'),
	routes = require('./routing/routes'),
	config = require('./config_' + environment);

	var amqpconnection = amqp.createConnection({
	url: config.CLOUD_AMQP
	});

jazlalli / gist:4757900

Created February 11, 2013 21:47

message router - binds event handlers and emits event on message

	var environment = process.env.NODE_ENV \|\| '';

	var config = require('../config_' + environment),
	routes = require('./routes'),
	EventEmitter = require('events').EventEmitter,
	messagerouter = {},
	topic;

	var emitter = new EventEmitter();

jazlalli / gist:4757774

Last active December 12, 2015 10:18

simple object for routing messages by topic

	var visit = require('../eventhandlers/visithandler'),
	click = require('../eventhandlers/clickhandler');

	var routes = {
	'Visit': visit.log,
	'Click': click.log
	};

	module.exports = routes;

Jaz jazlalli