idmontie

class Tween extends Component {
	static defaultProps = {
		duration: 1000,
	}

	constructor(props) {
		super(props);

		this.state = {
			timeStart: +new Date(),

idmontie

class MousePosition extends Component {
	constructor(props) {
		super(props);

		this.onMouseMove = this._onMouseMove.bind(this);
		this.state = { x: 0, y: 0 };
	}

	componentDidMount() {
		document.addEventListener('mousemove', this.onMouseMove);

idmontie

class App extends Component {
	render() {
		return (
			<MousePosition>
				{({ x, y }) => (
					<Tween func={linear} defaultStart={centerX} end={x}>
						{({ current: cx }) => (
							<Tween func={linear} defaultStart={centerY} end={y}>
							{({ current: cy }) => (
								<Rectangle x={cx} y={cy} />

idmontie

const Rectangle = ({ x, y }) => (
	<div style={{ position: 'fixed', top: `${y}px`, left: `${x}px`, height: '10px', width: '10px', backgroundColor: 'black' }} />
);

idmontie

class App extends Component {
	render() {
		return (
			<SimpleTween start={0} end={600}>
				{({ current }) => (
					<Rectangle x={current} y={600} />
				)}
			</SimpleTween>
		);
	}

idmontie

class SimpleTween extends Component {
	static defaultProps = { duration: 1000 }

	constructor(props) {
		super(props);

		this.state = {
			timeStart: +new Date(),
			current: props.start,
		};

idmontie

function linear(diff, start, change, duration) {
	return change * (diff /= duration) + start;
}

idmontie

const centerX = Math.floor(window.innerWidth / 2);
const centerY = Math.floor(window.innerHeight / 2);

class App extends Component {
	render() {
		return (
			<MousePosition>
				{({ x, y }) => (
					<Tween func={easeOutQuad} defaultStart={centerX} end={x}>
					{({ current: cx }) => (

idmontie

#!/bin/bash

# Add this file to your bash path
# Make sure to chmod 755 it

# Example useage:
# MY_COMMAND; beep
if [ "$?" = "0" ]; then
  afplay /System/Library/Sounds/Submarine.aiff -v 8
else

idmontie

<!-- Crazy, but consistent method: -->
<style>
    body { display: none; }
</style>

<script>
if (self === top) {
   documents.getElementsByTagName("body")[0].style.display = 'block';
} else {
    top.location = self.location;