Commit b1121399 authored by gijs's avatar gijs

Frontend for poem generation

parent 1817b74f
import { poemGet as apiPoemGet, print as apiPrint } from '../services/api';
export const MESSAGE_CLOSE = 'MESSAGE_CLOSE'; export const MESSAGE_CLOSE = 'MESSAGE_CLOSE';
export const SESSION_START = "SESSION_START"; export const SESSION_START = "SESSION_START";
export const PRINT = "PRINT"; export const PRINT = "PRINT";
export const PRINT_FAIL = "PRINT_FAIL";
export const PRINT_SUCCESS = "PRINT_SUCCESS";
export const messageClose = () => ({ type: MESSAGE_CLOSE }); export const messageClose = () => ({ type: MESSAGE_CLOSE });
export const sessionStart = () => ({ type: SESSION_START }); export const sessionStart = () => ({ type: SESSION_START });
export const print = () => ({ type: PRINT }); export const printPoem = () => (dispatch, _) => {
\ No newline at end of file dispatch({ type: PRINT })
apiPoemGet()
.then((data) => {
apiPrint(data['text'])
.then(() => dispatch(printSuccess()))
.catch(() => dispatch(printFail()))
})
.catch(() => dispatch(printFail()))
};
export const printSuccess = () => ({ type: PRINT_SUCCESS });
export const printFail = () => ({ type: PRINT_FAIL });
\ No newline at end of file
...@@ -17,6 +17,7 @@ export const Cleaner = class extends Component { ...@@ -17,6 +17,7 @@ export const Cleaner = class extends Component {
activeLineText, activeLineText,
lines, lines,
message, message,
canPrint,
hasUnsavedChanges, hasUnsavedChanges,
documentLoading, documentLoading,
documentStoring, documentStoring,
...@@ -28,7 +29,8 @@ export const Cleaner = class extends Component { ...@@ -28,7 +29,8 @@ export const Cleaner = class extends Component {
lineEditStart, lineEditStart,
lineMarkClean, lineMarkClean,
lineMarkDirty, lineMarkDirty,
messageClose messageClose,
printPoem
} = this.props; } = this.props;
return <section id="cleaner"> return <section id="cleaner">
...@@ -38,11 +40,13 @@ export const Cleaner = class extends Component { ...@@ -38,11 +40,13 @@ export const Cleaner = class extends Component {
activeLineIdx={ activeLineIdx } activeLineIdx={ activeLineIdx }
activeLineText={ activeLineText } activeLineText={ activeLineText }
lines={ lines } lines={ lines }
canPrint={ canPrint }
hasUnsavedChanges={ hasUnsavedChanges } hasUnsavedChanges={ hasUnsavedChanges }
documentLoading={ documentLoading } documentLoading={ documentLoading }
documentStoring={ documentStoring } documentStoring={ documentStoring }
documentLoad={ documentLoad } documentLoad={ documentLoad }
documentStore={ documentStore } documentStore={ documentStore }
printPoem={ printPoem }
lineEditCancel={ lineEditCancel } lineEditCancel={ lineEditCancel }
lineEditDone={ lineEditDone } lineEditDone={ lineEditDone }
lineEditSentence={ lineEditSentence } lineEditSentence={ lineEditSentence }
......
...@@ -45,19 +45,20 @@ export const Document = ({ ...@@ -45,19 +45,20 @@ export const Document = ({
documentStoring, documentStoring,
documentLoad, documentLoad,
documentStore, documentStore,
canPrint,
lineEditCancel, lineEditCancel,
lineEditDone, lineEditDone,
lineEditSentence, lineEditSentence,
lineEditStart, lineEditStart,
lineMarkClean, lineMarkClean,
lineMarkDirty, lineMarkDirty,
print printPoem
}) => ( }) => (
<section class="document"> <section class="document">
<section class="document--actions"> <section class="document--actions">
<button onClick={ documentLoad } disabled={ documentLoading }>{ t('load_document') }</button> <button onClick={ documentLoad } disabled={ documentLoading }>{ t('load_document') }</button>
<button onClick={ documentStore } disabled={ (!hasUnsavedChanges) || documentStoring }>{ t('store_document') }</button> <button onClick={ documentStore } disabled={ (!hasUnsavedChanges) || documentStoring }>{ t('store_document') }</button>
<button onClick={ print } disabled>{ t('print') }</button> <button onClick={ printPoem } disabled={ !canPrint }>{ t('print') }</button>
</section> </section>
<section class="document--title"> <section class="document--title">
<header>{ t('cleaning') }: { document }</header> <header>{ t('cleaning') }: { document }</header>
......
...@@ -2,7 +2,7 @@ import { bindActionCreators } from 'redux'; ...@@ -2,7 +2,7 @@ import { bindActionCreators } from 'redux';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { lineEditCancel, lineEditDone, lineEditSentence, lineEditStart, lineMarkClean, lineMarkDirty } from '../actions/lines'; import { lineEditCancel, lineEditDone, lineEditSentence, lineEditStart, lineMarkClean, lineMarkDirty } from '../actions/lines';
import { documentLoad, documentStore } from '../actions/document'; import { documentLoad, documentStore } from '../actions/document';
import { messageClose } from '../actions/application'; import { messageClose, printPoem } from '../actions/application';
import Cleaner from '../components/Cleaner' import Cleaner from '../components/Cleaner'
...@@ -23,7 +23,8 @@ function mapDispatchToProps (dispatch) { ...@@ -23,7 +23,8 @@ function mapDispatchToProps (dispatch) {
lineEditStart, lineEditStart,
lineMarkClean, lineMarkClean,
lineMarkDirty, lineMarkDirty,
messageClose messageClose,
printPoem
}, dispatch); }, dispatch);
} }
......
...@@ -4,8 +4,9 @@ export const messages = { ...@@ -4,8 +4,9 @@ export const messages = {
'document_success': 'Saved corrections', 'document_success': 'Saved corrections',
'document_load': 'Loading a document...', 'document_load': 'Loading a document...',
'document_load_fail': 'Could not load a document', 'document_load_fail': 'Could not load a document',
'print': 'Print a cleaning poem',
'print_active': 'Printing poem', 'print_active': 'Printing poem',
'print': 'Print a cleaning poeam', 'print_fail': 'Could not print the poem',
'line_mark_clean': 'Mark clean', 'line_mark_clean': 'Mark clean',
'line_mark_dirty': 'Mark dirty / noise', 'line_mark_dirty': 'Mark dirty / noise',
'line_edit': 'Edit sentence', 'line_edit': 'Edit sentence',
......
import { import {
MESSAGE_CLOSE, MESSAGE_CLOSE,
PRINT PRINT,
PRINT_SUCCESS,
PRINT_FAIL
} from '../actions/application'; } from '../actions/application';
import { import {
...@@ -59,15 +61,19 @@ export default function example (state = initialState, action) { ...@@ -59,15 +61,19 @@ export default function example (state = initialState, action) {
case LINE_EDIT_DONE: case LINE_EDIT_DONE:
return simpleUpdate(state, { cleanCount: state.cleanCount + 1, hasUnsavedChanges: true }) return simpleUpdate(state, { cleanCount: state.cleanCount + 1, hasUnsavedChanges: true, canPrint: true })
case LINE_MARK_CLEAN: case LINE_MARK_CLEAN:
return simpleUpdate(state, { cleanCount: state.cleanCount + 1, hasUnsavedChanges: true }) return simpleUpdate(state, { cleanCount: state.cleanCount + 1, hasUnsavedChanges: true, canPrint: true })
case LINE_MARK_DIRTY: case LINE_MARK_DIRTY:
return simpleUpdate(state, { cleanCount: state.cleanCount + 1, hasUnsavedChanges: true }) return simpleUpdate(state, { cleanCount: state.cleanCount + 1, hasUnsavedChanges: true, canPrint: true })
case PRINT: case PRINT:
return simpleUpdate(state, { canPrint: false, message: t('print_active') }) return simpleUpdate(state, { message: t('print_active') })
case PRINT_SUCCESS:
return simpleUpdate(state, { message: null, canPrint: false })
case PRINT_FAIL:
return simpleUpdate(state, { message: t('print_fail') })
default: default:
return state; return state;
......
...@@ -65,12 +65,42 @@ const post = (url, data) => { ...@@ -65,12 +65,42 @@ const post = (url, data) => {
return promise; return promise;
} }
const external_post = (url, data) => {
const promise = new Promise((resolve, reject) => {
let postData = new FormData();
for (const key in data) {
if (data.hasOwnProperty(key)) {
postData.append(key, data[key]);
}
}
fetch(url, {
method: "POST",
body: postData
}).then((response) => {
if (response.ok) {
response.json()
.then((data) => resolve(data))
.catch(reject);
} else {
reject();
}
}).catch(reject);
});
return promise;
}
export const documentGet = () => get('document') export const documentGet = () => get('document')
export const documentPost = (document, lines) => post('update_document', { document, lines: JSON.stringify(lines) }) export const documentPost = (document, lines) => post('update_document', { document, lines: JSON.stringify(lines) })
export const linePost = (document, line, sentence, clean ) => post('update_line', { document, line, sentence, clean }) export const linePost = (document, line, sentence, clean ) => post('update_line', { document, line, sentence, clean })
export const print = () => {} export const poemGet = () => get('get_poem')
export const print = (text) => external_post('http://cleaner.local/print', { text: text })
export default { documentGet, documentPost, linePost, print } export default { documentGet, documentPost, linePost, poemGet, print }
\ No newline at end of file \ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment