diff --git a/Dockerfile b/Dockerfile index cdb7652d5..985e55159 100644 --- a/Dockerfile +++ b/Dockerfile @@ -17,7 +17,7 @@ RUN npm install COPY . /usr/src/app # Compile static assets -# RUN npm run build +RUN npm run build # Prune development dependancies RUN npm prune --production diff --git a/client/coral-admin/index.ejs b/client/coral-admin/index.ejs index 9b5fe84bf..45c971ffe 100644 --- a/client/coral-admin/index.ejs +++ b/client/coral-admin/index.ejs @@ -17,6 +17,6 @@
- + diff --git a/client/coral-admin/public/index.html b/client/coral-admin/public/index.html index ef1adffec..e792fcd2c 100644 --- a/client/coral-admin/public/index.html +++ b/client/coral-admin/public/index.html @@ -17,6 +17,6 @@
- + diff --git a/client/coral-admin/webpack.config.js b/client/coral-admin/webpack.config.js index 1f3d81500..2c81bf4fc 100644 --- a/client/coral-admin/webpack.config.js +++ b/client/coral-admin/webpack.config.js @@ -4,7 +4,6 @@ const devConfig = require('./webpack.config.dev') const autoprefixer = require('autoprefixer') const precss = require('precss') const Copy = require('copy-webpack-plugin') -const webpack = require('webpack') const config = require('./config.json') // doing a string replace here because I spent a day trying to do it the "webpack" way diff --git a/client/coral-embed-stream/public/samplearticle.html b/client/coral-embed-stream/public/samplearticle.html index 493fc29fa..e973ee9be 100644 --- a/client/coral-embed-stream/public/samplearticle.html +++ b/client/coral-embed-stream/public/samplearticle.html @@ -9,7 +9,7 @@
diff --git a/client/coral-embed-stream/src/CommentStream.js b/client/coral-embed-stream/src/CommentStream.js index da5e25ff4..b8ec5c762 100644 --- a/client/coral-embed-stream/src/CommentStream.js +++ b/client/coral-embed-stream/src/CommentStream.js @@ -11,6 +11,7 @@ import Content from '../../coral-plugin-commentcontent/CommentContent' import PubDate from '../../coral-plugin-pubdate/PubDate' import Count from '../../coral-plugin-comment-count/CommentCount' import Flag from '../../coral-plugin-flags/FlagButton' +import AuthorName from '../../coral-plugin-author-name/AuthorName' import {ReplyBox, ReplyButton} from '../../coral-plugin-replies' import Pym from 'pym.js' @@ -110,13 +111,15 @@ class CommentStream extends Component { postItem={this.props.postItem} appendItemArray={this.props.appendItemArray} updateItem={this.props.updateItem} - id={rootItemId}/> + id={rootItemId} + reply={false}/> { rootItem.comments.map((commentId) => { const comment = this.props.items[commentId] - return
+ return
+
@@ -135,14 +138,16 @@ class CommentStream extends Component { postItem={this.props.postItem} appendItemArray={this.props.appendItemArray} updateItem={this.props.updateItem} - id={commentId} + id={rootItemId} + parent_id={commentId} showReply={comment.showReply}/> { comment.children && comment.children.map((replyId) => { let reply = this.props.items[replyId] - return
+ return
+
diff --git a/client/coral-embed-stream/style/default.css b/client/coral-embed-stream/style/default.css index 219a7aef5..9cf0fa3e8 100644 --- a/client/coral-embed-stream/style/default.css +++ b/client/coral-embed-stream/style/default.css @@ -56,7 +56,7 @@ hr { .coral-plugin-commentbox-textarea { flex: 1; - padding: 10px; + padding: 5px; } .coral-plugin-commentbox-button-container { @@ -75,6 +75,12 @@ hr { border-radius: 2px; } +.coral-plugin-commentbox-username { + width: 50%; + padding-left: 5px; + margin-bottom: 5px; +} + /* Comment styles */ .comment { margin-bottom: 10px; @@ -84,6 +90,12 @@ hr { margin-bottom: 10px; } +.coral-plugin-author-name-text { + display: inline-block; + margin-right: 10px; + font-weight: bolder; +} + /* Reply styles */ diff --git a/client/coral-embed-stream/webpack.config.dev.js b/client/coral-embed-stream/webpack.config.dev.js index 977300ecd..250276915 100644 --- a/client/coral-embed-stream/webpack.config.dev.js +++ b/client/coral-embed-stream/webpack.config.dev.js @@ -9,13 +9,14 @@ module.exports = { path.join(__dirname, 'src', 'app') ], output: { - path: path.join(__dirname, 'dist'), + path: path.join(__dirname, '..', '..','dist', 'coral-embed-stream'), filename: 'bundle.js', publicPath: '/' }, resolve: { root: [ - path.resolve(__dirname, 'src') + path.resolve(__dirname, 'src'), + path.resolve(__dirname, '..') ], extensions: ['', '.js', '.jsx'] }, diff --git a/client/coral-framework/store/actions/items.js b/client/coral-framework/store/actions/items.js index 019b1bfbe..443a41e94 100644 --- a/client/coral-framework/store/actions/items.js +++ b/client/coral-framework/store/actions/items.js @@ -97,12 +97,10 @@ export function getStream (assetId) { /* Check for root and child comments. */ if ( - item.type === 'comment' && item.asset_id === assetId && !item.parent_id) { rootComments.push(item.id) } else if ( - item.type === 'comment' && item.asset_id === assetId ) { let children = childComments[item.parent_id] || [] @@ -178,18 +176,22 @@ export function postItem (item, type, id) { } let options = { method: 'POST', - body: JSON.stringify(item) + body: JSON.stringify(item), + headers: { + 'Content-Type':'application/json' + } } - return fetch('api/v1/' + type, options) + console.log('postItem', options); + return fetch('/api/v1/' + type, options) .then( response => { - return response.ok ? response.json() + return response.ok ? response.text() : Promise.reject(response.status + ' ' + response.statusText) } ) - .then((json) => { - dispatch(addItem(json)) - return json.id + .then((id) => { + dispatch(addItem({...item, id})) + return id }) } } @@ -223,7 +225,7 @@ export function postAction (id, type, user_id) { } dispatch(appendItemArray(id, type, user_id)) - return fetch('api/v1/comments/' + id + '/actions', options) + return fetch('/api/v1/comments/' + id + '/actions', options) .then( response => { return response.ok ? response.text() diff --git a/client/coral-plugin-author-name/AuthorName.js b/client/coral-plugin-author-name/AuthorName.js new file mode 100644 index 000000000..04817da1c --- /dev/null +++ b/client/coral-plugin-author-name/AuthorName.js @@ -0,0 +1,9 @@ +import React from 'react' +const packagename = 'coral-plugin-author-name' + +const AuthorName = ({name}) => +
+ {name} +
+ +export default AuthorName diff --git a/client/coral-plugin-commentbox/CommentBox.js b/client/coral-plugin-commentbox/CommentBox.js index c893be075..b7d282f10 100644 --- a/client/coral-plugin-commentbox/CommentBox.js +++ b/client/coral-plugin-commentbox/CommentBox.js @@ -8,56 +8,67 @@ class CommentBox extends Component { static propTypes = { postItem: PropTypes.func, updateItem: PropTypes.func, - item_id: PropTypes.string, + id: PropTypes.string, comments: PropTypes.array, reply: PropTypes.bool } state = { - content: '' + body: '', + username: '' } postComment = () => { - const {postItem, updateItem, item_id, reply, addNotification, appendItemArray} = this.props + const {postItem, updateItem, id, parent_id, addNotification, appendItemArray} = this.props let comment = { - content: this.state.content + body: this.state.body, + asset_id: id, + username: this.state.username } let related - if (reply) { - comment.parent_id = item_id + if (parent_id) { + comment.parent_id = parent_id related = 'children' } else { - comment.asset_id = item_id related = 'comments' } - updateItem(item_id, 'showReply', false) + updateItem(parent_id, 'showReply', false) postItem(comment, 'comments') - .then((id) => { - appendItemArray(item_id, related, id) + .then((comment_id) => { + appendItemArray(parent_id || id, related, comment_id) addNotification('success', 'Your comment has been posted.') }).catch((err) => console.error(err)) - this.setState({content: ''}) + this.setState({body: ''}) } render () { const {styles, reply} = this.props // How to handle language in plugins? Should we have a dependency on our central translation file? return
+
+ this.setState({username: e.target.value})}/> +
+ className={name + '-container'}>