Feature: add CF plugin + Fix: remove static resources from .gitignore

.gitignore

@@ -1,8 +1,7 @@
 .classpath
 .project
 .settings
-src/main/resources/static
+src/main/resources/static/js/.module-cache
-src/main/webapp/js/.module-cache
 src/test/resources/static/js/compiled
 src/test/resources/static/js/.module-cache
 target

pom.xml

@@ -311,6 +311,24 @@
 					<customRunnerTemplate>${project.basedir}/src/test/resources/jasmine/ReactJsSpecRunner.htmltemplate</customRunnerTemplate>
 				</configuration>
 			</plugin>
+			<!-- Deployment -->
+			<plugin>
+				<groupId>org.cloudfoundry</groupId>
+				<artifactId>cf-maven-plugin</artifactId>
+				<version>1.1.3</version>
+				<!-- <configuration>
+					<server>bluemix</server>
+					<target>https://api.eu-gb.bluemix.net </target>
+					<org>open-groupe.com</org>
+					<space>dev</space>
+					<appname>TOFILL</appname>
+					<url>TOFILL</url>
+					<buildpack>https://github.com/cloudfoundry/java-buildpack.git</buildpack>
+					<memory>512</memory>
+					<diskQuota>1024</diskQuota>
+					<instances>1</instances>
+				</configuration> -->
+			</plugin>
 		</plugins>
 
 		<pluginManagement>

src/main/resources/static/css/comments.css

@@ -0,0 +1,12 @@
+#content {
+	margin-top: 60px;
+}
+
+.footer {
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    height: 60px;
+    background-color: #101010;
+    color: #9d9d9d;
+}

src/main/resources/static/js/app.jsx

@@ -0,0 +1,123 @@
+'use strict';
+
+var Comment = React.createClass({
+	rawMarkup: function() {
+		var rawMarkup = marked(this.props.children.toString(), {sanitize: true});
+		return { __html: rawMarkup };
+	},
+	render: function() {
+		return (
+			<div className="comment">
+				<h2 className="commentAuthor">
+					{this.props.author}
+				</h2>
+				<span dangerouslySetInnerHTML={this.rawMarkup()} />
+			</div>
+		);
+	}
+});
+
+var CommentForm = React.createClass({
+	getInitialState: function() {
+		return {author: '', text: ''};
+	},
+	handleAuthorChange: function(e) {
+		this.setState({author: e.target.value});
+	},
+	handleTextChange: function(e) {
+		this.setState({text: e.target.value});
+	},
+	handleSubmit: function(e) {
+		e.preventDefault();
+		var author = this.state.author.trim();
+		var text = this.state.text.trim();
+		if( !text || !author ) {
+			return;
+		}
+		this.props.onCommentSubmit({author: author, text: text})
+		this.setState({author: '', text: ''});
+	},
+	render: function() {
+		return (
+			<form className="commentForm" onSubmit={this.handleSubmit}>
+				<input
+					type="text"
+					placeholder="Your name"
+					value={this.state.author}
+					onChange={this.handleAuthorChange}
+				/>
+				<input
+					type="text"
+					placeholder="Say something..."
+					value={this.state.text}
+					onChange={this.handleTextChange}
+				/>
+				<input type="submit" value="Post" />
+			</form>
+		);
+	}
+});
+var CommentBox = React.createClass({
+	getInitialState: function() {
+		return {data: []};
+	},
+	loadCommentsFromServer: function() {
+		$.ajax({
+			url: this.props.url,
+			dataType: 'json',
+			cache: false,
+			success: function(data) {
+				this.setState({data: data});
+			}.bind(this),
+			error: function(xhr, status, err) {
+				console.error(this.props.url, status, err.toString());
+			}.bind(this)
+		});
+	},
+	handleCommentSubmit: function(comment) {
+		var comments = this.state.data;
+		comment.id = Date.now();
+		var newComments = comments.concat([comment]);
+		this.setState({data: newComments});
+		$.ajax({
+			url: this.props.url,
+			method: 'POST',
+			dataType: 'json',
+			data: comment,
+			success: function(data) {
+				this.setState({data: data});
+			}.bind(this),
+			error: function(xhr, status, err) {
+				this.setState({data: comments});
+				console.error(this.props.url, status, err.toString());
+			}.bind(this)
+		});
+	},
+	componentDidMount: function() {
+		this.loadCommentsFromServer();
+		setInterval(this.loadCommentsFromServer, this.props.pollInterval);
+	},
+	render: function() {
+		return (
+			<div className="commentBox">
+				<h1>Comments</h1>
+				<CommentList data={this.state.data}/>
+				<CommentForm onCommentSubmit={this.handleCommentSubmit}/>
+			</div>
+		);
+	}
+});
+var CommentList = React.createClass({
+	render: function() {
+		var commentNodes = this.props.data.map( function(comment) {
+			return (
+				<Comment author={comment.author} key={comment.id}>{comment.text}</Comment>
+			);
+		});
+		return (
+			<div className="commentList">
+				{commentNodes}
+			</div>
+		)
+	}
+});

src/main/resources/static/js/app.render.jsx

@@ -0,0 +1,4 @@
+ReactDOM.render(
+	<CommentBox url="/api/comments" pollInterval={2000}/>,
+	document.getElementById('content')
+);