A Mithril popup pattern

popup.css

.canvas {
	height   : 100%;
	left     : 0;
	position : fixed;
	top      : 0;
	width    : 100%;
}

.popup {
	position: fixed;

	-webkit-transform : translate3d( -50%, -100%, 0 );
	   -moz-transform : translate3d( -50%, -100%, 0 );
	    -ms-transform : translate3d( -50%, -100%, 0 );
	     -o-transform : translate3d( -50%, -100%, 0 );
	        transform : translate3d( -50%, -100%, 0 );
}

popup.js

function popup( contents, x, y ){
	function view(){
		return contents ? m( '.canvas', {
			onclick   : getterSetter( false ),
		}, m( '.popup', {
			style : {
				left : x + 'px',
				top  : y + 'px'
			}
		}, m( '.content', contents ) ) ) : '';
	}

	function getterSetter( input ){
		if( arguments.length ) {
			return function trigger( event ){
				contents = input;

				if( event ){
					x = event.x || x;
					y = event.y || y;
				}
			};
		}
		else {
			return view();
		}
	}
	
	return getterSetter;
};