diff --git a/src/actions/editor.js b/src/actions/editor.js
new file mode 100644
index 00000000..c9e35448
--- /dev/null
+++ b/src/actions/editor.js
@@ -0,0 +1,8 @@
+export const SWITCH_VISUAL_MODE = 'SWITCH_VISUAL_MODE';
+
+export function switchVisualMode(useVisualMode) {
+ return {
+ type: SWITCH_VISUAL_MODE,
+ payload: useVisualMode
+ };
+}
diff --git a/src/components/Widgets/MarkdownControl.js b/src/components/Widgets/MarkdownControl.js
index f27285c0..0e7e9850 100644
--- a/src/components/Widgets/MarkdownControl.js
+++ b/src/components/Widgets/MarkdownControl.js
@@ -1,16 +1,59 @@
import React, { PropTypes } from 'react';
+import RawEditor from './MarkdownControlElements/RawEditor';
import VisualEditor from './MarkdownControlElements/VisualEditor';
+import { connect } from 'react-redux';
+import { switchVisualMode } from '../../actions/editor';
class MarkdownControl extends React.Component {
+ constructor(props){
+ super(props);
+ this.useVisualEditor = this.useVisualEditor.bind(this);
+ this.useRawEditor = this.useRawEditor.bind(this);
+ }
+
+ useVisualEditor(){
+ this.props.switchVisualMode(true);
+ }
+
+ useRawEditor(){
+ this.props.switchVisualMode(false);
+ }
+
+ renderEditor() {
+ const { editor, onChange, onAddMedia, getMedia, value } = this.props;
+ if (editor.get('useVisualMode')) {
+ return (
+
+
+
+
+ );
+ } else {
+ return (
+
+
+
+
+ );
+ }
+ }
+
render() {
- const { onChange, onAddMedia, getMedia, value } = this.props;
return (
-
+
+
+ { this.renderEditor() }
+
);
}
}
@@ -18,8 +61,15 @@ class MarkdownControl extends React.Component {
export default MarkdownControl;
MarkdownControl.propTypes = {
+ editor: PropTypes.object.isRequired,
onChange: PropTypes.func.isRequired,
onAddMedia: PropTypes.func.isRequired,
getMedia: PropTypes.func.isRequired,
+ switchVisualMode: PropTypes.func.isRequired,
value: PropTypes.node,
};
+
+export default connect(
+ state => ({ editor: state.editor }),
+ { switchVisualMode }
+)(MarkdownControl);
diff --git a/src/reducers/editor.js b/src/reducers/editor.js
new file mode 100644
index 00000000..2273e708
--- /dev/null
+++ b/src/reducers/editor.js
@@ -0,0 +1,14 @@
+import { Map } from 'immutable';
+import { SWITCH_VISUAL_MODE } from '../actions/editor';
+
+const editor = (state = Map({ useVisualMode: true }), action) => {
+ switch (action.type) {
+ case SWITCH_VISUAL_MODE:
+ return Map({ useVisualMode: action.payload });
+
+ default:
+ return state;
+ }
+};
+
+export default editor;
diff --git a/src/reducers/index.js b/src/reducers/index.js
index ecdac295..f7199111 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -1,5 +1,6 @@
import auth from './auth';
import config from './config';
+import editor from './editor';
import entries, * as fromEntries from './entries';
import entryDraft from './entryDraft';
import collections from './collections';
@@ -9,6 +10,7 @@ const reducers = {
auth,
config,
collections,
+ editor,
entries,
entryDraft,
medias