Merge pull request #8 from coralproject/mock-stream-endpoint

Mocking stream endpoint
This commit is contained in:
Riley Davis
2016-11-04 10:58:38 -06:00
committed by GitHub
12 changed files with 155 additions and 97 deletions
+1
View File
@@ -6,5 +6,6 @@ const express = require('express');
const app = express();
app.use('/api/v1', require('./routes/api'));
app.use('/client/', express.static('./dist'));
module.exports = app;
@@ -0,0 +1,16 @@
<html>
<head>
</head>
<body>
<div style="margin-left:auto; margin-right:auto; width:500px">
<h1>Lorem ipsum</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut lobortis sollicitudin eros a ornare. Curabitur dignissim vestibulum massa non rhoncus. Cras laoreet ante vel nunc hendrerit, ac imperdiet neque egestas. Suspendisse aliquet iaculis fermentum. Pellentesque interdum nec elit sed tincidunt. Donec volutpat, tellus posuere laoreet consequat, mi lacus laoreet massa, sed vehicula mauris velit non lectus. Integer non enim nec neque congue faucibus porttitor sit amet dui.</p>
<p>Nunc pharetra orci id diam feugiat, vitae rutrum magna efficitur. Morbi porttitor blandit lorem, et facilisis tellus luctus at. Morbi tincidunt eget nisl id placerat. Nullam consectetur quam vel mauris lacinia, non consectetur est faucibus. Duis cursus auctor nulla nec sagittis. Aenean sem erat, ultrices a hendrerit consectetur, accumsan non lorem. Integer ac neque sed magna sodales vulputate at quis neque. Praesent eget ornare lacus. Donec ultricies, dolor eget commodo faucibus, arcu velit ullamcorper tellus, in cursus tellus elit sed urna. Suspendisse in consequat magna. Duis vel ullamcorper tortor, vel cursus libero. Proin et nisi luctus ligula faucibus luctus. Morbi pulvinar, justo ac feugiat elementum, libero tellus congue justo, pharetra ultrices felis felis id leo. Integer mattis quam tempus libero porta, ac pretium ligula elementum.</p>
<div id='coralStreamEmbed'></div>
<script type='text/javascript' src='http://pym.nprapps.org/pym.v1.min.js'></script>
<script>
var pymParent = new pym.Parent('coralStreamEmbed', 'index.html', {});
pymParent.onMessage('height', function(height) {document.querySelector('#coralStreamEmbed iframe').height = height + 'px'})</script>
</div>
</body>
</html>
+19 -21
View File
@@ -14,7 +14,7 @@ import Flag from '../../coral-plugin-flags/FlagButton'
import {ReplyBox, ReplyButton} from '../../coral-plugin-replies'
import Pym from 'pym.js'
const {addItem, updateItem, postItem, getItemsQuery, postAction, appendItemRelated} = itemActions
const {addItem, updateItem, postItem, getStream, postAction, appendItemArray} = itemActions
const {addNotification, clearNotification} = notificationActions
const {setLoggedInUser} = authActions
@@ -38,8 +38,8 @@ const {setLoggedInUser} = authActions
postItem: (data, type, id) => {
return dispatch(postItem(data, type, id))
},
getItemsQuery: (rootId) => {
return dispatch(getItemsQuery(rootId))
getStream: (rootId) => {
return dispatch(getStream(rootId))
},
addNotification: (type, text) => {
return dispatch(addNotification(type, text))
@@ -53,8 +53,8 @@ const {setLoggedInUser} = authActions
postAction: (item, action, user) => {
return dispatch(postAction(item, action, user))
},
appendItemRelated: (item, property, value) => {
return dispatch(appendItemRelated(item, property, value))
appendItemArray: (item, property, value) => {
return dispatch(appendItemArray(item, property, value))
}
}
}
@@ -72,7 +72,7 @@ class CommentStream extends Component {
// Set up messaging between embedded Iframe an parent component
// Using recommended Pym init code which violates .eslint standards
new Pym.Child({ polling: 500 })
this.props.getItemsQuery('assetTest')
this.props.getStream('assetTest')
}
render () {
@@ -97,60 +97,58 @@ class CommentStream extends Component {
const rootItemId = 'assetTest'
const rootItem = this.props.items[rootItemId]
console.log(this.props.items);
return <div>
{
rootItem ?
<div>
<div id="commentBox">
<Count
item_id={rootItemId}
id={rootItemId}
items={this.props.items}/>
<CommentBox
addNotification={this.props.addNotification}
postItem={this.props.postItem}
appendItemRelated={this.props.appendItemRelated}
appendItemArray={this.props.appendItemArray}
updateItem={this.props.updateItem}
item_id={rootItemId}/>
id={rootItemId}/>
</div>
{
rootItem.related.comment.map((commentId) => {
rootItem.comments.map((commentId) => {
const comment = this.props.items[commentId]
return <div className="comment">
<hr aria-hidden={true}/>
<PubDate created_at={comment.created_at}/>
<Content content={comment.data.content}/>
<Content content={comment.body}/>
<div className="commentActions">
<Flag
addNotification={this.props.addNotification}
item_id={commentId}
id={commentId}
flag={comment.flag}
postAction={this.props.postAction}
currentUser={this.props.auth.user}/>
<ReplyButton
updateItem={this.props.updateItem}
item_id={commentId}/>
id={commentId}/>
</div>
<ReplyBox
addNotification={this.props.addNotification}
postItem={this.props.postItem}
appendItemRelated={this.props.appendItemRelated}
appendItemArray={this.props.appendItemArray}
updateItem={this.props.updateItem}
item_id={commentId}
id={commentId}
showReply={comment.showReply}/>
{
comment.related &&
comment.related.child &&
comment.related.child.map((replyId) => {
comment.children &&
comment.children.map((replyId) => {
let reply = this.props.items[replyId]
return <div className="reply">
<hr aria-hidden={true}/>
<PubDate created_at={reply.created_at}/>
<Content content={reply.data.content}/>
<Content content={reply.body}/>
<div className="replyActions">
<Flag
addNotificiation={this.props.addNotification}
item_id={replyId}
id={replyId}
flag={reply.flag}
postAction={this.props.postAction}
currentUser={this.props.auth.user}/>
+4 -4
View File
@@ -8,7 +8,7 @@ module.exports = {
devtool: 'source-map',
entry: [
'babel-polyfill',
'./src/app'
path.join(__dirname, 'src', 'app')
],
output: {
path: path.join(__dirname, '..', '..','dist', 'coral-embed-stream'),
@@ -23,13 +23,13 @@ module.exports = {
},
plugins: [
new Copy([{
from: './index.html'
from: path.join(__dirname, 'index.html')
},
{
from: './style/default.css'
from: path.join(__dirname, 'style', 'default.css')
},
{
from: './public/',
from: path.join(__dirname, 'public'),
to: './'
},
{
+66 -53
View File
@@ -10,7 +10,6 @@ import mocks from '../../mocks.json'
export const ADD_ITEM = 'ADD_ITEM'
export const UPDATE_ITEM = 'UPDATE_ITEM'
export const APPEND_ITEM_ARRAY = 'APPEND_ITEM_ARRAY'
export const APPEND_ITEM_RELATED = 'APPEND_ITEM_RELATED'
/**
* Action creators
@@ -26,13 +25,13 @@ export const APPEND_ITEM_RELATED = 'APPEND_ITEM_RELATED'
*/
export const addItem = (item) => {
if (!item.item_id) {
if (!item.id) {
console.warn('addItem called without an item id.')
}
return {
type: ADD_ITEM,
item: item,
item_id: item.item_id
id: item.id
}
}
@@ -41,36 +40,26 @@ export const addItem = (item) => {
* Useful for item-level toggles, etc.
*
* @params
* item_id - the id of the item to be posted
* id - the id of the item to be posted
* property - the property to be updated
* value - the value that the property should be set to
*
*/
export const updateItem = (item_id, property, value) => {
export const updateItem = (id, property, value) => {
return {
type: UPDATE_ITEM,
item_id,
id,
property,
value
}
}
export const appendItemArray = (item_id, property, value) => {
export const appendItemArray = (id, property, value) => {
return {
type: APPEND_ITEM_ARRAY,
item_id,
property,
value
}
}
export const appendItemRelated = (item_id, property, value) => {
return {
type: APPEND_ITEM_RELATED,
item_id,
id,
property,
value
}
@@ -89,26 +78,50 @@ export const appendItemRelated = (item_id, property, value) => {
* @dispatches
* A set of items to the item store
*/
export function getItemsQuery (rootId) {
export function getStream (assetId) {
return (dispatch) => {
// return fetch('/v1/exec/view/' + rootId)
// .then(
// response => {
// return response.ok ? response.json() : Promise.reject(response.status + ' ' + response.statusText)
// }
// )
// .then((json) => {
// let items = json.results[0].Docs
// for (var i = 0; i < items.length; i++) {
// dispatch(addItem(items[i]))
// }
// return (items)
// })
console.log('Loading mock data', mocks);
let mockData = mocks.query
for (var i=0; i < mockData.length; i++ ) {
dispatch(addItem(mockData[i]))
}
return fetch('/api/v1/stream?asset_id='+assetId)
.then(
response => {
return response.ok ? response.json() : Promise.reject(response.status + ' ' + response.statusText)
}
)
.then((json) => {
/* Sort comments by date*/
let rootComments = []
let childComments = {}
const sorted = json.sort((a,b) => b.created_at - a.created_at)
sorted.reduce((prev, item) => {
dispatch(addItem(item))
/* 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] || []
childComments[item.parent_id] = children.concat(item.id)
}
}, {})
dispatch(addItem({
id: assetId,
comments: rootComments
}))
const keys = Object.keys(childComments)
for (var i=0; i < keys.length; i++ ) {
dispatch(updateItem(keys[i], 'children', childComments[keys[i]]))
}
return (json)
})
}
}
@@ -158,21 +171,16 @@ export function getItemsArray (ids) {
* The newly put item to the item store
*/
export function postItem (data, type, id) {
export function postItem (item, type, id) {
return (dispatch) => {
let item = {
type,
data,
version: 1
}
if (id) {
item.item_id = id
item.id = id
}
let options = {
method: 'POST',
body: JSON.stringify(item)
}
return fetch('/v1/item', options)
return fetch('api/v1/' + type, options)
.then(
response => {
return response.ok ? response.json()
@@ -180,9 +188,8 @@ export function postItem (data, type, id) {
}
)
.then((json) => {
// Patch until ID is returned from backend
dispatch(addItem(json))
return json.item_id
return json.id
})
}
}
@@ -194,7 +201,7 @@ export function postItem (data, type, id) {
* Posts an action to an item
*
* @params
* item_id - the id of the item on which the action is taking place
* id - the id of the item on which the action is taking place
* action - the name of the action
* user - the user performing the action
* host - the coral host
@@ -204,13 +211,19 @@ export function postItem (data, type, id) {
*
*/
export function postAction (item, action, user) {
export function postAction (id, type, user_id) {
return (dispatch) => {
let options = {
method: 'POST'
const action = {
type,
user_id
}
dispatch(appendItemArray(item, action, user))
return fetch('/v1/action/' + action + '/user/' + user + '/on/item/' + item, options)
const options = {
method: 'POST',
body: JSON.stringify(action)
}
dispatch(appendItemArray(id, type, user_id))
return fetch('api/v1/comments/' + id + '/actions', options)
.then(
response => {
return response.ok ? response.text()
@@ -8,18 +8,13 @@ const initialState = fromJS({})
export default (state = initialState, action) => {
switch (action.type) {
case actions.ADD_ITEM:
return state.set(action.item_id, fromJS(action.item))
return state.set(action.id, fromJS(action.item))
case actions.UPDATE_ITEM:
return state.updateIn([action.item_id, 'data', action.property], () =>
return state.updateIn([action.id, action.property], () =>
fromJS(action.value)
)
case actions.APPEND_ITEM_ARRAY:
return state.updateIn([action.item_id, 'data', action.property], (prop) => {
return prop ? prop.push(action.value) : fromJS([action.value])
}
)
case actions.APPEND_ITEM_RELATED:
return state.updateIn([action.item_id, 'related', action.property], (prop) => {
return state.updateIn([action.id, action.property], (prop) => {
return prop ? prop.push(action.value) : fromJS([action.value])
}
)
@@ -2,16 +2,16 @@ import React from 'react'
const name = 'coral-plugin-comment-count'
const CommentCount = ({items, item_id}) => {
const CommentCount = ({items, id}) => {
let count = 0
if (items[item_id]) {
count += items[item_id].related.comment.length
if (items[id]) {
count += items[id].comments.length
}
const itemKeys = Object.keys(items)
for (var i=0; i < itemKeys.length; i++) {
const item = items[itemKeys[i]]
if (item.type === 'comment' && item.related && item.related.child) {
count += item.related.child.length
if (item.type === 'comment' && item.children) {
count += item.children.length
}
}
+5 -5
View File
@@ -18,22 +18,22 @@ class CommentBox extends Component {
}
postComment = () => {
const {postItem, updateItem, item_id, reply, addNotification, appendItemRelated} = this.props
const {postItem, updateItem, item_id, reply, addNotification, appendItemArray} = this.props
let comment = {
content: this.state.content
}
let related
if (reply) {
comment.parent_id = item_id
related = 'child'
related = 'children'
} else {
comment.asset_id = item_id
related = 'comment'
related = 'comments'
}
updateItem(item_id, 'showReply', false)
postItem(comment, 'comment')
postItem(comment, 'comments')
.then((id) => {
appendItemRelated(item_id, related, id)
appendItemArray(item_id, related, id)
addNotification('success', 'Your comment has been posted.')
}).catch((err) => console.error(err))
this.setState({content: ''})
+1 -1
View File
@@ -11,7 +11,7 @@ const ReplyBox = (props) => <div
item_id = {props.item_id}
postItem = {props.postItem}
addNotification = {props.addNotification}
appendItemRelated = {props.appendItemRelated}
appendItemArray = {props.appendItemArray}
updateItem = {props.updateItem}
comments = {props.child}
reply = {true}/>
+1
View File
@@ -5,6 +5,7 @@
"main": "app.js",
"scripts": {
"start": "./bin/www",
"build": "webpack --config ./client/coral-embed-stream/webpack.config.js",
"lint": "eslint .",
"pretest": "npm install",
"test": "mocha tests",
+1
View File
@@ -3,6 +3,7 @@ const express = require('express');
const router = express.Router();
router.use('/comments', require('./comments'));
router.use('/stream', require('./stream'));
router.use('/settings', require('./settings'));
router.use('/queue', require('./queue'));
+33
View File
@@ -0,0 +1,33 @@
const express = require('express');
const router = express.Router();
router.get('/', (req, res) => {
console.log('Stream endpoint has been hit with asset_id ', req.query.asset_id);
res.json([
{
'id': 'abc',
'type': 'comment',
'body': 'Sample comment',
'created_at': new Date().getTime(),
'asset_id': 'assetTest'
},
{
'id': 'xyz',
'type': 'comment',
'body': 'Sample reply',
'created_at': new Date().getTime() - 600000,
'parent_id': 'abc',
'asset_id': 'assetTest'
},
{
'id': 'def',
'type': 'comment',
'body': 'Another comment',
'created_at': new Date().getTime() - 400000,
'asset_id': 'assetTest'
}
]);
});
module.exports = router;