demos/ThreaditJS/app.js
function CommentReplyView(vm, comment) {
	var redraw = vm.redraw.bind(vm);
	var status = prop(LOADED, redraw);
	var error;

	var tmpComment = prop("", redraw);

	function toggleReplyMode(e) {
		status(INTERACTING);
		return false;
	}

	function postComment(e) {
		status(SUBMITTING);

		// TODO: flatten? dry?
		endPoints.postComment(tmpComment(), comment.id)
			.then(comment2 => {
				tmpComment("", false);
				status(RELOADING);
				return endPoints.getComments(comment.id);
			})
			.then(c => {
				comment.children = Object.values(c.lookup).slice(1);	// have to slice off self
				status(LOADED, false);
				vm.parent().redraw();
			})
			.catch(e => {
				error = e;
				status(ERROR);
			});

		return false;
	}

	function previewReply(e, node) {
		tmpComment(node.el.value);
	}

	return function() {
		return (
		  status() == ERROR			? errorTpl(error)
		: status() == SUBMITTING	? statusTpl("Submitting comment...")
		: status() == RELOADING		? statusTpl("Submitted! Reloading comments...")
		: el(".reply", [
			status() == INTERACTING ?
			el("form", {onsubmit: postComment}, [
				el("textarea", {
					value: tmpComment(),
					onkeyup: [previewReply],
				}),
				el("input", {type: "submit", value: "Reply!"}),
				el(".preview", {".innerHTML": T.previewComment(tmpComment())}),
			])
			: el("a", {href: "#", onclick: toggleReplyMode}, "Reply!")
			])
		);
	}
}
function CommentReplyView(vm, comment) {
	var redraw = vm.redraw.bind(vm);
	var status = prop(LOADED, redraw);
	var error;

	var tmpComment = prop("", redraw);

	function toggleReplyMode(e) {
		status(INTERACTING);
		return false;
	}

	function postComment(e) {
		status(SUBMITTING);

		// TODO: flatten? dry?
		endPoints.postComment(tmpComment(), comment.id)
			.then(comment2 => {
				tmpComment("", false);
				status(RELOADING);
				return endPoints.getComments(comment.id);
			})
			.then(c => {
				comment.children = Object.values(c.lookup).slice(1);	// have to slice off self
				status(LOADED, false);
				vm.parent().redraw();
			})
			.catch(e => {
				error = e;
				status(ERROR);
			});

		return false;
	}

	function previewReply(e, node) {
		tmpComment(node.el.value);
	}

	return function() {
		return (
		  status() == ERROR			? errorTpl(error)
		: status() == SUBMITTING	? statusTpl("Submitting comment...")
		: status() == RELOADING		? statusTpl("Submitted! Reloading comments...")
		: el(".reply", [
			status() == INTERACTING ?
			el("form", {onsubmit: postComment}, [
				el("textarea", {
					value: tmpComment(),
					onkeyup: [previewReply],
				}),
				el("input", {type: "submit", value: "Reply!"}),
				el(".preview", {".innerHTML": T.previewComment(tmpComment())}),
			])
			: el("a", {href: "#", onclick: toggleReplyMode}, "Reply!")
			])
		);
	}
}
function CommentReplyView ( vm , comment ) { var redraw = vm . redraw . bind ( vm ) ; var status = prop ( LOADED , redraw ) ; var error ; var tmpComment = prop ( "" , redraw ) ; function toggleReplyMode ( e ) { status ( INTERACTING ) ; return false ; } function postComment ( e ) { status ( SUBMITTING ) ; // TODO: flatten? dry? endPoints . postComment ( tmpComment ( ) , comment . id ) . then ( comment2 => { tmpComment ( "" , false ) ; status ( RELOADING ) ; return endPoints . getComments ( comment . id ) ; } ) . then ( c => { comment . children = Object . values ( c . lookup ) . slice ( 1 ) ; // have to slice off self status ( LOADED , false ) ; vm . parent ( ) . redraw ( ) ; } ) . catch ( e => { error = e ; status ( ERROR ) ; } ) ; return false ; } function previewReply ( e , node ) { tmpComment ( node . el . value ) ; } return function ( ) { return ( status ( ) == ERROR ? errorTpl ( error ) : status ( ) == SUBMITTING ? statusTpl ( "Submitting comment..." ) : status ( ) == RELOADING ? statusTpl ( "Submitted! Reloading comments..." ) : el ( ".reply" , [ status ( ) == INTERACTING ? el ( "form" , { onsubmit : postComment } , [ el ( "textarea" , { value : tmpComment ( ) , onkeyup : [ previewReply ] , } ) , el ( "input" , { type : "submit" , value : "Reply!" } ) , el ( ".preview" , { ".innerHTML" : T . previewComment ( tmpComment ( ) ) } ) , ] ) : el ( "a" , { href : "#" , onclick : toggleReplyMode } , "Reply!" ) ] ) ) ; } }
sub-sub view
sub - sub view