diff --git a/JoyceEditor_Mock.pdf b/JoyceEditor_Mock.pdf new file mode 100644 index 0000000..eec5bff Binary files /dev/null and b/JoyceEditor_Mock.pdf differ diff --git a/TODO.txt b/TODO.txt index 3fa6c64..5ebf463 100644 --- a/TODO.txt +++ b/TODO.txt @@ -9,13 +9,14 @@ Short List: - Some Testing +- Font Awesome / Better Glyphicons - Env Configs - Collapsable Button Lists - Draft.JS - DRY up Sass Modules - Async API Middleware - CombineReducers in App.js -- Import Actions into Reducers +- Import Action consts into Reducers - PropTypes - Loading Indicators diff --git a/package.json b/package.json index f27d458..9795b0d 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "clean-webpack-plugin": "^0.1.17", "css-loader": "^0.28.7", "extract-text-webpack-plugin": "^3.0.2", + "file-loader": "^1.1.5", "manifest-revision-webpack-plugin": "^0.4.1", "node-sass": "^4.6.0", "postcss-loader": "^2.0.8", diff --git a/src/actions/actions.js b/src/actions/actions.js deleted file mode 100644 index c0b2896..0000000 --- a/src/actions/actions.js +++ /dev/null @@ -1,22 +0,0 @@ -const setCurrentChapter = id => - ({ - type: 'GET_TEXT_DATA', - id: id - }) - -const toggleHighlight = () => - ({ - type: 'TOGGLE_HIGHLIGHT' - }) - -const updateEditorState = editorState => - ({ - type: 'UPDATE_EDITOR_STATE', - payload: editorState - }) - -export { - setCurrentChapter, - toggleHighlight, - updateEditorState -} \ No newline at end of file diff --git a/src/actions/index.js b/src/actions/index.js new file mode 100644 index 0000000..cb0fce6 --- /dev/null +++ b/src/actions/index.js @@ -0,0 +1,114 @@ +import axios from 'axios' +import EditorState from 'draft-js' + +let apiRoute = '/api/chapters/' + +const SELECT_CHAPTER = 'SELECT_CHAPTER' +const GET_CHAPTER_DATA = 'GET_CHAPTER_DATA' +const GET_CHAPTER_DATA_RECEIVED = 'GET_CHAPTER_DATA_RECEIVED' +const GET_CHAPTER_DATA_ERROR = 'GET_CHAPTER_DATA_ERROR' +const GET_TEXT_DATA = 'GET_TEXT_DATA' +const GET_TEXT_DATA_RECEIVED = 'GET_TEXT_DATA_RECEIVED' +const GET_TEXT_DATA_ERROR = 'GET_TEXT_DATA_ERROR' +const UPDATE_EDITOR_STATE = 'UPDATE_EDITOR_STATE' +const TOGGLE_HIGHLIGHT = 'TOGGLE_HIGHLIGHT' +const UPDATE_CHAPTER_TITLE = 'UPDATE_CHAPTER_TITLE' + +export const setCurrentChapter = id => + ({ + type: GET_TEXT_DATA, + id: id + }) + +export const toggleHighlight = () => + ({ + type: TOGGLE_HIGHLIGHT + }) + +export const updateChapterTitleInput = chapterTitleInput => { + return ({ + type: UPDATE_CHAPTER_TITLE, + data: chapterTitleInput.target.value + }) +} + +export const updateEditorState = editorState => + ({ + type: UPDATE_EDITOR_STATE, + data: editorState + }) + +export const chapterDataReceived = data => + ({ + type: GET_CHAPTER_DATA_RECEIVED, + data + }) + +export const chapterDataError = error => + ({ + type: GET_CHAPTER_DATA_ERROR, + error + }) + +export const textDataReceived = data => + ({ + type: GET_TEXT_DATA_RECEIVED, + data + }) + +export const textDataError = error => + ({ + type: GET_TEXT_DATA_ERROR, + error + }) + +export const setChapterEditor = chapter => + ({ + type: SET_EDITED_CHAPTER, + chapter + }) + +export const logger = store => next => action => { + console.group(action.type) + console.info('dispatching', action) + let result = next(action) + console.log('next state', store.getState()) + console.log('chapter count', store.getState().chapters.length) + console.groupEnd(action.type) + return result +} + +export const joyceAPIService = store => next => action => { + next(action) + switch(action.type) { + case GET_CHAPTER_DATA: + axios.get(apiRoute).then(res => { + const data = res.data + return next(chapterDataReceived(data)) + }).catch(error => { + return next(chapterDataError(error)) + }) + break + case GET_TEXT_DATA: + axios.get(apiRoute + action.id).then(res=> { + const data = res.data + return next(textDataReceived(data)) + }).catch(error => { + return next(textDataError(error)) + }) + break + case CREATE_CHAPTER: + const nextNumber = store.getState().chapters.length + 1 + const chapter = { + number: nextNumber, + title: '', + text: EditorState.createEmpty(), + } + store.dispatch(setChapterEditor(chapter)) + break + defaut: + break + } +} + +export const foo = 'bar' \ No newline at end of file diff --git a/src/assets/glyphicons-102-italic.png b/src/assets/glyphicons-102-italic.png new file mode 100644 index 0000000..376363c Binary files /dev/null and b/src/assets/glyphicons-102-italic.png differ diff --git a/src/assets/glyphicons-103-bold.png b/src/assets/glyphicons-103-bold.png new file mode 100644 index 0000000..ec61fd9 Binary files /dev/null and b/src/assets/glyphicons-103-bold.png differ diff --git a/src/assets/glyphicons-104-text-underline.png b/src/assets/glyphicons-104-text-underline.png new file mode 100644 index 0000000..be459a0 Binary files /dev/null and b/src/assets/glyphicons-104-text-underline.png differ diff --git a/src/assets/glyphicons-111-align-left.png b/src/assets/glyphicons-111-align-left.png new file mode 100644 index 0000000..2365b1d Binary files /dev/null and b/src/assets/glyphicons-111-align-left.png differ diff --git a/src/assets/glyphicons-112-align-center.png b/src/assets/glyphicons-112-align-center.png new file mode 100644 index 0000000..9a17fe2 Binary files /dev/null and b/src/assets/glyphicons-112-align-center.png differ diff --git a/src/assets/glyphicons-113-align-right.png b/src/assets/glyphicons-113-align-right.png new file mode 100644 index 0000000..f4dc27d Binary files /dev/null and b/src/assets/glyphicons-113-align-right.png differ diff --git a/src/assets/glyphicons-151-edit.png b/src/assets/glyphicons-151-edit.png new file mode 100644 index 0000000..bc03d5a Binary files /dev/null and b/src/assets/glyphicons-151-edit.png differ diff --git a/src/assets/glyphicons-191-plus-sign.png b/src/assets/glyphicons-191-plus-sign.png new file mode 100644 index 0000000..a114c46 Binary files /dev/null and b/src/assets/glyphicons-191-plus-sign.png differ diff --git a/src/assets/glyphicons-192-minus-sign.png b/src/assets/glyphicons-192-minus-sign.png new file mode 100644 index 0000000..593bd2a Binary files /dev/null and b/src/assets/glyphicons-192-minus-sign.png differ diff --git a/src/assets/glyphicons-193-remove-sign.png b/src/assets/glyphicons-193-remove-sign.png new file mode 100644 index 0000000..37730e1 Binary files /dev/null and b/src/assets/glyphicons-193-remove-sign.png differ diff --git a/src/assets/glyphicons-194-ok-sign.png b/src/assets/glyphicons-194-ok-sign.png new file mode 100644 index 0000000..bcd36a9 Binary files /dev/null and b/src/assets/glyphicons-194-ok-sign.png differ diff --git a/src/assets/glyphicons-224-chevron-right.png b/src/assets/glyphicons-224-chevron-right.png new file mode 100644 index 0000000..c2f161d Binary files /dev/null and b/src/assets/glyphicons-224-chevron-right.png differ diff --git a/src/assets/glyphicons-225-chevron-left.png b/src/assets/glyphicons-225-chevron-left.png new file mode 100644 index 0000000..2fffbd3 Binary files /dev/null and b/src/assets/glyphicons-225-chevron-left.png differ diff --git a/src/assets/glyphicons-352-book-open.png b/src/assets/glyphicons-352-book-open.png new file mode 100644 index 0000000..5108d41 Binary files /dev/null and b/src/assets/glyphicons-352-book-open.png differ diff --git a/src/assets/index.js b/src/assets/index.js new file mode 100644 index 0000000..a9aa556 --- /dev/null +++ b/src/assets/index.js @@ -0,0 +1,30 @@ +const glyphiconItalic = require('./glyphicons-102-italic.png') +const glyphiconBold = require('./glyphicons-103-bold.png') +const glyphiconUnderline = require('./glyphicons-104-text-underline.png') + +const glyphiconAlignLeft = require('./glyphicons-111-align-left.png') +const glyphiconAlignCenter = require('./glyphicons-112-align-center.png') +const glyphiconAlignRight = require('./glyphicons-113-align-right.png') + +const glyphiconChevronLeft = require('./glyphicons-225-chevron-left.png') +const glyphiconChevronRight = require('./glyphicons-224-chevron-right.png') + +const glyphiconPlusSign = require('./glyphicons-191-plus-sign.png') +const glyphiconMinusSign = require('./glyphicons-192-minus-sign.png') +const glyphiconRemoveSign = require('./glyphicons-193-remove-sign.png') +const glyphiconOKSign = require('./glyphicons-194-ok-sign.png') + +export { + glyphiconItalic, + glyphiconBold, + glyphiconUnderline, + glyphiconAlignLeft, + glyphiconAlignCenter, + glyphiconAlignRight, + glyphiconChevronLeft, + glyphiconChevronRight, + glyphiconPlusSign, + glyphiconMinusSign, + glyphiconRemoveSign, + glyphiconOKSign +} diff --git a/src/components/editorButtonGroup.js b/src/components/editorButtonGroup.js deleted file mode 100644 index ec8d95a..0000000 --- a/src/components/editorButtonGroup.js +++ /dev/null @@ -1,11 +0,0 @@ -import React from 'react' - -const EditorButtonGroup = () => -