diff --git a/client/src/app/main/dashboard/dashboard-create-ticket/create-ticket-form.js b/client/src/app/main/dashboard/dashboard-create-ticket/create-ticket-form.js
index c04ae6b4..98f7b5e6 100644
--- a/client/src/app/main/dashboard/dashboard-create-ticket/create-ticket-form.js
+++ b/client/src/app/main/dashboard/dashboard-create-ticket/create-ticket-form.js
@@ -1,7 +1,6 @@
import React from 'react';
import _ from 'lodash';
import {connect} from 'react-redux';
-import {EditorState, convertToRaw} from 'draft-js';
import history from 'lib-app/history';
import i18n from 'lib-app/i18n';
@@ -13,6 +12,7 @@ import LanguageSelector from 'app-components/language-selector';
import Captcha from 'app/main/captcha';
import Header from 'core-components/header';
+import TextEditor from 'core-components/text-editor';
import Form from 'core-components/form';
import FormField from 'core-components/form-field';
import SubmitButton from 'core-components/submit-button';
@@ -33,7 +33,7 @@ class CreateTicketForm extends React.Component {
message: null,
form: {
title: '',
- content: EditorState.createEmpty(),
+ content: TextEditor.createEmpty(),
departmentIndex: 0,
email: '',
name: '',
@@ -162,4 +162,3 @@ export default connect((store) => {
allowAttachments: store.config['allow-attachments']
};
})(CreateTicketForm);
-
diff --git a/client/src/app/main/dashboard/dashboard-layout.js b/client/src/app/main/dashboard/dashboard-layout.js
index ae51fca4..99545ff4 100644
--- a/client/src/app/main/dashboard/dashboard-layout.js
+++ b/client/src/app/main/dashboard/dashboard-layout.js
@@ -14,7 +14,7 @@ class DashboardLayout extends React.Component {
-
+
{this.props.children}
diff --git a/client/src/core-components/form-field.js b/client/src/core-components/form-field.js
index c1e38ef3..f8ae8a6b 100644
--- a/client/src/core-components/form-field.js
+++ b/client/src/core-components/form-field.js
@@ -27,7 +27,7 @@ class FormField extends React.Component {
field: React.PropTypes.oneOf(['input', 'textarea', 'select', 'checkbox', 'checkbox-group', 'file']),
fieldProps: React.PropTypes.object
};
-
+
static defaultProps = {
field: 'input',
fieldProps: {}
@@ -118,7 +118,7 @@ class FormField extends React.Component {
return classNames(classes);
}
-
+
getFieldProps() {
let props = _.extend({}, this.props.fieldProps, {
disabled: this.isDisabled(),
@@ -172,7 +172,7 @@ class FormField extends React.Component {
this.props.onChange(event)
}
}
-
+
isDisabled() {
const fieldProps = this.props.fieldProps;
@@ -186,4 +186,4 @@ class FormField extends React.Component {
}
}
-export default FormField;
\ No newline at end of file
+export default FormField;
diff --git a/client/src/core-components/text-editor.js b/client/src/core-components/text-editor.js
index 486fbd90..ffcba1e4 100644
--- a/client/src/core-components/text-editor.js
+++ b/client/src/core-components/text-editor.js
@@ -3,19 +3,24 @@ import classNames from 'classnames';
import {Editor} from 'react-draft-wysiwyg';
import {EditorState, ContentState, convertFromHTML} from 'draft-js';
import {stateToHTML} from 'draft-js-export-html';
+import {isIE} from 'lib-core/navigator';
class TextEditor extends React.Component {
static propTypes = {
errored: React.PropTypes.bool,
onChange: React.PropTypes.func,
- value: React.PropTypes.object
+ value: React.PropTypes.oneOfType([
+ React.PropTypes.object, React.PropTypes.string
+ ])
};
-
+
static createEmpty() {
- return EditorState.createEmpty()
+ if(isIE()) return '';
+ return EditorState.createEmpty();
}
-
+
static getEditorStateFromHTML(htmlString) {
+ if(isIE()) return htmlString;
const blocksFromHTML = convertFromHTML(htmlString);
const state = ContentState.createFromBlockArray(
blocksFromHTML.contentBlocks,
@@ -26,31 +31,51 @@ class TextEditor extends React.Component {
}
static getHTMLFromEditorState(editorState) {
+ if(isIE()) return editorState;
return stateToHTML(editorState.getCurrentContent());
}
-
+
static isEditorState(editorState) {
+ if(isIE()) return typeof editorState === 'String';
return editorState && editorState.getCurrentContent;
}
state = {
- value: EditorState.createEmpty(),
+ value: TextEditor.createEmpty(),
focused: false
};
render() {
return (
-
+ {isIE() ? this.renderTextArea() : this.renderDraftJS()}
);
}
+ renderDraftJS() {
+ return ;
+ }
+
+ renderTextArea() {
+ return (
+
+ );
+ }
+
getClass() {
let classes = {
'text-editor': true,
'text-editor_errored': (this.props.errored),
'text-editor_focused': (this.state.focused),
+ 'text-editor_textarea': isIE(),
[this.props.className]: (this.props.className)
};
@@ -94,6 +119,7 @@ class TextEditor extends React.Component {
}
onEditorChange(value) {
+ if(isIE()) value = value.target.value;
this.setState({value});
if (this.props.onChange) {
@@ -119,9 +145,13 @@ class TextEditor extends React.Component {
focus() {
if (this.refs.editor) {
- this.refs.editor.focusEditor();
+ if(isIE()) {
+ this.refs.editor.focus();
+ } else {
+ this.refs.editor.focusEditor();
+ }
}
}
}
-export default TextEditor;
\ No newline at end of file
+export default TextEditor;
diff --git a/client/src/core-components/text-editor.scss b/client/src/core-components/text-editor.scss
index 0111a48a..07e81be1 100644
--- a/client/src/core-components/text-editor.scss
+++ b/client/src/core-components/text-editor.scss
@@ -28,4 +28,12 @@
border: 1px solid $primary-red;
}
}
-}
\ No newline at end of file
+
+ &_textarea {
+ .text-editor__editor {
+ height: 200px;
+ padding-left: 10px;
+ width: 100%;
+ }
+ }
+}
diff --git a/client/src/index.html b/client/src/index.html
index 8271ea09..3e5e5b7a 100755
--- a/client/src/index.html
+++ b/client/src/index.html
@@ -15,7 +15,8 @@
+